.flex-container {
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;
}

.flex-center{
    align-items: center;
    justify-content: center;
}

.flex-align-items-start{
    align-items: flex-start;
}

.flex-gap_1{
    gap: 1em 2em;
}

.flex-gap_2{
    gap: 2em 3em;
}

.flex-gap_3{
    gap: 3em 4em;
}

.flex-gap_4{
    gap: 4em 5em;
}

.flex-gap_5{
    gap: 5em 6em;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-basis_20 {
    flex-basis: 20%;
}

.flex-basis_25 {
    flex-basis: 25%;
}

.flex-basis_30 {
    flex-basis: 30%;
}

.flex-basis_33 {
    flex-basis: 33%;
}

.flex-basis_50 {
    flex-basis: 50%;
}

.flex-basis_70{
    flex-basis: 70%;
}

/* FLEXBOX ENDE */
/*Builder.io START*/

.builder-hydrated a:link,
.builder-hydrated a:visited {
    text-decoration: none !important;
}

/*Builder.io ENDE*/
.img-responsive {
    max-width: 100%;
    height: auto;
}

a .no_link{
    text-decoration: none !important;
}

@font-face {
    font-family: 'SourceSerifPro-SemiBold';
    src: local('SourceSerifPro-SemiBold'), local('SourceSerifPro-SemiBold'),
    url('google/fonts/SourceSerifPro/SourceSerifPro-SemiBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-Bold.eot');
    src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
    url('google/fonts/SourceSansPro/SourceSansPro-Bold.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-Bold.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-Bold.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-ExtraLightItalic.eot');
    src: local('Source Sans Pro ExtraLight Italic'), local('SourceSansPro-ExtraLightItalic'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLightItalic.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLightItalic.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-Light.eot');
    src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
    url('google/fonts/SourceSansPro/SourceSansPro-Light.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-Light.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-Light.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-BoldItalic.eot');
    src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldItalic'),
    url('google/fonts/SourceSansPro/SourceSansPro-BoldItalic.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-BoldItalic.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-BoldItalic.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-LightItalic.eot');
    src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightItalic'),
    url('google/fonts/SourceSansPro/SourceSansPro-LightItalic.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-LightItalic.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-LightItalic.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-Black.eot');
    src: local('Source Sans Pro Black'), local('SourceSansPro-Black'),
    url('google/fonts/SourceSansPro/SourceSansPro-Black.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-Black.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-Black.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-Regular.eot');
    src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
    url('google/fonts/SourceSansPro/SourceSansPro-Regular.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-Regular.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-Regular.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-SemiBold.eot');
    src: local('Source Sans Pro SemiBold'), local('SourceSansPro-SemiBold'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBold.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBold.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBold.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-Italic.eot');
    src: local('Source Sans Pro Italic'), local('SourceSansPro-Italic'),
    url('google/fonts/SourceSansPro/SourceSansPro-Italic.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-Italic.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-Italic.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-SemiBoldItalic.eot');
    src: local('Source Sans Pro SemiBold Italic'), local('SourceSansPro-SemiBoldItalic'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBoldItalic.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBoldItalic.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-BlackItalic.eot');
    src: local('Source Sans Pro Black Italic'), local('SourceSansPro-BlackItalic'),
    url('google/fonts/SourceSansPro/SourceSansPro-BlackItalic.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-BlackItalic.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-BlackItalic.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('google/fonts/SourceSansPro/SourceSansPro-ExtraLight.eot');
    src: local('Source Sans Pro ExtraLight'), local('SourceSansPro-ExtraLight'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLight.eot?#iefix') format('embedded-opentype'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLight.woff2') format('woff2'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLight.woff') format('woff'),
    url('google/fonts/SourceSansPro/SourceSansPro-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

/*!* latin-ext *!*/
/*@font-face {*/
/*  font-family: 'Lato';*/
/*  font-style: italic;*/
/*  font-weight: 400;*/
/*  src: local('Lato Italic'), local('Lato-Italic'), url(google/fonts/YMOYVM-eg6Qs9YzV9OSqZfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2'), url(google/fonts/LqowQDslGv4DmUBAfWa2Vw.ttf) format('truetype');*/
/*  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;*/
/*  font-display: swap;*/
/*}*/
/*!* latin *!*/
/*@font-face {*/
/*  font-family: 'Lato';*/
/*  font-style: italic;*/
/*  font-weight: 400;*/
/*  src: local('Lato Italic'), local('Lato-Italic'), url(google/fonts/PLygLKRVCQnA5fhu3qk5fQ.woff2) format('woff2'), url(google/fonts/LqowQDslGv4DmUBAfWa2Vw.ttf) format('truetype');*/
/*  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;*/
/*  font-display: swap;*/
/*}*/
/*!* latin-ext *!*/
/*@font-face {*/
/*  font-family: 'Lato';*/
/*  font-style: normal;*/
/*  font-weight: 400;*/
/*  src: local('Lato Regular'), local('Lato-Regular'), url(google/fonts/UyBMtLsHKBKXelqf4x7VRQ.woff2) format('woff2'), url(google/fonts/v0SdcGFAl2aezM9Vq_aFTQ.ttf) format('truetype');*/
/*  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;*/
/*  font-display: swap;*/
/*}*/
/*!* latin *!*/
/*@font-face {*/
/*  font-family: 'Lato';*/
/*  font-style: normal;*/
/*  font-weight: 400;*/
/*  src: local('Lato Regular'), local('Lato-Regular'), url(google/fonts/1YwB1sO8YE1Lyjf12WNiUA.woff2) format('woff2'), url(google/fonts/v0SdcGFAl2aezM9Vq_aFTQ.ttf) format('truetype');*/
/*  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;*/
/*  font-display: swap;*/
/*}*/
/*!* latin-ext *!*/
/*@font-face {*/
/*  font-family: 'Lato';*/
/*  font-style: normal;*/
/*  font-weight: 700;*/
/*  src: local('Lato Bold'), local('Lato-Bold'), url(google/fonts/ObQr5XYcoH0WBoUxiaYK3_Y6323mHUZFJMgTvxaG2iE.woff2) format('woff2'), url(google/fonts/DvlFBScY1r-FMtZSYIYoYw.ttf) format('truetype');*/
/*  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;*/
/*  font-display: swap;*/
/*}*/
/*!* latin *!*/
/*@font-face {*/
/*  font-family: 'Lato';*/
/*  font-style: normal;*/
/*  font-weight: 700;*/
/*  src: local('Lato Bold'), local('Lato-Bold'), url(google/fonts/H2DMvhDLycM56KNuAtbJYA.woff2) format('woff2'), url(google/fonts/DvlFBScY1r-FMtZSYIYoYw.ttf) format('truetype');*/
/*  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;*/
/*  font-display: swap;*/
/*}*/


.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-feature-settings: 'liga';
    -moz-osx-font-smoothing: grayscale;
    vertical-align: middle;
    margin-right: 5px;
}

.material-icons-outlined{
    font-family: 'Material Icons Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-feature-settings: 'liga';
    -moz-osx-font-smoothing: grayscale;
    vertical-align: middle;
    margin-right: 5px;
}



.material-icons.aktion1, .material-icons-outlined.aktion1 { color: #5B59E3; }
.material-icons.aktion2, .aktion2, .material-icons-outlined.aktion2 { color: rgba(35, 69, 124, 1); }
.material-icons.aktion2, .aktion2, .material-icons-outlined.aktion2 { color: #091182; }
.material-icons.aktion3, .material-icons-outlined.aktion3 { color: rgba(230, 73, 37, 1); }
.material-icons.grau, .material-icons-outlined.grau    { color: rgba(132, 128, 119, 1); }
.material-icons.rot, .material-icons-outlined.rot     { color: rgba(247, 76, 30, 1); }
.material-icons.gelb, .material-icons-outlined.gelb    { color: #FFD500; }
.material-icons.gruen, .material-icons-outlined.gruen   { color: #4CD29E; }
.material-icons.disabled, .material-icons-outlined.disabled { color: #E0E0E0;}

.material-icons.md-16, .material-icons-outlined.md-16 {
    font-size: 16px;
    font-size: 1rem;
}

.material-icons.md-24, .material-icons-outlined.md-24 {
    font-size: 24px;
    font-size: 1.5rem;
}
.material-icons.md-36, .material-icons-outlined.md-36 {
    font-size: 36px;
    font-size: 2.25rem;
}

.material-icons.md-18 { font-size: 18px !important; }
.material-icons.md-24 { font-size: 24px !important; }
.material-icons.md-48 { font-size: 48px !important; }





html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym,
address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%;
    vertical-align: baseline; }

a img, :link img, :visited img { border: 0; }
table { border-collapse: collapse; border-spacing: 0; width: 100%;}
ol, ul { list-style: none; }


/*
------------------------------
	impromptu start
------------------------------
*/
.impromptuwarning .impromptu{ background-color: #aaaaaa; }
.impromptufade{
    position: absolute;
    background: rgba(0,0,0,0.6);
}
div.impromptu{
    position: absolute;
    background-color: #FBFBFB;
    width: 500px;
    text-align: left;
    z-index: 999;
}

div.impromptu .impromptuclose{
    float: right;
    margin: 2px 2px 0 0;
    cursor: pointer;
    color: #000000;
    font-weight: bold;
    width: 16px; height: 16px;

}

div.impromptu .impromptucontainer{
    background-color: #FBFBFB;
    padding: 5px;
}

div.impromptu .impromptumessage{
    background-color: #FBFBFB;
    padding: 10px;
    color: #000000;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 22px;
}

div.impromptu .impromptubuttons{
    text-align: center;
    padding: 10px 0 10px 0;
}

div.impromptu button{
    border-width: 0;
    border-radius: 15px;
    box-shadow: 1px 3px 0 0 #dddddd;
    background-color: #EEE;
    transition: background-color .3s;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 0.5px;
    line-height: 28px;
    display: inline-block;
    padding: 0 1.5rem;
    outline: none;
    font-weight: 600;
    color: #FFF;
    background-color: #091182;
    cursor: pointer;
    margin: 0 10px;
}

div.impromptu button:hover {
    background-color: #3A419B;
}

div.impromptu #impromptu_state0_buttonnein{
    margin: 0 20px;
}


















/* jQuery.Rating Plugin CSS - http://www.fyneworks.com/jquery/star-rating/ */

div.rating{cursor:pointer;margin:2em;clear:both;display:block}

div.rating:after{content:'.';display:block;height:0;width:0;clear:both;visibility:hidden}

div.cancel,div.star{float:left;width:24px;height:22px;text-indent:-999em;cursor:pointer;display:block;background:transparent;overflow:hidden}

div.cancel,div.cancel a{background:url('../img/delete.gif') no-repeat 0 -22px}

div.star,div.star a{background:url('../img/star.png') no-repeat 0 0px}

div.cancel a,div.star a{display:block;width:24px;height:100%;background-position:0 0px;}

div.star_on a{background-position:0 -22px!important}

div.star_hover a,div.star_live a:hover{background-position:0 -44px}

/* Read Only CSS */

div.star_readonly a,div.star_readonly a:hover{cursor:default !important}

/* Partial Star CSS */

div.star{background:transparent!important;overflow:hidden!important}

/* END jQuery.Rating Plugin CSS */







.tabs{
    margin-bottom: 20px;
}

.tabs ul.tabs_liste{
    list-style: none;
    margin: 0;
    padding: 0;
}
.tabs ul.tabs_liste li{
    float: left;
    height: 35px;
    border-right: 2px white solid;
    background-color: #F4F4F4;
}
.tabs ul.tabs_liste li:hover{
    background-color: #7C7C7C;
}
.tabs ul.tabs_liste li:hover a{
    color: white;
}

.tabs ul.tabs_liste li > a{
    padding: 0 8px;
    line-height: 35px;
}

.tabs ul.tabs_liste li > a.current{
    border-bottom: 3px #091182 solid;
    padding-bottom: 7px;
}

.tabs ul.tabs_liste a.current{
    font-weight: 600;
}


.tabs a, .tabs a:visited {
    text-decoration: none;
}



a:active {
    outline:none;
}

:focus {
    -moz-outline-style:none;
    outline-style: none;
}














body{
    margin: 0px;
    font-family: "Source Sans Pro", Sans-Serif, Georgia, Tahoma;
    font-size: 14px !important;
    font-size: 0.875rem;
    color: #000000;
}

strong{ font-weight: 700; }

#page{
    margin: 0 auto 0 auto;
    width: 1140px;
}

#leiste_oben{
    background-color: #434343;
    color: white;
    padding: 5px 30px;
}

.sticky_ag_bewertung_sterne i{
    margin-top: 50px;
}

#header {
    width: 100%;
    height: 67px;
    background-color: #F6F6F6;
}

#header #header_content{
    margin: 0 auto 0 auto;
    width: 1110px;
    padding: 0 15px;

}

#header #header_content{
    margin: 0 auto 0 auto;
    width: 1110px;
    padding: 0 15px;
}

#header img.float_left {
    margin: 10px 60px 0 0;
}

#header img.logo_eingeloggt {
    margin: 15px 0 0 0;
}

#header ul{
    list-style: none;
    float: right;
    margin-top: 4px;
}

#header ul.menu{
    margin: 10px 0 0 0;
}

#header ul.menu li.projekt, #header ul.menu li.support, #header ul.menu li.news, #header ul.menu li.nachricht,
#header ul.menu li.konto, #header ul.menu li.account, #header ul.menu li.bewertung, #header ul.menu li.todo{
    margin: 0 25px 0 0;
}

#header ul.menu li.account{
    margin: 0;
}


#header ul.menu a, #header ul.menu_eingeloggt a{
    font-size: 16px;
    font-size: 1rem;
    font-weight: 700;
}


#header ul li{
    float: left;
    margin-left: 25px;
    height: 25px;
}

#header ul li a{
    font-weight: bold;
}

#header *{ vertical-align: top; }
#header li img{ margin: 0 5px 0 5px; }
#leiste_oben ul li.tel{ background: url(../img/layout/tel.png) left top no-repeat; background-position: 0 3px; padding-left: 20px; }
#header ul li.account{
    padding-left: 22px;
    border-left: 1px #ECECEC solid;
}

#header ul li .material-icons{
    line-height: 20px;
}



#header ul li.support a.has_sub, #header ul li.account a.has_sub, #header ul li.news a.has_sub, #header ul li.todo a.has_sub{
    padding-left: 0;
}



#header ul a.marker{
    line-height: 6px;
    font-size: 10px;
    font-size: 0.625rem;
    color: white;
}

#header ul a.marker:hover{
    text-decoration: none !important;
}


#header ul a.marker span{
    background-color: #8C8C8C;
    padding: 1px 3px;
    border-width: 0;
    border-radius: 3px;
}






#leiste_oben .login a{
    color: white;
    text-decoration: none;
    background: url(../img/layout/login.png) left top no-repeat;
    background-position: 0 2px;
    padding-left: 20px;
}

#leiste_oben ul{
    margin: 0;
    padding: 0;
    list-style: none;
    float: right;
}

#leiste_oben ul li{
    float: left;
    margin-left: 30px;
}

#header #header_content .submenu_list{
    margin:0px;
}

#header #header_content #submenu_2 .submenu_list, .dropdown #submenu_77 .submenu_list{
    padding: 0;
    border-top: none;
}


#header #header_content #submenu_2 .submenu_list li{
    height: 45px;
    line-height: 30px;
}

#header #header_content #submenu_2 .submenu_list li:last-child{
    border-bottom: none;
}


#header #header_content .submenu_list li a{
    font-size: 14px;
    font-size: 0.875rem;
    margin: 0;
}


#navi {
    width: 100%;
    height: 40px;
    border-bottom: 3px solid #F9F9F9;
}

#header #navi, body#projekt #navi {
    border-bottom: none;
}


#navi #navi_content{
    margin: 0 auto 0 auto;
    width: 1110px;
    height: 40px;
    padding: 0 15px;
}

#header #navi_content{
    margin: 1px 0 0 0;
    width: auto;
    float: left;
}

#navi ul{
    margin: 2px 0 0 0;
    padding: 0;
    float: left;
}

#navi ul li{
    padding: 5px 15px 0 0;
    height: 30px;
    margin: 0 10px 0 0;
    list-style-type:none;
    float: left;
}
#navi ul li.small{ width: 80px; }
#navi ul li a{
    text-decoration: none;
    font-size: 16px;
    font-size: 1rem;
    font-weight: 700;
}
#navi ul li a:hover, #footer_content a:hover, #header a:hover, .wettbewerbe a:hover, a.jetzt:hover, a.nound:hover{ text-decoration: underline !important; }

#navi_content ul li.has-sub ul li a, .dropdown  li a, .a_aktiv{
    color: white !important;
}


.menu_eingeloggt{
    margin: 9px 0 0 0 !important;
    float: left !important;
}

#navi #anmelden_block{
    float: right;
}
#navi #anmelden li{
    padding-right: 0;
    margin-right: 0;
}

.content{
    width: 1110px;
    padding: 20px 15px 30px 15px;
    min-height: 800px;
}

a {color: #000000; text-decoration: underline;}
a:hover{ text-decoration: none; }

.no_link {
    color: #000000; text-decoration: none;
}

#header a, #footer_content a, a.nound{ text-decoration: none; }
span.trenner { margin: 0 10px 0 10px;}

.durchstrich {text-decoration: line-through; }


#footer_content{
    padding: 60px 0;
    font-size: 16px;
    font-size: 1rem;
}


#footer_content .btn_aktion1_label, #footer_links{
    font-size: 16px;
    font-size: 1rem;
}

#footer_content div ul a{
    padding-left: 23px;
}

#footer_content div ul, #footer_links ul{
    margin: 30px 0 0 0;
}

#footer_content div li, #footer_links li{
    list-style-type:none;
    line-height: 32px;
}

#footer_links ul{
    float: left;
}

#footer_links li{
    float: left;
    margin:  0 20px 30px 0;
}

#designbeispiele_balken #footer_links ul {
    margin: 20px 0 0 0;
}

#designbeispiele_balken #footer_links li{
    margin:  0 25px 10px 0;
}

#footer_links .float_right{
    line-height: 20px;
    margin: 36px 0 0 0;
}

#footer_links .float_right img{
    vertical-align: middle;
    margin-left: 5px;
}

/*.projekt_starten_navi ul{*/
/*    line-height: 14px;*/
/*}*/

ul { list-style: square; margin: 0 0 15px 15px; padding: 0; line-height: 20px;}
ul.highlight{ color: #5B59E3; }

.bold, .bold a, strong, strong a { font-weight: 600; }
.normal, .normal a { font-weight: normal !important; }
.inline{ display: inline; }
.hand, .pointer, input.btn { cursor: pointer; }
.cursor_help { cursor: help; }


span.ref{ text-decoration: underline; }

button.btn_wo, input[type="submit"], input[type="reset"] {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

input.field_error{
    border: 1px solid #E64925 !important;
}

input, textarea, select {
    border: 1px #D3D3D3 solid;
    background-color: white;
    font-family: "Source Sans Pro", Sans-Serif;
    font-size: 14px;
    font-size: 0.875rem;
    color: #000000;
    line-height: 13px;
}

input[type="radio"] {
    /*
    margin-top: -1px;
    */
    vertical-align: middle;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #000000;
}
::-moz-placeholder { /* Firefox 19+ */
    color: #000000;
}
:-ms-input-placeholder { /* IE 10+ */
    color: #000000;
}
:-moz-placeholder { /* Firefox 18- */
    color: #000000;
}


input, select {
    vertical-align:middle;
    font-weight:normal;
}

input.trans{
    vertical-align: text-top;
}

img { border: 0; }

.float_left{  float: left; }
.float_right{ float: right;}
.clear{ clear: both;}

.fontsize14, .fontsize14 a, a.fontsize14 { font-size: 14px; font-size: 0.875rem; }
.fontsize16, .fontsize16 a, a.fontsize16 { font-size: 16px; font-size: 1rem; }
.fontsize18, .fontsize18 a, a.fontsize18 { font-size: 18px; font-size: 1.125rem; }
.fontsize20, .fontsize20 a, a.fontsize20 { font-size: 20px; font-size: 1.25rem; }
.fontsize22, .fontsize22 a, a.fontsize22 { font-size: 22px; font-size: 1.375rem; }
.fontsize24, .fontsize24 a, a.fontsize24 { font-size: 24px; font-size: 1.5rem; }
.fontsize10, .fontsize10 a, a.fontsize10 { font-size: 10px; font-size: 0.625rem;}
.fontsize11, .fontsize11 a, a.fontsize11 { font-size: 11px; font-size: 0.6875rem;}
.fontsize12, .fontsize12 a, a.fontsize12 { font-size: 12px; font-size: 0.75rem; }
.fontsize64, .fontsize64 a, a.fontsize64 { font-size: 64px;  font-size: 4.0rem; }




p { margin-bottom: 15px; }
.ohneAbstand{ margin-bottom: 0; }
.middle *{ vertical-align: middle; }
.text_top *{ vertical-align: text-top !important; }
.vertical_align_bottom *{ vertical-align: bottom !important; }
.padding_20{
    padding: 20px;
    box-sizing: border-box;
}

.haken{ background: url(../img/layout/sprite.png) left top no-repeat; background-position: -50px -3550px; padding-left: 40px; min-height: 24px; }
.haken *{ vertical-align: middle;}
.haken img{ margin-right: 5px;}
.haken strong{ vertical-align: baseline;}

h2{ margin: 10px 0 15px 0; font-size: 24px; font-size: 1.5rem; font-weight: bold;}
h3{ margin: 7px 0 15px 0; font-size: 19px; font-size: 1.1875rem; font-weight: bold;}
h4{
    margin: 25px 0 15px 0;
    font-size: 16px;
    font-size: 1rem;
    font-weight: bold;
    width: 100%;
    border-bottom: 2px solid #EFEFEF;
    padding-bottom: 10px;
    box-sizing: border-box;
}

#projektstart h4{
    border-bottom: none !important;
}

h3 a{ font-size: 17px; font-size: 1.0625rem; color: #091182; font-weight: normal;}
h4 a{ font-size: 12px; font-size: 0.75rem; font-weight: normal; margin-left: 10px; }
h4 .hinweis{ font-size: 11px; font-size: 0.6875rem; color: #848077; font-weight: normal; }

h4.aufgabe{
    background: url(../img/layout/titel_aufgabe.png) left top no-repeat;
    padding-left: 40px;

}
h4.angebot{
    background: url(../img/layout/titel_angebot.png) left top no-repeat;
    padding-left: 40px;
}
h4.transfer{
    background: url(../img/layout/titel_transfer.png) left top no-repeat;
    padding-left: 40px;
}
h4.kommentar{
    background: url(../img/layout/comments.png) left top no-repeat;
    padding-left: 40px;
}
h4.lizenz{
    background: url(../img/layout/titel_lizenz.png) left top no-repeat;
    padding-left: 40px;
}

h4.stern{
    background: url(../img/layout/titel_stern.png) left top no-repeat;
    padding-left: 40px;
}
h4.projekt{
    background: url(../img/layout/titel_projekt.svg) left top no-repeat;
    padding-left: 40px;
}



.seitenabstand{ margin: 0 30px 0 30px;}
.overhid{ overflow: hidden; }

h3 input.trans{ margin-top: -3px;}

h1 { margin-bottom: 10px; font-size: 26px; font-size: 1.625rem; font-weight: normal;  line-height: 36px; }
h1 span{ font-size: 26px; font-size: 1.625rem; color: #000000; font-weight: normal; line-height: 36px; }
h1 span a{ color: #000000; }





.trennlinie{
    width: 100%;
    height: 10px;
    clear: both;
    border-top: 1px #ECECEC solid;
}

.zentriert{ width: 100%; min-height: 10px; clear: both; margin: 10px auto 10px auto; text-align: center;}

.display_block{
    display: block;
}

#aktuell div{ width: 100%; margin: 0 0 5px 0; font-size: 14px; font-size: 0.875rem; color: #000000; font-weight: normal; }
#aktuell div a{ color: #5B59E3; font-size: 14px; font-size: 0.875rem; }
#aktuell{ width: 100%; padding: 0 0 0 0; margin:0 auto 10px auto; text-align: center;}
#aktuell div span{ color: #5B59E3; font-weight: normal;}
#aktuell div b{ font-size: 14px; font-size: 0.875rem; font-weight: normal;}


ul.unstyled {
    list-style: none;
}


.navi_links ul, .navi_links_text ul{
    list-style: none;
    background-color: #F6F6F6;
    margin: 0;
    padding: 10px 0 5px 0;
}

.navi_links ul li, .navi_links_text ul li{
    margin: 0;
    padding: 0px 20px 5px 20px;
}
.navi_links ul li:last-child{
    border-bottom: none;
}

.navi_links ul li.jetzt, .navi_links ul li.jetzt:hover{
    font-weight: bold;
}

.navi_links ul li{
    line-height: 32px;
}

.navi_links_text ul li{
    line-height: 32px;
}
.navi_links ul li a{
    text-decoration: none;
    border-bottom: 2px solid #ECECEC;
    width: 100%;
    display: block;
    line-height: 36px;
    background: url(../img/layout/pfeil_rechts_6_10_grau.png) right 14px no-repeat;
}

.navi_links ul li.jetzt a{
    background-image: url(../img/layout/pfeil_rechts_6_10_blau.png);
}

.navi_links ul li:last-child a{
    border-bottom: none;
}

body#hilfe .navi_links{
    margin-top: 40px;
}

/* TODO: nadja - hilfe bnt standart*/
/*body#hilfe a{*/
/*    color:#000000;*/
/*}*/

body#hilfe .navi_links ul li a{
    font-size: 16px;
    font-size: 1rem;
    line-height: 36px;
}

p.text_antwort_weiter{
    padding: 0 30px 10px 0;
    background: url(../img/layout/pfeil_rechts_blau_11_17.png) right 15px no-repeat;
    cursor: pointer;
    margin-bottom: 25px;
}

body#hilfe .hilfethemen{
    margin: 20px;
}

body#hilfe .haken_liste_aktion2 li{
    background: url(../img/layout/pfeil_rechts_blau_11_17.png) left 4px no-repeat;
}

body#hilfe .header_hg {
    height: 330px;
    background-size: cover;
    background-position: center center;
    overflow: hidden;
    background: url(../img/layout/head-hilfe.jpg) no-repeat center center;
    color: white;
    box-sizing: border-box;
    padding-top: 60px;
}
body#hilfe .header_hg form div{
    background-color: white;
    display: inline-block;
}

body#hilfe .header_hg form input{
    border: none;
    padding: 15px 30px;
    width: 220px;
    font-size: 16px;
    font-size: 1rem;

}

body#hilfe .header_hg form input::placeholder{
    color: #848077;
}

body#hilfe .hilfe_inhalt img{
    max-width: 100%;
    height: auto;
}


body#voting .header_hg {
    height: 330px;
    background-position: center center;
    overflow: hidden;
    background: url(../img/layout/head-voting-blau.jpg) no-repeat center center;
    color: white;
    box-sizing: border-box;
    padding-top: 60px;
}





body#projekt .navi_links{
    margin-top: 20px;
}

body#projekt .navi_links li{
    position: relative;
}
body#projekt .navi_links li span.new_items {
    top: 4px;
    right: auto;
    margin-left: 5px;
    left: 30px;
}


body#projekt .navi_links ul{
    background-color: transparent;
}


body#projekt .navi_links ul li{
    padding: 0;
    border: none;
    height: 55px;
}

body#projekt .navi_links ul li.text{
    height: 30px;
    background-color: #F6F6F6;
    padding: 10px 0 0 14px;
}

body#projekt .navi_links ul li.trenner{
    height: 1px;
    padding-top: 0;
}

body#projekt .navi_links ul li.trenner span{
    border-top: 1px #EFEFEF solid;
    display: block;
    width: 95%;
}

body#projekt .navi_links ul li a{
    height: 55px;
    display: block;
    padding-left: 60px;
    line-height: 54px;
    background: #F6F6F6 url(../img/layout/no_avatar.png) 14px center no-repeat;
    background-size: 27px;
    font-weight: 400;
    font-size: 14px;
    font-size: 0.875rem;
    width: auto;
}

body#projekt .navi_links ul li a.current{
    color: #000000;
    background-color: #DCDCDC !important;
}

body#projekt .navi_links ul li a.kommentare{
    background: #F4F4F4 url(../img/layout/comments.png) 17px 15px no-repeat;
}

body#projekt .navi_links ul li.text:hover{
    background-color: #F6F6F6;
}


body#projekt .navi_links ul li:hover a{
    background-color: #dcdcdc;
    color: #000000;
}
body#projekt .navi_links ul li.highlight a{
    color: #5B59E3;
    font-weight: bold;
}
body#projekt .navi_links ul li.highlight:hover a{
    color: #5B59E3;
    font-weight: bold;
}


body#projekt .panes textarea.formfield_breit {
    width: 530px;
    height: 80px;
    float: none;
}

body#projekt .panes p.textarea_hinweis{
    margin: 5px 0 5px 0;
}

.projekt_header .content{
    padding-bottom: 0;
    min-height: inherit;
}

.projekt_header{
    background-color: #F6F6F6;
    border-bottom: 2px #EFEFEF solid;
}







.grau { color: #848077; }
.white { color: white; }
.highlight, .highlight a{ color: #5B59E3; }
.highlight_titel, .highlight_titel a{ color: #5B59E3; font-weight: bold;}
.border_blue_top{ border-top: 2px #5B59E3 solid; }
.border_blue_right{ border-right: 2px #5B59E3 solid; }
.border_blue_left{ border-left: 2px #5B59E3 solid; }
.border_blue_bottom{ border-bottom: 2px #5B59E3 solid; }

.border_top{ border-top: 1px #E6E6E6 solid; }
.border_right{ border-right: 1px #E6E6E6 solid; }
.border_left{ border-left: 1px #E6E6E6 solid; }
.border_bottom{ border-bottom: 1px #E6E6E6 solid; }

.highlight2, .highlight2 a{ color: #CF4BAC; }
.highlight3, .highlight3 a{ color: #46C85B; }






.postit .button {margin : 15px 0 0 15px;}





.button{ width: 180px; color: #EDF8FA; background-color: #0091C0; font-weight: bold; border: 1px #7CC4DC solid; padding: 5px 0 5px 0; text-align: center; }
.button a, .button_wide a, .button_small a { color: #EDF8FA; text-decoration: none;}
.btnLink{ cursor: pointer;}


fieldset { margin-bottom: 10px; }
label { width: 180px; display: block; float: left; font-weight: bold; padding-right: 15px;}

.formfield { width: 300px; height: 28px; display: block; float: left; }
textarea.formfield{
    height: 150px;
    line-height: 18px;
}

.formfield_breit { width: 628px; height: 28px; display: block; float: left;}
.formfield_schmall { width: 150px; height: 28px;}
textarea.formfield_breit{
    height: 150px;
    line-height: 18px;
}

.formfield_550 { width: 550px; height: 28px;display: block; float: left;}
textarea.formfield_550{
    height: 80px;
    line-height: 18px;
}

.form_feld_spalte{
    margin-left: 195px;
}


form label span { color: #7c7c7c; display: block; height: 30px; padding: 3px 0 10px 0; font-size: 11px; font-size: 0.6875rem; font-weight: normal;}


.form_label{
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: 700;
    float: none;
    margin-bottom: 10px;
    width: 100%;
    box-sizing: border-box;
}

.form_input{
    width: 100%;
    height: 35px;
    box-sizing: border-box;
}

textarea.form_input{
    height: 80px;
    line-height: 16px;
}

.form_tipp{
    font-size: 16px;
    font-size: 1rem;
    color: #999999;
    font-style: italic;
    margin: 10px 0 50px 0;
    width: 100%;
    box-sizing: border-box;
}

a.link, p.link{
    padding: 0 0 0 15px;
    /*background-image: url(../img/layout/sprite.png);*/
    /*background-position: -50px -2456px;*/
    background-repeat: no-repeat;
}

/*a.link:before, p.link:before{*/
/*    content-visibility:visible;*/
/*    font-family: 'Material Icons';*/
/*    content: '\e865';*/
/*    color: red;*/
/*}*/

.meldung{
    background-color: #091182;
    font-weight: bold;
    margin: 0 0 15px 0;
    padding: 14px 10px 12px 10px;
    color: white;
    font-size: 14px;
    font-size: 0.875rem;
}

.meldung.meldung_rot{
    background-color: #E64925;
}


.meldung.meldung_wrapped{
    display: flex;
    flex-direction: row;
    gap: 5px;
    justify-content: flex-start;
}

.meldung.meldung_wrapped .message{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.meldung.meldung_wrapped .message .message_title{
    font-weight: bold;
}
.meldung.meldung_wrapped .message .message_desc{
    font-weight: 400;
}



.meldung a{
    color: white;
}

.m-a-0 {margin: 0px !important;}
.p-a-0 {padding: 0px !important;}
.p-l-0 {padding-left: 0px !important;}
.p-b-0{padding-bottom: 0 !important;}
.p-a-8 {padding: 8px !important;}
.p-a-10 {padding: 10px !important;}
.p-a-15 {padding: 15px !important;}
.p-a-20 {padding: 20px !important;}
.p-a-30 {padding: 30px !important;}
.p-a-40 {padding: 40px !important;}
.p-a-50 {padding: 50px !important;}
.m-t-0{margin-top: 0px !important;}
.m-b-0{margin-bottom: 0 !important;}
.p-t-0{padding-top: 0px !important;}
.l-h-50{line-height: 50px !important;}

.p-t-10{padding-top: 10px;}
.p-t-20{padding-top: 20px;}
.p-t-30{padding-top: 30px;}
.p-t-40{padding-top: 40px;}
.p-t-50{padding-top: 50px;}

.p-l-10{padding-left: 10px}
.p-l-20{padding-left: 20px;}
.p-l-30{padding-left: 30px;}
.p-l-40{padding-left: 40px;}
.p-l-50{padding-left: 50px;}

.p-b-10{padding-bottom: 10px;}
.p-b-20{padding-bottom: 20px;}
.p-b-30{padding-bottom: 30px;}
.p-b-40{padding-bottom: 40px;}
.p-b-50{padding-bottom: 50px;}

.link_space{ width: 1px; padding-left: 15px; }
.m-l-3,.margin_left_3{ margin-left: 3px; }
.m-l-5,.margin_left_5{ margin-left: 5px; }
.m-l-10,.margin_left_10{ margin-left: 10px; }
.m-l-20,.margin_left_20{ margin-left: 20px; }
.m-l-25,.margin_left_25{ margin-left: 25px; }
.m-l-30,.margin_left_30{ margin-left: 30px; }
.m-l-40,.margin_left_40{ margin-left: 40px; }
.m-l-50,.margin_left_50{ margin-left: 50px; }

.m-b-60,.margin_bottom_60{ margin-bottom: 60px; }
.m-b-50,.margin_bottom_50{ margin-bottom: 50px; }
.m-b-40,.margin_bottom_40{ margin-bottom: 40px; }
.m-b-30,.margin_bottom_30{ margin-bottom: 30px; }
.m-b-20,.margin_bottom_20{ margin-bottom: 20px; }
.m-b-10,.margin_bottom_10{ margin-bottom: 10px; }
.m-b-3,.margin_bottom_3{ margin-bottom: 3px; }
.m-b-5, .margin_bottom_5{ margin-bottom: 5px; }

.m-t-60,.margin_top_60{ margin-top: 60px; }
.m-t-50,.margin_top_50{ margin-top: 50px; }
.m-t-30, .margin_top_30{ margin-top: 30px; }
.m-t-20, .margin_top_20{ margin-top: 20px; }
.m-t-15, .margin_top_15{ margin-top: 15px; }
.m-t-10,.margin_top_10{ margin-top: 10px; }
.m-t-7, .margin_top_7{ margin-top: 7px; }
.m-t-5,.margin_top_5{ margin-top: 5px; }
.m-r-10, .margin_right_10{ margin-right: 10px; }
.m-r-5, .margin_right_5{ margin-right: 5px; }
.m-r-20,.margin_right_20{ margin-right: 20px; }
.lh22{ line-height: 22px; }
.lh26{ line-height: 26px; }

.fw_normal {
    font-weight:normal !important;
}

.fw700{
    font-weight: 700 !important;
}

.fw900{
    font-weight: 900 !important;
}

.txt_color_white {
    color:  #FFFFFF !important;
}

.txt_color_black {
    color:  black !important;
}

.txt_color_violet {
    color:  #5B59E3; !important;
}

h1.spalte_text_headline, h2.spalte_text_headline, h3.spalte_text_headline{
    margin-top: 80px;
    line-height: normal;
}

h2.zitat_mit_avatar img{
    margin: 15px 0 30px 0;
}
h2.zitat_mit_avatar img{
    float: left;
    margin-right: 30px;
}

th{ padding: 7px 5px 7px 6px; text-align: left; border-bottom: 1px #E6E6E6 solid;  }
th.asc{ background: url(../img/layout/arrow_up.png) 0 15px no-repeat; }
th.desc{ background: url(../img/layout/arrow_down.png) 0 15px no-repeat;  }
th .sortNow{ margin-left: 10px; }
td{ padding: 7px 5px 7px 6px; text-align: left;  }
td.abstand{ height: 1px; font-size: 1px; padding: 0 !important; line-height: 5px;}
td.trans{ background-color: transparent; padding: 7px 7px 7px 6px; }



dl { margin-bottom: 20px; overflow: hidden; }
dt, dd { min-height: 20px; margin: 5px 0; line-height: 14px; float: left;  }
dt { width: 180px; clear: both; }
dd { width: 350px; }










/* ----- RASTER Start ----- */

.breite100 .breite100_content{
    width: 1110px;
    margin: 0 auto 0 auto;
    padding: 0 15px;
}

.breite20{
    width: 20%;
    box-sizing: border-box;
}
.breite25{
    width: 25%;
    box-sizing: border-box;
}
.breite40{
    width: 40%;
    box-sizing: border-box;
}
.breite33{
    width: 33%;
    box-sizing: border-box;
}
.breite50{
    width: 50%;
    box-sizing: border-box;
}
.breite60{
    width: 60%;
    box-sizing: border-box;
}
.breite66{
    width: 66%;
    box-sizing: border-box;
}

.breite100 .breite100_content .breite50, #page .content .breite50{
   width: 540px;

}

.breite100 .breite100_content .breite66, #page .content .breite66{
    width:66%;

}

.breite100 .breite100_content .breite33{
   width: 350px;

}

.breite100 .breite100_content .breite25, #page .content .breite25{
    width:25%;

}
.breite100 .breite100_content .breite20, #page .content .breite20{
    width:20%;

}

/*
2 Spalten 40%-60% (z.B CMS-Landingpage)
*/
.breite100_content .breite100_content_40_60 .breite40{
    width:40%;

}
.breite100_content .breite100_content_40_60 .breite60{
    width:60%;

}

/*
In einer 60%-Spalte (von 40%-60%) 2 Spalten 50%-50%
z.B CMS-Landingpage, oberer Bereich
*/
.breite100_content .breite100_content_40_60 .breite60 .breite50.float_left{
    width:50%;
}
.breite100_content .breite100_content_40_60 .breite60 .breite50.float_right{
    width:50%;

}




/*
In einer 50% Spalte 2 Spalten 50%-50%
zB Startseite
*/
.breite100 .breite100_content .breite50 .breite50{
   width: 260px;
    box-sizing: border-box;
}
.breite100 .breite100_content .breite50 .breite50.float_right{
    margin-right: 0;
}



.breite100 .breite33.mitte{
    margin-left:  30px;
    margin-right: 30px;
}


/*
4 Spalten 25%
zB Alle Design-Kategorien
*/
.breite100_content .breite_25_25_25_25 .breite25{
    width: 270px;
    margin-right: 10px;
}
.breite100_content .breite_25_25_25_25 .breite25:nth-of-type(4n), #preise #preisgeld_tarif_4{
    margin-right: 0;
}


/*
5 Spalten 20%
zB Website LP
*/
.breite100_content .breite_20_20_20_20_20 .breite20{
    width: 214px;
    margin-right: 10px;
}
.breite100_content .breite_20_20_20_20_20 .breite20:nth-of-type(5n){
    margin-right: 0;
}


/*
In einer 66% Spalte 3 Spalten 33%-33%-33%
zB In welche Richtung soll Ihr Design gehen
*/
.breite100_content_66_33 .breite66 .breite33, .breite100_content_33_66 .breite66 .breite33{
    width: 223px;
}



/*
In einer 66% Spalte 4 Spalten 25%-25%-25%-25%
zB Preisgeld beim Projektstart
*/
.breite100_content_66_33 .breite_25_25_25_25 .breite25{
    width: 175px;
    margin-right: 10px;
    box-sizing: border-box;
}
.breite100_content_66_33 .breite_25_25_25_25 .breite25:nth-of-type(4n){
    margin-right: 0;
}


/*
In einer 33% Spalte 2 Spalten 50%-50%
zB Tabelle mit den Daten im Projekt
*/
.breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50{
    width: 167px;
}
.breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50.float_left{
    margin-right: 15px;
}


/*
In einer 66% Spalte (von 25%-66%) 2 Spalten 33%-66%
zB Kommentare in der Kommunikation
*/
.breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite33{
    width: 238px;
    margin-right: 15px;
}
.breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite66{
    width: 477px;
}


/*
In einer 66% Spalte (von 66%-33% oder 33%-66%) 2 Spalten 66%-33%
zB Kommentare in der Daten�bergabe
*/
.breite100_content_66_33 .breite66 .breite100_content_66_33 .breite66, .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite66, .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite66, .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite66{
    width: 477px;
    margin-right: 15px;
}
.breite100_content_66_33 .breite66 .breite100_content_66_33 .breite33, .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite33, .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite33, .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite33{
    width: 238px;
}



.breite50 .breite50{
    padding: 0;
}


.breite100 dd{
    width: 400px;
}


/* ----- RASTER Ende ----- */



body#projekt .breite100_content .content, body#projekt_upgrade .breite100_content .content,
body#direktauftrag .breite100_content .content,  body#transfer .breite100_content .content{
    padding-left: 0;
}








dl.dateien{ font-size: 11px; font-size: 0.6875rem; }
dl.dateien dt {width: 190px; }



#preis_kommentar_text { width: 195px; height: 13px; font-size: 10px; font-size: 0.625rem; text-align: center;}
#preis_kommentar_bild { width: 195px; height: 5px; clear: both;}
.center{ text-align: center; }
.right{ text-align: right; }
.left{ text-align: left !important; }




#profil_head {
    background-color: #E7E7E9;
    padding: 40px;
    font-size: 14px;
    font-size: 0.875rem;
    margin-top: 30px;
}
#profil_head h1{
    font-weight: 700;
}
#profil_head .avatar_pic{
    float: left;
    width: 140px;
    margin-bottom: 100px;
}
#profil_head .avatar_pic img.avatar{
    margin-bottom: 10px;
    display: block;
}







.reiternavi{
    font-size: 16px;
    font-size: 1rem;
    height: 40px;
    margin-top: 0px;
    clear: both;
}

.reiternavi a{
    font-size: 18px;
    font-size: 1.125rem;
}

.reiternavi ul{
    list-style: none;
    margin: 0;
}
.reiternavi li{
    float: left;
    padding: 0 30px 0 30px;
    line-height: 35px;
}
.reiternavi li.highlight{
    border-bottom: 3px white solid;
    height: 38px;
    border-top: 2px #EFEFEF solid;
    border-left: 2px #EFEFEF solid;
    border-right: 2px #EFEFEF solid;
    background-color: white;
}
.reiternavi li a{
    text-decoration: none;
    color: #5B59E3;
    position: relative;
}
.reiternavi li.highlight a{
    color: #000000;
}

body#profil .tabs ul.tabs_liste li {
    background-color: transparent;
}

body#profil .tabs ul.tabs_liste li{
    padding: 0 30px 0 0;
}




span.new_items{
    position: absolute;
    top: -15px;
    right: -18px;
    background: url(../img/icons/news_nr_bg.png) left top no-repeat;
    width: 21px;
    height: 20px;
    font-size: 10px;
    font-size: 0.625rem;
    color: white;
    text-align: center;
    line-height: 14px;
}


body#profil .reiternavi{
    margin-top: 20px;
    height: auto;
}

body#profil .tabs ul.tabs_liste li a{
    border-bottom: 3px #d7d7d7 solid;
    padding-bottom: 7px
}
body#profil .tabs ul.tabs_liste li a.current{
    color: #000000;
    border-color: #5B59E3;
}

body#profil .reiternavi li.highlight{
    border-bottom: 3px #5B59E3 solid;
    height: 33px;
    border-top: none;
    border-left: none;
    border-right: none;
}

body#profil .reiternavi li a{
    color: #000000;
    padding-right: 50px;
    font-weight: 700;
}
body#profil .reiternavi li.highlight a{
    color: #5B59E3 !important;
}


body#profil .profil_info_daten {
    padding: 30px 0 25px 0;
    background-color: #F4F4F4;
    margin-top: 20px;
}
body#profil .profil_info_daten .profil_daten_titel {
    font-size: 16px;
    font-size: 1rem;
    font-weight: bold;
    padding-left: 30px;
}
body#profil .profil_info_daten .profil_daten_text {
    padding-bottom: 0;
}

body#profil .profil_info_daten .profil_trenner{
    height: 25px;
    border-bottom: 1px #D4D0C7 solid;
    margin-bottom: 25px;
}

body#profil .profil_info_daten .profil_trenner:last-child{
    border-bottom: none;
    margin-bottom: 0;
    height: 0;
}

body#profil .profil_info_daten .profil_bewertung {
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: normal;
    margin-bottom: 20px;
}
body#profil .profil_info_daten .profil_bewertung p{
    margin-bottom: 3px;
}

body#profil .profil_info_daten .profil_bewertung_text{
    background: #E7E7E8 url(../img/layout/zitat_hg_grau.png) top left no-repeat;
    min-height: 45px;
    margin-bottom: 20px;
    padding: 15px 20px 15px 50px;
}

body#profil .profil_zusatzleistungen {
    margin-top: 20px;
}




#profil_stat div b{
    font-weight: normal;
    display: block;
    margin-top: 1px; float: left;
}
#profil_stat div.unterkat .breite33{
    padding-bottom: 0;
}


#profil_stat .ag_bewertung_sterne{
    width: 120px;
    height: 22px;
}
#profil_stat .ag_bewertung_sterne div{
    height: 22px;
}
#profil_stat .bewertung{
    font-size: 11px;
    font-size: 0.6875rem;
    font-weight: normal;
    float: left;
    color: #848077;
    width: 120px;
    margin: 3px 10px 0 0;
}

.ag_bewertung_sterne{
    height: 22px; background:url(../img/star.png) top left repeat-x;
}

.ag_bewertung_sterne .material-icons{
    margin-right: 0;
}

.ag_bewertung_sterne div{
    height: 22px;
    background:url(../img/star_red.png) top left repeat-x;
}

section#meinung .ag_bewertung_sterne, .customer_rating .ag_bewertung_sterne, body#projekt_lp .projekt_ag_zitat .ag_bewertung_sterne{
    width: 160px;
    height: 24px;
    background: none;
}

body#startseite .ag_bewertung_sterne div, .customer_rating .ag_bewertung_sterne div{
    background:url(../img/layout/star_orange2.png) top left repeat-x;
    height: 24px;
}

section#meinung .ag_bewertung_sterne .material-icons, .customer_rating .ag_bewertung_sterne .material-icons, body#projekt_lp .projekt_ag_zitat .ag_bewertung_sterne .material-icons{
    width: 24px;
    height: 24px;
}

.customer_rating .ag_bewertung_sterne{
    position: relative;
}

.customer_rating .ag_bewertung_sterne span{
    margin-left: 10px;
    top: 2px;
    position: relative;
}






#briefing_files_wrap_labels div, #design_file_wrap_labels div, #design_file_wrap_list{ clear: both;}



/* Wettbewerb Ansicht */

#wettbewerb_head{
    min-height: 110px;
}

#wettbewerb_head .float_left{
    padding-bottom: 20px;
}

#wettbewerb_head .float_right{
    background-color: white;
    padding-bottom: 0;
}
#wettbewerb_head .float_right div{
    padding: 8px 14px 8px 15px;
}

#wettbewerb_head .float_right div.float_right{
    padding: 8px 14px 8px 0;
}


#wettbewerb_head h2{ margin-bottom: 5px; }
#wettbewerb_head h2 span{ font-size: 12px; font-size: 0.75rem; color: #848077; font-weight: normal; }
#wettbewerb_head h2 span a{ color: #848077; }
#wettbewerb_head .reiternavi{
    margin-bottom: 20px;
}
#wettbewerb_head .teilnehmen{
    float: right;
    width: 242px;
    padding-top: 3px;
    padding-bottom: 3px;
}











.designs .design{
    width: 250px;
    height: 320px;
    margin: 0 35px 35px 0;
    float: left;
}

.designs .design:nth-of-type(4n){
    margin-right: 0;
}

body#profil .designs .design:nth-of-type(4n) {
    margin-right: 23px;
}

#projekt .designs .design2:nth-of-type(4n) {
    margin-right: 35px;
}

.designs .design .bild_und_info:hover{
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}
.designs .design .bild_und_info .bild:hover img{
    opacity: 0.3; filter:alpha(opacity=30);
}


.designs .design .bild{
    width: 246px;
    height: 246px;
    text-align: center;
    border-left: 2px #EFEFEF solid;
    border-right: 2px #EFEFEF solid;
    border-top: 2px #EFEFEF solid;

}

.designs .design .bild img{
    max-width: 246px;
    max-height: 246px;
}


.designs .design .bild span{
    font-size: 14px;
    font-size: 0.875rem;
    position: relative;
    top: 110px;
    line-height: 20px;
}
.designs .design .bild a{  text-decoration: none !important; }
.aussortiert_de{ background: transparent url(../img/aussortiert_de.png) center center no-repeat;}
.aussortiert_en{ background: transparent url(../img/aussortiert_en.png) center center no-repeat;}
.aussortiert_es{ background: transparent url(../img/aussortiert_es.png) center center no-repeat;}
.aussortiert_fr{ background: transparent url(../img/aussortiert_en.png) center center no-repeat;}
.aussortiert_nl{ background: transparent url(../img/aussortiert_en.png) center center no-repeat;}
.aussortiert_de img, .aussortiert_en img, .aussortiert_es img, .aussortiert_fr img, .aussortiert_nl img,
.zurueckgezogen_de img, .zurueckgezogen_en img, .zurueckgezogen_fr img, .zurueckgezogen_nl img
{ opacity: 0.3; filter:alpha(opacity=30); }

.zurueckgezogen_de{ background: transparent url(../img/zurueckgezogen_de.png) center center no-repeat;}
.zurueckgezogen_en{ background: transparent url(../img/zurueckgezogen_en.png) center center no-repeat;}
.zurueckgezogen_fr{ background: transparent url(../img/zurueckgezogen_en.png) center center no-repeat;}
.zurueckgezogen_nl{ background: transparent url(../img/zurueckgezogen_en.png) center center no-repeat;}



.designs .design .profil_link{
    height: 19px;
    overflow: hidden;
    line-height: 10px;
    font-size: 13px;
    font-size: 0.8125rem;
}

.designs .design .info {
    width: 100%;
    height: 50px;
    box-sizing: border-box;
    background-color: #EFEFEF;
    color: white;
    position: relative;
    border-left: 2px #EFEFEF solid;
    border-right: 2px #EFEFEF solid;
    border-bottom: 2px #EFEFEF solid;
}
.designs .design .info a{
    color: white;
    font-size: 13px;
    font-size: 0.8125rem;
}
.designs .design .info .btn { line-height: 24px; height: 24px; }

.designs .design .bewertung{
    width: 120px;
    padding: 15px 0 0 15px;
    float: left;
}

.designs .design .folio_btn{  cursor: pointer; color: white;  margin-left: 5px; z-index: 99;}
.designs .design .kommentare_btn_bg{
    float: left;
    background: url(../img/icons/comment_bg_g.png) top left no-repeat;
    width: 21px;
    height: 20px;
    font-size: 10px;
    font-size: 0.625rem;
    text-align: center;
    line-height: 14px;
    color: white;
    margin: 18px 0 0 11px;
}

.designs .design .ag_auge{
    float: left;
    margin: 15px 0 0 10px;
}

.designs .design .info .kontext{
    float: right;
    width: 34px;
    height: 35px;
    border-left: 1px white solid;
    padding: 15px 0 0 10px;
}

.designs .design .submenu{
    position: absolute;
    top: 52px;
    left: -12px;
    z-index: 100;
    width: 250px;
    margin-left: 10px;
    background-color: #3F3F3F;
    background-image: none;
    padding-top: 0;
}

.designs .design .submenu ul{
    list-style: none;
    padding-top: 20px;
    margin-bottom: 0;
}

.designs .design .submenu li{
    background: url(../img/layout/pfeil_rechts_weiss_klein.png) left 4px no-repeat;
    padding: 0 0 7px 18px;
}



.designs_sort_form select{
    margin: -6px 0 0 3px;
    width: 200px;
}

.designs_sort_form label{
    width: auto;
}
.designs_sort_form:nth-of-type(2n) {
    margin-left: 30px;
}



.designs .design2{
    width: 45%;
    height: 586px;
}
.designs .design2 .bild {
    width: 100%;
    height: 498px;
    box-sizing: border-box;
}
.designs .design2 .bild img {
    height: auto;
    max-width: 100%;
    max-height: 498px;
}
.designs .design2 .bild_und_info .bild:hover img{
    opacity: 1; filter:alpha(opacity=100);
}



.designs .design6{
    width: 172px;
    height: 230px;
    margin: 0 15px 45px 0;
}
.designs .design6 .bild {
    width: 172px;
    height: 170px;
    box-sizing: border-box;
}
.designs .design6 .bild img {
    max-width: 168px;
    max-height: 168px;
}
.designs .design6 .info .kontext {
    width: 25px;
}
.designs .design6:nth-of-type(4n) {
    margin-right: 15px;
}
.designs .design6:nth-of-type(6n) {
    margin-right: 0;
}
.designs .design6 .bewertung {
    padding: 15px 0 0 5px;
}
.designs .design6 .bild span {
    top: 60px;
}


.design.zusatzSlot .bild{
    border-left: 2px #5B59E3 solid;
    border-right: 2px #5B59E3 solid;
    border-bottom: 2px #5B59E3 solid;

}
.zusatzSlot .bild_und_info {
    position: relative;
}


.designs #gewinner .bild{
    border-left: 2px #5B59E3 solid;
    border-right: 2px #5B59E3 solid;
    border-top: 2px #5B59E3 solid;
}
.designs #gewinner .info{
    border-left: 2px #5B59E3 solid;
    border-right: 2px #5B59E3 solid;
    border-bottom: 2px #5B59E3 solid;
    height: 50px;
}

.designs #gewinner .info .kontext {
    height: 33px;
}

.designs #gewinner .bild_und_info {
    position: relative;
}

.designs #gewinner .bild_und_info .gewinner_label{
    position: absolute;
    background: url(../img/layout/gewinner_label.png) left top no-repeat;
    width: 113px;
    height: 37px;
    color: white;
    right: -3px;
    top: 20px;
    padding: 8px 0 0 35px;
    box-sizing: border-box;
}

.designs .bild_und_info .zusatzSlotLabel{
    position: absolute;
    width: 100%;
    color: white;
    top: 0px;
    padding: 3px 0;
    box-sizing: border-box;
    background-color: #5B59E3;
    text-align: center;
    font-size: 12px;
    font-size: 0.75rem;
    z-index: 99;
}

body#projekt .zusatzSlotLabel{
    width: 100%;
    color: white;
    top: 0px;
    padding: 3px 0;
    box-sizing: border-box;
    background-color: #5B59E3;
    text-align: center;
}


.designs .design.design3{
    width: 310px;
    height: 270px;
    margin: 0 30px 30px 0;
}
.designs .design.design3 .bild{
    width: 310px;
    height: 235px;
}

.designs .design.design3 .info {
    width: 310px;
    height: 38px;
}

.designs .design.design3 .bild img{
    max-width: 310px;
    max-height: 235px;
}


.designs .name{
    height: 174px;
}

.designs .name .bild {
    height: 100px;
}

.designs .name .bild span {
    top: 40px;
}

.designs .name .bild_und_info .gewinner_label{
    top: 5px !important;
}


#einladung .designs .design .profil_link{
    height: 25px;
}

#einladung .designs .design .bewertung{
    color: #000000;
    width: 100%;
}

body#projekt_lp .designs .design.design3 .info {
    width: 314px;
}

body#projekt_lp .designs .design .profil_link{
    padding: 13px 0 0 20px;
    color: #000000;
    font-size: 16px;
    font-size: 1rem;
}
body#projekt_lp .designs .design .profil_link a{
    text-decoration: none;
    color: #000000;
    font-size: 16px;
    font-size: 1rem;
}
body#projekt_lp .designs .design .profil_link a:hover{
    text-decoration: underline;
}


.designs .design .bild_ausgewaelt{
    border: 2px #5B59E3 solid;
}

img.bild_ausgewaelt{
    /*outline: 4px #5B59E3 solid;*/
    /*outline-offset: -4px;*/
}

div.bild_ausgewaelt{
    position: relative;
}

div.bild_ausgewaelt:after {
    content: '';
    display: block;
    position: absolute;
    top: 10px;
    left: 10px;
    width: 48px;
    height: 48px;
    background-image: url(../img/layout/auswahl_ok.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.designs .design .bild_ausgewaelt .bild{
    border: none;
}

.designs .design .bild_ausgewaelt .bild img{
    opacity: 0.3; filter:alpha(opacity=30);
}

.designs .design .bild_ausgewaelt .info{
    border: none;
}






body#profil .designs .design{
    width: 215px;
    height: 220px;
    background-color: white;
    position: relative;
}


body#profil .designs .design .bild{
    width: 215px;
    height: 216px;
    text-align: center;
    margin-bottom: 5px;
    position:relative;
    border-bottom: 2px #EFEFEF solid;
}

body#mein_account .designs .design .bild{
    border-bottom: 2px #EFEFEF solid;
}
body#mein_account .designs .design6{
    margin: 0 10px 5px 0;
}
body#mein_account .designs .design6 .bild {
    width: 172px;
    height: 172px;
    box-sizing: border-box;
}


body#profil .designs .design .bild img{
    position: absolute;
    top : 50%;
    left: 50%;
    max-width: 215px;
    max-height: 215px;
    -webkit-transform: translate(-50%, -50%);
    transform        : translate(-50%, -50%);
}


body#profil .designs .design .folio_btn{
    position: absolute;
    top: 15px;
    right: 10px;
}
body#profil .designs .mehr_designs_zeigen,
body#profil .profil_info_daten .mehr_designs_zeigen,
.designs .mehr_designs_zeigen{
    text-align: center;
    clear: both;
    cursor: pointer;
    margin-bottom: 70px;
}

body#profil .profil_head_designer{
    margin-top: 30px;
    box-sizing: border-box;
    background-color: #F8F8F8;
}

body#profil .designs.profil_designer{
    margin-top: 30px;
}


body#profil .profil_designer .profil_info_daten {
    padding: 0;
    background-color: white;
    margin-top: 20px;
}


body#profil .designs.profil_designer .design{
    margin: 0 13px 13px 0;
}
body#profil .designs.profil_designer .design, body#profil .designs.profil_designer .design .bild {
    width: 230px;
    height: 230px;
}


body#profil .designs.profil_designer .design .bild {
    border-left: 1px #EFEFEF solid;
    border-right: 1px #EFEFEF solid;
    border-top: 1px #EFEFEF solid;
    border-bottom: 1px #EFEFEF solid;
}

body#profil .designs.profil_designer .design .bild.bild_ausgewaelt{
    border-color: #5B59E3;
}



body#profil .designs.profil_designer .design .bild img{
    max-width: 230px;
    max-height: 230px;
}

body#profil .designs.profil_designer .design:nth-of-type(4n) {
    margin: 0 13px 13px 0;
}


body#profil .designs.profil_designer .design .bild:hover{
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}


body#profil .designs.profil_designer #profil_head {
    padding: 0 30px 30px 30px;
}


body#profil .designs.profil_designer #profil_head .avatar_pic {
    float: none;
    width: 115px;
    margin: -20px auto 30px auto;
    position: relative;
}


body#profil .designs.profil_designer #profil_head .avatar_pic img,
body#mein_account .avatar_pic img
{
    border-radius: 50%!important;
    margin: 0 auto;
}
img.avatar_pic_rund{
    border-radius: 50%!important;
}

body#profil .designs.profil_designer #profil_head .avatar_pic .top_ranking{
    color: white;
    background: url(../img/layout/top_hg.png) left top no-repeat;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    position: absolute;
    bottom: -15px;
    right: 10px;
}


body#profil .profil_head_designer .spalte1, body#profil .profil_head_designer .spalte2{
    width: 50%;
    margin-bottom: 5px;
}

body#profil .profil_head_designer .ag_bewertung_sterne {
    width: 120px;
    margin: 15px auto 20px auto;
}

body#profil .profil_head_designer .profil_info_trenner{
    width: 100%;
    height: 2px;
    background-color: #ECECEC;
    margin: 30px 0 20px 0;
}


body#profil .profil_head_designer .profil_links .btn{
    width: 100%;
    box-sizing: border-box;
}





.designs_nav{
    width: 100%;
    font-size: 18px;
    font-size: 1.125rem;
    margin-top: 10px;
    height: 30px;
}
.designs_nav a {
    color: #848077;
    font-size: 18px;
    font-size: 1.125rem;
}
.designs_nav .prev{ width: 15px; height: 30px; float: left; margin-top: 6px;}
.designs_nav .zahlen{ height: 30px; float: left; margin-right: 10px; }

.designs_nav .zahlen ul{
    list-style: none;
}
.designs_nav .zahlen ul li{
    float: left;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    margin-right: 5px;
}
.designs_nav .zahlen ul li.aktuell{
    font-weight: bold;
    color: #5B59E3;
}
.designs_nav .zahlen ul li a{
    text-decoration: none !important;
}



.designs_nav .next{ width: 30px; height: 30px; float: left; margin-top: 6px;}
.designs_nav .text{ width: 170px; height: 30px; float: left;}


.tipDiv_schmall{ width: 220px !important;}
#tipDiv td{ text-align: center; background-color: white; padding: 7px 7px 7px 6px;}
#tipDiv table{ border: 1px #D4D0C7 solid; }

.vtop{ vertical-align: top;}

.wettbewerb_kommentar {
    line-height: 17px;
    width: 100%;
    padding-bottom: 15px;
    border-bottom: 1px #EFEFEF solid;
    margin-bottom: 15px;
}
.wettbewerb_kommentar .breite33 {
    padding-bottom: 0;
}
.wettbewerb_kommentar img{
    margin-right: 10px;
    float: left;
}
.wettbewerb_kommentar .user_designer{
    color: #5B59E3;
}
.wettbewerb_kommentar .user_auftraggeber{
    color: #B33819;
}
.wettbewerb_kommentar .datum{
    width: 200px;
    margin: 10px 0 0 0;
    font-size: 11px;
    font-size: 0.6875rem;
    color: #848077;
    clear: both;
}
.wettbewerb_kommentar .datum img{ padding-right: 10px; }
.wettbewerb_kommentar .avatar{ width: 45px; float: left;}
.wettbewerb_kommentar_ohne_freigabe { background-color: #F1F1F3; padding-top: 5px; }
.wettbewerb_kommentar_ohne_freigabe .float_left { width: 195px; padding-left: 5px;}
.wettbewerb_kommentar_ohne_freigabe .float_right { width: 625px;  padding-right: 5px;}
.wettbewerb_kommentar .rahmen-rund{ border-color: #5B59E3;}

.wettbewerb_kommentar .float_right i.material-icons{
    margin: 20px 0 0 15px;
    float: right;
}



.share{
    margin: 10px 0;
    clear: both;
    float: right;
    margin: 10px 0;
}
.share *{ vertical-align: middle; }
.share a img{ margin: 0 0 0 10px; }



.TickerVertical{
    width:250px;
    background-color: #f1f1f3;
}

.TickerVertical li {
    display: block;
    width: 230px;
    font-size: 11px;
    font-size: 0.6875rem;
    margin: 0;
    padding: 10px !important;
    height: auto !important;
    border-bottom: 1px solid white;
    background-color: #f1f1f3;
}

.info_ag_feedback {
    display:none;
    width:  100%;
    margin-bottom: 20px;
}
#ag_feedback_details{ font-size: 11px !important; font-size: 0.6875rem !important; color: #848077 !important; font-weight: normal !important; margin-left: 5px; cursor: pointer;}


#regler { clear: both; }

#regler .opt_regler{
    width: 98%;
}

#regler .opt_regler .regler_links_text{
    float: left;
    font-size: 16px;
    font-size: 1rem;
    font-weight: 700;
}
#regler .opt_regler .regler_schieber{
    width: 100%;
    margin: 10px 0 40px 0;
    box-sizing: border-box;
}



#regler .opt_regler .regler_rechts_text{
    float: right;
    font-size: 16px;
    font-size: 1rem;
    font-weight: 700;
}


.wettbewerb_show { margin: 0 0 20px 0; padding: 10px 20px 20px 0; font-size: 14px; font-size: 0.875rem;  }
.wettbewerb_show h2{
    font-size: 18px;
    font-size: 1.125rem;
    margin: 20px 0 20px 5px;
    font-weight: 600;
}
.wettbewerb_show h3{ margin: 0 0 5px 0;}
.wettbewerb_show h3 a{ font-size: 17px; font-size: 1.0625rem; font-weight: bold;}
.wettbewerb_show p{
    font-size: 16px;
    font-size: 1rem;
}

.wettbewerb_show .float_left, .wettbewerb_show .float_right{
    height: 80px;
    margin-bottom: 20px;
    cursor: pointer;
    border: 1px white solid;
    padding: 5px 5px 5px 90px;
}
.grau_hg .wettbewerb_show .float_left, .grau_hg .wettbewerb_show .float_right{ border: 1px #F7F7F7 solid; }

.wettbewerb_show .float_left:hover, .wettbewerb_show .float_right:hover{
    border: 1px #091182 solid;
}
.wettbewerb_show span.nobr{
    color: #091182;
}


.wettbewerb_starten { margin: 0 0 20px 0; padding: 10px 20px 20px 0; font-size: 14px; font-size: 0.875rem;  }
.wettbewerb_starten h2{
    font-size: 18px;
    font-size: 1.125rem;
    margin: 20px 0 20px 5px;
    font-weight: 600;
}
.wettbewerb_starten h3{ margin: 0 0 5px 0;}
.wettbewerb_starten h3 a{ font-size: 17px; font-size: 1.0625rem; font-weight: bold;}
.wettbewerb_starten p{
    font-size: 16px;
    font-size: 1rem;
}
.wettbewerb_starten .float_left, .wettbewerb_starten .float_right{
    height: 80px;
    margin-bottom: 10px;
    cursor: pointer;
    border: 1px white solid; padding: 5px 5px 5px 90px;
}
.wettbewerb_starten .float_left, .wettbewerb_starten .float_right{
    height: 80px;
    margin-bottom: 20px;
    cursor: pointer;
    border: 1px white solid;
    padding: 5px 5px 5px 90px;
}
.grau_hg .wettbewerb_starten .float_left, .grau_hg .wettbewerb_starten .float_right{ border: 1px #F7F7F7 solid; }

.wettbewerb_starten .float_left:hover, .wettbewerb_starten .float_right:hover{
    border: 1px #091182 solid;
}
.wettbewerb_starten span.nobr{
    color: #091182;
}



#preise #preis_headline_div{
    position: relative;
}

#preise #h_kat_name{
    border: 2px #ECECEC solid;
    padding: 10px 20px;
    position: relative;
    margin-left: 10px;
}

#preise #h_kat_name2{
    color: #000000;
}

#preise #h_kat_name a{
    text-decoration: none;
}
#preise #h_kat_name a img{
    vertical-align: middle;
}


#preise .content .submenu {
    position: absolute;
    top: 48px;
    left: -10px;
    z-index: 100;
    width: 100%;
    background-color: #3F3F3F;
    padding: 10px 20px;
    box-sizing: border-box;
}

#preise .content .submenu ul {
    list-style: none;
    padding-top: 20px;
    margin-bottom: 0;
}

#preise .content .submenu li {
    background: url(../img/layout/pfeil_rechts_weiss_klein.png) left 4px no-repeat;
    padding: 0 0 7px 18px;
}
#preise .content .submenu li {
    margin-left: 0 !important;
}
#preise .content .submenu li a, #preise .content .submenu h3 {
    color: white;
}







.preisgeld_tarif{
    float: left;
    background-color: #F8F8F8;
    font-size: 16px;
    font-size: 1rem;
}


.preisgeld_tarif .preisgeld_tarif_kopf{
    padding: 20px 10px;
    border-bottom: #EEEEEE 2px solid;
}


.preisgeld_tarif.preisgeld_tarif_on .preisgeld_tarif_kopf{
    border-color: #091182;
}


.preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_titel{
    margin-top: 10px;
    line-height: 25px;
    font-size: 18px;
    font-size: 1.125rem;
}

.preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis span{
    display: block;
    font-style: italic;
    font-weight: normal;
    color: #000000;
}

.preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis span.zzgl_mwst{
    font-size: 16px;
    font-size: 1rem;
}


.preisgeld_tarif.preisgeld_tarif_on .preisgeld_tarif_kopf .preisgeld_tarif_preis span{
    color: white;
}

.preisgeld_tarif.preisgeld_tarif_on .preisgeld_tarif_vorteile .preisgeld_tarif_btn a{
    background-color: #091182;
}

.preisgeld_tarif .preisgeld_tarif_vorteile .preisgeld_tarif_btn{
    background-color: white;
    padding-top: 20px;
}

.preisgeld_tarif .preisgeld_tarif_vorteile .preisgeld_tarif_btn a{
    width: 100%;
    box-sizing: border-box;
}



body#projektstart .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis {
    font-size: 30px;
    font-size: 1.875rem;
    font-weight: bold;
    color: #5B59E3;
}

.preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis span.preisgeld_tarif_budget{
    display: inline;
    font-style: normal;
    color: #5B59E3;
    font-weight: bold;
}

body#projektstart .preisgeld_tarif.preisgeld_tarif_on .preisgeld_tarif_kopf .preisgeld_tarif_preis span.preisgeld_tarif_budget{
    color: white;
}

#projektstart_spalte_rechts .position_fixed {
    position: fixed;
    top: 0;
    width: 350px;
}


body#projektstart dt, body#projektstart dd {
    line-height: 20px;
}


.kosten_hinweis_klammern{
    margin-left: 30px;
}


body#festpreis_start .preisgeld_tarif{
    width: 30%;
    margin-right: 3%;
}







.preisgeld_tarif .preisgeld_tarif_vorteile{
    text-align: center;
}

.preisgeld_tarif .preisgeld_tarif_vorteile ul{
    list-style: none;
    margin: 0 0 10px 0;
}
.preisgeld_tarif .preisgeld_tarif_vorteile ul li{
    list-style: none;
    padding: 15px 10px;
    text-align: left;
    border-bottom: #EEEEEE 2px solid;
}

.preisgeld_tarif .preisgeld_tarif_vorteile ul li.zeilen2{
    min-height: 40px;
}
.preisgeld_tarif .preisgeld_tarif_vorteile ul li.zeilen3{
    min-height: 60px;
}

.preisgeld_tarif.preisgeld_tarif_on .preisgeld_tarif_vorteile ul li{
    border-color: #091182;
}

body#projektstart .preisgeld_tarif.preisgeld_tarif_on .preisgeld_tarif_kopf .preisgeld_tarif_preis {
    color: white;
}

.preisgeld_tarif .preisgeld_tarif_vorteile ul li:last-child{
    border-bottom: none;
    margin: 0;
}

.preisgeld_tarif .preisgeld_tarif_vorteile .btn{
    font-weight: 700;
    letter-spacing: normal;
}

.preisgeld_tarif_on{
    background-color: #091182;
    color: white;
}






#preise .preisgeld_tarif .preisgeld_tarif_kopf{
    padding: 0;
    border-bottom: none;
    color: white;
}


#preise .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis span{
    color: white;
    font-style: normal;
    display: inline;
    font-weight: 700;
}



#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_vorteile {
    border: none;
}

#preise .preisgeld_tarif .preisgeld_tarif_vorteile ul {
    margin: 10px 0 0 0;
}

#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_vorteile ul li {
    border-bottom: #EEEEEE 2px solid;
    background-color: #F7F7F7;
    background: url(../img/layout/check_circle.svg) 15px 19px no-repeat;
    padding: 15px 10px 15px 50px;
}

#preise .preisgeld_tarif .preisgeld_tarif_vorteile ul li:last-child {
    border-bottom: none;
}

#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf {
    color: white;
    text-align: center;
    height: 114px;
    background-color: transparent;
}

#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_titel {
    float: none;
    clear: both;
    width: auto;
    height: 40px;
    display: block;
    text-align: center;
    margin: 0;
    background-color: #091182;
    line-height: 40px;
    font-weight: 600;
}

#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis {
    float: none;
    clear: both;
    width: auto;
    height: 70px;
    background-color: #091182;
    text-align: center;
    display: block;
    position: relative;
    top: 0;
    left: 0;
    line-height: 22px;
    padding-top: 11px;
}

#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis .preis_brutto{
    font-size: 13px;
    font-size: 0.8125rem;
    box-sizing: border-box;
    text-align: center;
}
#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis .preis_netto{
    font-size: 30px;
    font-size: 1.875rem;
    font-weight: 600;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 10px;
}


#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis span.ab{
    font-weight: 400;
}

#preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis span.netto_brutto_lbl{
    line-height: 10px;
}

#preise .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis .ab {
    font-size: 13px;
    font-size: 0.8125rem;
    font-weight: normal;
}

#preise ul.link li{
    background: none;
    font-size: 16px;
    font-size: 1rem;
    line-height: 24px;
    padding-left: 23px;
}












.preisgeld_individuell{
    /*width: 120px;*/
    /*margin: 20px auto 0 auto;*/
    text-align: center;
    /*font-size: 30px;*/
    /*font-size: 1.875rem;*/
    display: none;
}

.preisgeld_individuell input{
    width: 80px;
/*    padding: 0 5px 0 5px;*/
/*    height: 20px;*/
    margin-left: 12px;
/*    font-size: 18px;*/
/*    font-size: 1.125rem;*/
}



.ag_feedback_rot{   padding: 0 0 0 15px; background: url(../img/layout/bullet_red.png) 0 4px no-repeat; }
.ag_feedback_gelb{  padding: 0 0 0 15px; background: url(../img/layout/bullet_yellow.png) 0 4px no-repeat; }
.ag_feedback_gruen{ padding: 0 0 0 15px; background: url(../img/layout/bullet_green.png) 0 4px no-repeat; }

.simple_overlay {
    display:none;
    z-index:100;
    background-color:#333;
    width: 400px;
    min-height:200px;
    border:1px solid #666;
    font-size: 11px;
    font-size: 0.6875rem;
    color: white;
    padding: 10px;
}

.simple_overlay .close {
    background :url(../img/multibox/close.png) top left no-repeat;
    position:absolute;
    right:-15px;
    top:-15px;
    cursor:pointer;
    height:35px;
    width:35px;
}

.simple_overlay h3{ color: white; }

.contentWrap {
    /*	height:441px; */
    overflow-y:auto;
}

a.pdf{ padding: 0 0 2px 25px; background: url(../img/pdf.gif) 0 0 no-repeat; }

.highlight_box {
    padding: 20px;
    background-color: #D8EFF5;
}
.nobr { white-space: nowrap; }



#top_meldung{
    z-index: 10;
    background: #7C7C7C;
    padding: 10px 0;
    text-align:center;
    font-weight: bold;
    width: 100%;
    font-size: 18px;
    font-size: 1.125rem;
}
#top_meldung a{ text-decoration: none; color: white; margin-right: 15px; }
a.underline {text-decoration: underline !important;}

.account_meldung{
    background-color: #F7F7F7;
    padding: 20px;
    margin-bottom: 30px;
    font-size: 14px;
    font-size: 0.875rem;
}
.account_meldung a{
    font-size: 14px;
    font-size: 0.875rem;
}
.account_meldung li{  margin-bottom: 3px; }
.account_meldung div{ margin-bottom: 10px; }






img.alignleft{  float: left; margin: 0 10px 10px 0; }





.pop {
    clear: both;
    font-size: 13px;
    font-size: 0.8125rem;
    margin: 23px 0 10px 0;
    margin: 15px 0 0 0;
    float: right;
}

ul.pop li{
    list-style-type:none;
    margin: 0;
    background: url(../img/layout/pfeil_rechts_weiss_klein.png) 13px 10px no-repeat;
    padding-left: 18px;
}

ul.pop .submenu {
    top: 35px;
    left: auto;
    right: 0;
    width: 290px;
    padding-top: 0;
}

ul.pop .submenu a{
    color: white;
}
ul.pop .submenu a:hover{
    text-decoration: underline;
}

ul.pop .submenu_list {
    border-top: none;
}

ul.pop .dropdown {
    width: auto;
}

ul.pop a.has_sub {
    width: 242px;
    background: #5B59E3 url(../img/layout/pfeil_unten_weiss_klein.png) 250px 14px no-repeat;
    padding-top: 6px;
    padding-bottom: 6px;
}


body#direktauftrag .pop {
    float: left;
}
body#direktauftrag ul.pop li{
    padding-left: 0;
}
body#direktauftrag ul.pop .submenu_list li{
    padding-left: 18px;
}




.display_none {
    display: none;
}
.display_inline {
    display: inline;
}



a.pfeil_links_klein{
    background: url(../img/layout/pfeil_links_klein.png) left 3px no-repeat;
    padding-left: 20px;
}



body#screenshots #header .float_left{ margin: 10px; }

body#screenshots .header_titel{
    margin: 20px 0 0 0;
    border-bottom: 2px #EFEFEF solid;
    padding-bottom: 20px;
}



body#screenshots #designScreenshot{
    width:100%;
    height:100%;
    background-color: white;
    padding: 20px 0 20px 0;
}

body#screenshots #designScreenshot #kommentare_zum_design{
    width: 300px;
    z-index: 99;
    position: fixed;
    top: 110px;
    right: 12px;
    text-align: left;
    padding: 15px;
    background-color: #F6F6F6;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

img.info_icon{
    top: 2px;
    position: relative;
}

body#screenshots #designScreenshot .formfield{ width: 295px; height: 60px;}
body#screenshots #designScreenshot #historieBox .kommentar{
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px #E6E6E6 solid;
}

body#screenshots #header #header_content{
    width: auto;
}


body#screenshots .spalte_designer{
    text-align: center;
}

body#screenshots .spalte_pfeile{
    text-align: center;
}




.gewinnerDesingBild{
    margin: 20px 0;
}
.gewinnerDesingInfo{
    padding-top: 30px;
}
.gewinnerDesingBild img{
    max-width: 100%;
    height: auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.gewinnerDesingInfo h2{
    font-size: 36px;
    font-size: 2.25rem;
    margin-top: 5px;
}
.gewinnerDesingInfo h3{
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 32px;
    margin-top: 25px;
    font-weight: normal;
}
.gewinnerDesingInfo h5{ margin: 0 0 15px 0; font-size: 17px; font-size: 1.0625rem; color: #5B59E3; font-weight: normal;}
.gewinnerDesingInfo h2 a{ color: #5B59E3; }






.beispielprojekt_div{
    font-size: 18px;
    font-size: 1.125rem;
    margin-top: 30px;
    margin-bottom: 30px;
    clear: both;
}

.beispielprojekt_div .beispielprojekt_bild{
    max-width: 215px;
    box-sizing: border-box;
    text-align: center;
    float: left;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin: 0 30px 50px 0;
    width: 215px;
    height: auto;
}



.beispielprojekt_div p{
    padding: 20px  0 30px 0;
}

.beispielprojekt_div .beispielprojekt_name{
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 40px;
}

.beispielprojekt_div .btn_aktion1_label, .beispielprojekt_div .btn_aktion2_label{
    width: 150px;
    display: inline-block;
    height: auto;
}

#kostenStart, .infoRahmenBlock {
    margin: 0;
    width: 100%;
    padding: 20px 30px;
    box-sizing: border-box;
    background-color: #f7f7f7;
}

.infoRahmenBlock p, #kostenStart{
    font-size: 16px;
    font-size: 1rem;
}

.infoRahmenBlock.ohneAbstandOben{
    margin-top: 0px;
}


#kostenStart dl {
    color: #828282;
    line-height: 12px;
    margin-bottom: 5px;
}
body#projektstart #kostenStart dt, body#projektstart #kostenStart dd {
    min-height: 10px;
    line-height: 14px;
}


#kostenStart dt { width: 120px; }
#kostenStart dd {
    width: 150px;
    float: right;
    text-align: right;
}
#kostenStart #tab_kosten_bruttopreis{ font-weight: bold; }

#meldungAjax{ display: none;}



.rahmen-rund{ border: 1px solid #B4B3B3; padding: 5px; }





.design_vergleich .breite50{
    padding: 0 20px;
}

.design_vergleich .designs .design6:nth-of-type(6n) {
    margin-right: 25px;
}

.design_vergleich .designs .design .bild {
    border-bottom: 2px #EFEFEF solid;
    height: 171px;
}

.design_vergleich .designs .design6 {
    width: 172px;
    height: 230px;
    margin-bottom: 0;
    margin-right: 25px;
}









/* Transfer: Smooth Scrolling Navi */

body#transfer #nav_scroll ul{
    margin-top: 20px !important;
}

body#transfer #nav_scroll.stick {
    position: fixed;
    top: 0;
    margin-top: 12px;
    width: 350px;
}

body#transfer #nav_scroll ul {
    list-style-type:none;
}


body#transfer #nav_scroll li a {
    text-decoration: none;
}

body#transfer a.nav-active {
    font-weight:700;
}









/*.projekt_starten_navi{*/
/*    width: 100%;*/
/*    margin: 40px 0 20px 0;*/
/*}*/

/*.projekt_starten_navi div { margin: 0; }*/

/*.projekt_starten_navi .sub{*/
/*    !*float: left;*!*/
/*    margin-right: 10px;*/
/*    !*padding: 10px 0 7px 0;*!*/
/*    list-style: none;*/
/*    !*font-size: 12px;*!*/
/*    !*font-weight: 700;*!*/
/*    color: #d7d7d7;*/
/*    border-bottom: 10px #d7d7d7 solid;*/
/*    border-radius: 10px;*/
/*    width: 130px;*/
/*    cursor: pointer;*/
/*    margin-right: 20px;*/


/*}*/

/*.projekt_starten_navi .sub a{*/
/*    text-decoration: none;*/
/*}*/

/*.projekt_starten_navi .sub.jetzt{*/
/*    border-color: #091182;*/
/*}*/

/*.facebox_content .projekt_starten_navi li{*/
/*    width: 30px;*/
/*    text-align: center;*/
/*    border-bottom: 3px #091182 solid;*/
/*}*/
/*.facebox_content .projekt_starten_navi li a{*/
/*    color: #091182;*/
/*}*/
/*.facebox_content .projekt_starten_navi li.hg_grau{*/
/*    border-color: #d7d7d7;*/
/*}*/
/*.facebox_content .projekt_starten_navi li.hg_grau a{*/
/*    color: #d7d7d7;*/
/*}*/

.schritt_headline *{
    vertical-align: sub;
}

.schritt_headline span{
    font-size: 40px;
    color: white;
    padding: 0 30px 0 18px;
}






label.inp{
    display: inline;
    float: none;
    font-weight: 600;
    padding-right: 0;
    cursor: pointer;
    font-size: 16px;
    font-size: 1rem;
}

label.inp11{
    font-style: normal;
    font-weight: 400;
    font-size: 11px;
    font-size: 0.6875rem;
}

label.inp span{
    display: inline;
    color: #000000;
    display: inline;
    padding: 0;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: 600;
}

label.inp span span.fontsize10{
    font-size: 10px;
    font-size: 0.625rem;
}



.margin_left_180{
    margin-left: 180px;
}


.designerTeilnehmer{
    float: left;
    margin: 0 20px 10px 0;
    font-size: 11px;
    font-size: 0.6875rem;
    width: 150px;
    overflow: hidden;
}

.designerTeilnehmer .avatar{
    width: 35px;
    height: 35px;
}

#startseite h2, .fragen_support h2, section#schritte h2, section#meinung h2{
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 20px 0;
}

.btn_aktion1_label, .btn_aktion2_label, .btn_aktion3_label{
    margin-bottom: 15px;
    font-size: 18px;
    font-size: 1.125rem;
    height: 35px;
    border-left: 3px #5B59E3 solid;
    padding-left: 20px;
    font-weight: 700;
    line-height: 32px;
}
.btn_aktion2_label{
    border-color: #091182;
}

.btn_aktion3_label{
    border-color: #E74925;
}









#testimonials h2 {
    margin: 7px 0 8px 0;
    font-size: 30px;
    font-size: 1.875rem;
}
#startseite h1 strong, #testimonials h2 strong{
    color: #5B59E3;
}

#startseite p, section#meinung{
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 25px;
}

#startseite #erfolg .breite100{
    padding-top: 0;
    padding-bottom: 0;
}

#startseite #erfolg #slider_div #slide_von{
    position: relative;
    top: -17px;
    width: 160px;
    float: left;
}




.btnBig .material-icons{
    vertical-align: middle;
}



section .breite100{
    padding: 50px 0 30px 0;
}

section#schritte p.btn_aktion2_label, .btn_aktion1_label.mit2zeilen, .btn_aktion2_label.mit2zeilen, .btn_aktion3_label.mit2zeilen{
    height: 50px;
    line-height: 23px;
    text-align: left;
}

.btn_aktion1_label.mit2zeilen span, .btn_aktion2_label.mit2zeilen  span, .btn_aktion3_label.mit2zeilen  span{
    font-weight: normal;
}

#startseite p.link_weiter, section#schritte p.link_weiter{
    margin: 30px 0 30px 0;
    display: inline-block;
    width: 100%;
}






section#meinung .referenzbild{
    position: relative;
    height: 240px;
}

section#meinung .referenzbild_ag{
    position: absolute;
    bottom: 15px;
    right: 15px;
    float: right;
}

section#meinung p.meinung_zitat{
    text-align: left;
    margin-left: 23px;
}

section#meinung .nutzermeinungen_sterne{
    margin: 40px auto 0 auto;
    text-align: center;
}

section#meinung .nutzermeinungen_sterne .ag_bewertung_sterne{
    margin: 0 auto;
    background: none;
}


section#meinung p.link_weiter {
    margin: 30px 0 30px 0;
}


#startseite section#vorteile .breite100{
    padding-top: 80px;
    padding-bottom: 80px;
}


#startseite p.btn_aktion2_label{
    padding-left: 15px;
    line-height: 32px;
}



#homePageImageKaruselContent{
    width:100%;
    position: relative;
    display: block;
    height: 100%;
    margin-top: 40px;
}

.homePageImageKaruselImage{
    width: 300px;
    height: 100%;
    padding: 12px;
    float: left;

}



.designbeispiel{
    width: 300px;
    height: 380px;
    background: url(../img/layout/designbeispiel_hg2.png) top left no-repeat;
    padding: 12px;
    float: left;
}

.designbeispiel .designbeispiel_bild{
    width: 300px;
    height: 290px;
    background-size: cover;
    overflow:hidden;
}

.designbeispiel .designbeispiel_overlay{
    background:rgba(0,0,0,.75);
    text-align:center;
    padding:45px 0 116px 0;
    opacity:0;
    -webkit-transition: opacity .25s ease;
    -moz-transition: opacity .25s ease;
    transition: opacity .25s ease;
}

.designbeispiel:hover .designbeispiel_overlay {
    opacity:1;
    cursor: pointer;
}

.designbeispiel .designbeispiel_lupe{
    font-weight:900;
    font-size: 107px;
    font-size: 6.6875rem;
}


.designbeispiel #designbeispiel_bild_1.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceOne.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_1.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceOne.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_2.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceTwo.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_2.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceTwo.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_3.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceThree.png);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_3.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceThree.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_4.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFour.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_4.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFour.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_5.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFive.jpg);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_5.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFive.webp);
}

.designbeispiel #designbeispiel_bild_6.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSix.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_6.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSix.webp);
    background-size: cover;
}


.designbeispiel #designbeispiel_bild_7.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSeven.png);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_7.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSeven.webp);
}

.designbeispiel #designbeispiel_bild_8.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceEight.png);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_8.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceEight.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_9.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceNine.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_9.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceNine.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_10.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceTen.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_10.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceTen.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_11.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceEleven.png);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_11.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceEleven.webp);
}

.designbeispiel #designbeispiel_bild_12.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceTwelve.png);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_12.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceTwelve.webp);
}

.designbeispiel #designbeispiel_bild_13.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceThirteen.png);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_13.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceThirteen.webp);
}

.designbeispiel #designbeispiel_bild_14.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFourTeen.png);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_14.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFourTeen.webp);
}

.designbeispiel #designbeispiel_bild_15.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFifteen.png);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_15.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceFifteen.webp);
}

.designbeispiel #designbeispiel_bild_16.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSixteen.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_16.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSixteen.webp);
    background-size: cover;
}

.designbeispiel #designbeispiel_bild_17.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSevenTeen.png);
}
.modernizr_webp .designbeispiel #designbeispiel_bild_17.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceSevenTeen.webp);
}

.designbeispiel #designbeispiel_bild_18.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceEighteen.jpg);
    background-size: cover;
}
.modernizr_webp .designbeispiel #designbeispiel_bild_18.lazy-background.visible{
    background: url(../img/landing/home/reference/referenceEighteen.webp);
    background-size: cover;
}


.lazy-background {
    background-image: none;
}








.designbeispiel dl{
    margin-top: 15px;
}

.designbeispiel dt, .designbeispiel dd{
    width: 120px;
    height: 50px;
    font-size: 16px;
    font-size: 1rem;
    font-weight: 600;
    text-align: left;
    padding: 7px 0  0 10px;
    box-sizing: border-box;
    line-height: 18px;
}

.designbeispiel dt span, .designbeispiel dd  span{
    display: block;
}



.designbeispiel dt{
    border-left: 3px #091182 solid;
    margin-left: 20px;
}

.designbeispiel dd{
    border-left: 3px #091182 solid;
    margin-left: 10px;
}

#kreativleistung a{
    color: #091182;
}

#startseite ul.design_kategorien{
    list-style: none;
    width: 850px;
    margin: 60px auto 60px auto;
}
#startseite ul.design_kategorien li{
    float: left;
    width: 170px;
    height: 81px;
}
#startseite ul.design_kategorien li a{
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: 700;
}
#startseite ul.design_kategorien li img{
    display: block;
    margin: 0 auto 10px auto;
}

.bekannt_aus div{
    margin: 0 30px 45px 0;
    background: url(../img/landing/layout/lp_sprite.png) top center no-repeat;
    display: inline-block;
}

.bekannt_aus .ihk_img {
    width: 106px;
    height: 66px;
    background: url(../img/presse/ihk-preis-2011.png) top left no-repeat;
}
.bekannt_aus .gwb_img {
    width: 136px;
    height: 75px;
    background: url(../img/presse/gruenderpreis_bmwi_farbe.png) top left no-repeat;
}
.bekannt_aus .mit_img {
    width: 78px;
    height: 78px;
    background: url(../img/presse/it_innovation_farbe.png) top left no-repeat;
}

.modernizr_webp .bekannt_aus .ihk_img {
    background: url(../img/presse/ihk-preis-2011.webp) top left no-repeat;
}
.modernizr_webp .bekannt_aus .gwb_img {
    background: url(../img/presse/gruenderpreis_bmwi_farbe.webp) top left no-repeat;
}
.modernizr_webp .bekannt_aus .mit_img {
    background: url(../img/presse/it_innovation_farbe.webp) top left no-repeat;
}








.fragen_support p.tel{
    padding: 0;
    margin: 30px 0 0 0;
}

.fragen_support .float_right .btn_aktion2_label{
    margin: 40px 0 30px 0;
}

.fragen_support p{
    font-size: 18px;
    font-size: 1.125rem;
}




.designbeispiel_popup{
    overflow: hidden;
    padding: 0 0 10px 20px;

}

.designbeispiel_popup dl{
    width: 110px;
    float: left;
    margin-bottom: 5px;
}

.designbeispiel_popup dt{
    font-size: 24px;
    font-size: 1.5rem;
    font-weight: 600;
    text-align: center;
    width: 100%;
    margin: 0;
    line-height: 25px;
}

.designbeispiel_popup dd{
    font-size: 13px;
    font-size: 0.8125rem;
    text-align: center;
    width: 100%;
    margin: 0;
}

.designbeispiel_popup .green.btn_2zeiler{
    width: 305px;
    font-size: 16px;
    font-size: 1rem;
    margin-top: 10px;
}

.designbeispiel_popup .design_pic{
    border: 1px solid #D4D0C7 !important;
}

.designbeispiel_popup p{
    font-size: 14px !important;
    font-size: 0.875rem !important;
    line-height: 20px !important;
}

.btn {
    border-width: 0;
    /*box-shadow: 1px 3px 0 0 #dddddd;*/
    background-color: transparent;
    transition: background-color .3s;
    text-decoration: none;
    /*text-transform: capitalize;*/
    text-align: center;
    letter-spacing: 0.5px;
    display: inline-block;
    /*padding: 0 1.5rem;*/
    outline: none;
    border-radius: 40px;
    font-weight: 700;
    gap: 10px;

    color: #091182;
    border: 1px solid #091182;
    font-size: 16px;
    line-height: 19.2px;
    padding: 15px 32px;
}

.btn::first-letter{
    text-transform: capitalize;
}
.btn-icon {
    padding: 13px 32px !important;
}

.aktion1.btn, .green.btn{
    font-size: 16px;
    line-height: 19.2px;
    padding: 15px 32px;
    color: #FFFFFF !important;
    background-color: #091182 !important;
    border: 1px solid #091182 !important;
}

.aktion1.btn:hover, .green.btn:hover{
    background-color: #3A419B !important;
    border: 1px solid #3A419B !important;
}

.btn.btnSm{
    font-style: normal;
    font-size: 14px;
    line-height: 17px;
    padding: 6px 24px;
}

.btn:visited, .btn:focus{
    color: #070E68;
    border: 1px solid #070E68;
}

.btn:hover{
    color: #3A419B;
    border: 1px solid #3A419B;
}


.btn > * {
    position: relative;
}

.btn span {
    display: block;
    padding: 3px 24px;
}

.btn.dunkelHG{
    box-shadow: 0 1px 4px rgba(0, 0, 0, .6);
}


a.btn_2zeiler{
    width: 375px;
    line-height: 20px;
    height: 48px;
    font-size: 20px;
    font-size: 1.25rem;
    margin-top: 26px;
    padding-top: 10px;
    font-weight: 600;
    border-radius: 30px;
}
a.btn_2zeiler span{
    font-size: 11px;
    font-size: 0.6875rem;
    line-height: 24px;
    display: block;
}


.green.btn_2zeiler{
    background: #46C85B url(../img/layout/sprite.png) 395px 22px no-repeat;
    background-position: 345px -2916px;
}


.wettbewerbe_projektfilter{
    margin-top: 0;
}
.projektfilter td{ background-color: #F1F1F3; vertical-align: bottom; padding: 3px 0 5px 0;}

.projektfilter .formfield_schmall{ width: 195px; height: 25px; padding-left: 5px; font-size: 14px; font-size: 0.875rem; }



body#projektliste .wettbewerbe_projektfilter ul.kat1{
    margin-left: 0;
}

body#projektliste .wettbewerbe_projektfilter ul.kat1 li, body#projektliste .projektfilter ul.kat2 li{
    background: url(../img/layout/pfeil_rechts_klein.png) left 6px no-repeat;
    margin: 0 0 3px 0;
    padding-left: 10px;
    list-style-type:none;
}

body#projektliste .wettbewerbe_projektfilter ul.kat1 li.selected1 a{
    font-weight: 600;
}

body#projektliste .wettbewerbe_projektfilter ul.kat2{
    margin-top: 3px;
}

body#projektliste .wettbewerbe_projektfilter ul.kat2 li a{
    font-weight: 400 !important;
}

body#projektliste .wettbewerbe_projektfilter ul.kat2 li.selected2 a{
    font-weight: 600 !important;
}




.wettbewerbe .untertitel{ margin-top: 5px;}
.wettbewerbe span { color: #5B59E3; font-weight: bold; line-height: 14px; }
.wettbewerbe span.vorkasse{ line-height: 18px; }

.bg_black{
    background-color: black;
}

.bg_green{
    background-color: #64EEB8 !important;
}
.bg_ping{
    background-color: #EB038E !important;
}

.bg_blue{
    background-color: #091182 !important;
}

.bg_white{
    background-color: #FFFFFF;
}

.grau_hg{
    background-color: #F7F7F7;
}

.grau_hg2{
    background-color: #aaaaaa;
}
.wettbewerbe .top{ background-color: #5B59E3; }
.wettbewerbe .top span{ color: inherit; }

.wettbewerbe .top .highlight_titel, .wettbewerbe .top .highlight_titel a {
    color:inherit;
}


.wettbewerbe .verstecktesDesign{
    width: 50px;
    height: 50px;
    background: url(../img/layout/projekt_uneinsehbar.png) top left no-repeat;
    margin-left: 3px;
}

.wettbewerbe th {
    padding: 7px 5px 7px 6px;
    text-align: left;
    font-size: 13px;
    font-size: 0.8125rem;
    border-bottom: 1px #E6E6E6 solid;
}

.wettbewerbe td {
    padding: 7px 5px 7px 6px;
    text-align: left;
    font-size: 13px;
    font-size: 0.8125rem;
    vertical-align: middle;
    height: 56px;
}

.wettbewerbe .projekt_pro{
    width: 50px;
    height: 50px;
    background: url(../img/layout/projekt_privat.png) top left no-repeat;
    margin-left: 3px;
}
.wettbewerbe .projekt_elite{
    width: 50px;
    height: 50px;
    background: url(../img/layout/projekt_elite.png) top left no-repeat;
    margin-left: 3px;
}

.wettbewerbe td.center { text-align: center; }
.wettbewerbe a{ text-decoration: none; }
.wettbewerbe .grau{ display: inline; cursor: help; font-size: 10px; font-size: 0.625rem;}

.wettbewerbe tr:hover{ background: #F6F6F6; }
.wettbewerbe tr.nohover:hover{ background: white; color: #000000; }
.wettbewerbe tr.nohover:hover a{ background: white; color: #000000; }
.wettbewerbe span.feedback{ cursor: help; color: #000000; font-weight: normal; }

.wettbewerbe tr.top:hover{ background: #20a6cf; }

.sof, .sof_650{
    box-sizing: border-box;
    text-align: center;
    font-size: 18px;
    font-size: 1.125rem;
}

.sof_650{
    background: url(../img/layout/pattern-bulb.png) top center repeat;
    padding: 30px 10px 10px 10px;
}



.breite100_content .sof{
    width: 100%;
}

.sof .breite33, .sof .breite66{
    padding-bottom: 0;
}


.sof .sof_text, .sof_650 .sof_text{
    margin: 0 auto;
    line-height: 30px;
    padding: 0 0 10px 15px;
}

.sof_650 .sof_text{
    font-size: 14px;
    font-size: 0.875rem;
}

.sof_650 .breite66{
    width: auto !important;
}


.sof .sof_btn, .sof_650 .sof_btn{
    margin-top: 10px;
    padding: 15px 15px 10px 15px;
    text-align: center;
}

.sof .sof_btn a, .sof_650 .sof_btn a{
    font-size: 16px;
    font-size: 1rem;
    height: 42px;
    line-height: 42px;
}

.sof .aktion1, .sof .aktion2{
    margin: 20px 20px 0 20px;
}





.pro{ background-color: #091182; color: white; padding: 1px 3px 2px 3px; display: inline; font-size: 10px; font-size: 0.625rem; margin-right: 3px; }

.MultiFile-wrap{float: left;}


div.wgt * {
    margin: 0;
    padding: 0;
    float: none;
    clear: none;
    border: none;
    outline: none;
    position: relative;
}

div.wgt {
    background-color: white;
    border: 1px solid #B4B3B3;
    display: block;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 0;
    overflow: hidden;
    width: 100%;
}

div.wgt .wgtDesigns {
    display: block;
    padding: 0;
    margin: 5px;
    position: relative;
    text-align: center;
}

div.wgt .wgtDesign {
    display: inline-block;
    width: 130px;
    height: 100px;
    overflow: hidden;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    margin: 1px;
}



div.wgt .scrollable {
    white-space: nowrap !important;
    overflow: hidden !important;
}

div.wgt .browse.prev {
    float: left;
    margin: 90px 10px 0 5px;
    display: block;
    background: url(../img/multibox/left.png) top left no-repeat;
    width: 30px;
    height: 30px;

}

div.wgt .browse.disabled {
    visibility: hidden;
}

div.wgt .browse.next {
    float: right;
    margin: 90px 5px 0 10px;
    display: block;
    background: url(../img/multibox/right.png) top left no-repeat;
    width: 30px;
    height: 30px;
}

.wgt .wgtDesigns .items img{
    max-height: 200px;
}

.width_195{ width: 195px; }

.nachricht_historie{
    background-color: #F1F1F3;
    padding: 5px 10px;
    margin-bottom: 5px;
    cursor: pointer;
}
.nachricht_historie p, .nachricht_historie a.profil, .nachricht_historie .span{
    float: left;
    font-size: 12px;
    font-size: 0.75rem;
}
.nachricht_historie a.profil{ width: 120px;}
.nachricht_historie p{ width: 390px; margin-bottom: 0;}
.nachricht_historie div{ display: none; margin: 10px 0 10px 0; font-style: italic;}

.pos_absolute{
    position: absolute;
}

#input_pfeil_beschreibung, #input_pfeil_zielgruppe{
    margin-top: -145px;
}


.schnellerKommentarForm{
    display: none;
    z-index: 99;
    width: 228px;
    padding: 10px;
    border: 1px solid #E0E1F6;
    background-color: #F1F1F3;
}
.schnellerKommentarForm textarea{
    width: 218px;
    height: 50px;
    padding: 3px;
}
.schnellerKommentarForm span.btn{
    font-size: 11px;
    font-size: 0.6875rem;
    margin-top: 5px;
    padding: 0 5px;
}
.schnellerKommentarForm img{ float: right; margin: 15px 2px 0 0; }

.schnellerKommentarForm img.sprache_flagge{
    float: none;
    margin: 0 0 0 2px;
}


.bewertung_details_titel{
    float: left;
    width: 90px;
    margin-top: 2px;
}
.bewertung_details_icon{
    cursor: pointer;
}
.bewertung_details_icon:hover{
    color: #5B59E3;
}



.fav_btn{
    display: inline-block;
    position: relative;
    left: 5px;
    cursor: pointer;
}
.fav_off .material-icons{ color: rgba(132, 128, 119, 1);}
.fav_on  .material-icons{ color: rgba(47, 183, 224, 1); }



.startseite_contests .contest_info { width: 100%; background: url(../img/layout/hp_contest_punkt.gif) left bottom repeat-x; margin-bottom: 9px;}
.startseite_contests .contest_info .contest_name{  float: left; background: url(../img/layout/white.gif) bottom left repeat-x; padding-right: 5px;}
.startseite_contests .contest_info .contest_name a { text-decoration: none;}
.startseite_contests .contest_info .contest_preis{ float: right; background: url(../img/layout/white.gif) bottom left repeat-x; width: 45px; text-align: right;  }










.menu-btn{
    display: none;
    margin: 5px 10px 0 0;
    padding: 3px 0 8px 0;
    cursor: pointer;
}

.menu-btn div {
    position: absolute;
    left: 100%;
    top: 64%;
    padding-right: 8px;
    margin-top: -0.50em;
    line-height: 1.2;
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: 200;
    vertical-align: middle;
    z-index: 99;
}

.menu-btn span {
    display: block;
    width: 25px;
    height: 4px;
    margin: 0 0 4px 0;
    background: #091182;
    z-index: 99;
}









.nutzermeinung{
    margin-bottom: 30px;
    padding: 30px 25px;
    font-size: 16px;
    font-size: 1rem;
    min-height: 202px;
    box-sizing: border-box;
}

.nutzermeinung img{
    float: left;
}


.nutzermeinungen .nutzermeinung_zitat_info{
    margin-left: 150px;
}

body#testimonials .nutzermeinungen .nutzermeinung_zitat_info{
    margin-left: 10px;
}

.nutzermeinungen .nutzermeinung_zitat_text{
    margin: 10px 0 10px 0;
}








.team_hg .breite100_content div{
    top: 250px;
}

.team_hg .breite100_content div p{
    font-size: 20px;
    font-size: 1.25rem;
}





.seite404{
    width: 850px;
    height: 635px;
    background: url(../img/layout/404.png) no-repeat top left;
    background-size: cover;
    background-position: center center;
    overflow: hidden;
    margin: 30px 0;
}

.seite404 h1{
    margin: 100px 0 0 100px;
    width: 350px;
    color: white;
    line-height: 150%;
}
.seite404 h1 strong{
    font-size: 80px;
    font-size: 5rem;
}

.seite404 div{
    margin: 200px 0 0 40px;
}











.designer_verzeichnis{
    background-color: #E7E7E9;
    padding: 20px 20px 20px 40px;
    margin-bottom: 30px;
}

.designer_verzeichnis input[type=checkbox]{
    padding: 10px;
}

.designer_verzeichnis select{
    width: 290px;
    padding: 0 0 0 5px;
    height: 35px;
    margin: 0 40px 25px 0;
    font-size: 14px;
    font-size: 0.875rem;
}

.designer_verzeichnis input.user {
    width: 220px;
    padding: 0 5px 0 45px;
    height: 35px;
    margin: 0 0 25px 0;
    background: white url(../img/layout/icon_person.png) 5px 3px  no-repeat;
    font-size: 14px;
    font-size: 0.875rem;
}

.designer_verzeichnis ul{
    margin: 0;
    list-style: none;
}

.designer_verzeichnis ul li{
    float: left;
    width: 25%;
    margin-bottom: 10px;
}

.designer_verzeichnis #lupe{
    vertical-align: text-bottom;
}




.designer_kartei{
    width: 525px;
    background-color: #F4F4F4;
    padding-top: 20px;
    margin-bottom: 25px;
}

.designer_kartei .designer_portfolio_bilder{
    height: 245px;
    border-bottom: 1px #D4D0C7 solid;
}
.designer_kartei .designer_portfolio_bilder .bild1{
    float: left;
    margin-left: 23px;
    width: 225px;
    height: 225px;
}
.designer_kartei .designer_portfolio_bilder .bild2{
    float: right;
    margin-right: 23px;
    width: 225px;
    height: 225px;
}

.designer_kartei .designer_portfolio_bilder .bild1 img, .designer_kartei .designer_portfolio_bilder .bild2 img{
    max-width: 225px;
    max-height: 225px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.designer_kartei .designer_kartei_info{
    padding: 15px 0 0 0;
    font-size: 14px;
    font-size: 0.875rem;
}
.designer_kartei .designer_kartei_info .designer_kartei_info_avatar{
    margin-left: 20px;
    width: 80px;
    height: 75px;
    float: left;
}
.designer_kartei .designer_kartei_info .designer_kartei_info_name{
    margin-left: 15px;
    width: 170px;
    float: left;
    font-weight: bold;
    overflow: hidden;
}
.designer_kartei .designer_kartei_info .designer_kartei_info_name p{
    margin-top: 10px;
    font-weight: normal;
}
.designer_kartei .designer_kartei_info .designer_kartei_info_statistik{
    float: left;
}
.designer_kartei .designer_kartei_info .designer_kartei_info_statistik p{
    margin-bottom: 11px;
}
.designer_kartei .designer_kartei_info .designer_kartei_info_buttons{
    margin-top: 15px;
    padding: 15px 20px 15px 20px;
    background-color: #E1E1E1;
}






body#auftrag_neu .designer_kartei, body#direktauftrag .designer_kartei{
    margin-right: 20px;
}

body#auftrag_neu .designer_kartei .designer_kartei_info .designer_kartei_info_statistik, body#direktauftrag .designer_kartei .designer_kartei_info .designer_kartei_info_statistik {
    min-height: 91px;
}

body#auftrag_neu #mehr_designer_finden_erg .designer_auswahl_item, body#direktauftrag #mehr_designer_finden_erg .designer_auswahl_item{
    width: auto;
}

body#auftrag_neu #mehr_designer_finden_erg .designer_kartei_info_avatar .benutzer_name, body#direktauftrag #mehr_designer_finden_erg .designer_kartei_info_avatar .benutzer_name{
    display: none;
}

body#auftrag_neu .white-popup-block, body#direktauftrag .white-popup-block{
    max-width: 1090px;
    padding: 20px 10px 20px 30px;
}




.video_sample{
    float: left;
    width: 188px;
    height: 130px;
    border: 1px solid #B4B3B3; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
    padding: 5px;
    margin-left: 36px;
    cursor: pointer;
}

.video_sample img{ margin: 43px 0 0 84px; }
.video_sample p{  margin-top: 48px; font-size: 14px; font-size: 0.875rem; }


/*
 * jQuery Video Popup Plugin Stylesheet
 * Version: 1.0
 *
 * Author: Nick Rivers
 * http://nrivers.com
 *
 *
 * Changelog:
 * Version: 1.0
 *
 */

#dvGlobalMask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1100;
    background-color:#3F3F3F;
}

#videopopup {
    background: none repeat scroll 0 0 #FFFFFF;
    box-shadow: 5px 5px 20px #000000;
    display: none;
    padding-bottom: 5px;
    position: absolute;
    z-index: 9001;
    border: 15px solid #fff;
    position:relative;
}

.modalnav {
    cursor: pointer;
    height: 30px;
    width: 30px;
    position:absolute;
    right:-25px;
    top:-25px;
    background: url("../img/modal-nav-hover.png") -40px 0px;
}

.modalnav:hover {
    background: url("../img/modal-nav-hover.png") -40px 0px;
}







#facebox {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    text-align: left;
}

#facebox h2{ text-align: left; font-size: 18px;}

#facebox .popup{
    position:relative;
    box-shadow:0 0 18px rgba(0,0,0,0.4);
    box-sizing: border-box;
}

#facebox .facebox_content {
    display:table;
    width: 665px;
    padding: 10px 20px 20px 20px;
    background: #fff;
    min-height: inherit;
    box-sizing: border-box;
}

#facebox .facebox_content.nl_popup{
    width: 810px;
    padding: 0 45px 0 320px;
    height: 590px;
    background: url(../img/layout/popup_frau.jpg) left top  no-repeat;
    box-sizing: border-box;
    border-radius: 5px;
}

#facebox .facebox_content.nl_popup .page_headline {
    margin: 30px 0 30px 0;
    padding-bottom: 0;
    line-height: 36px;
    color: #000000;
}

#facebox .facebox_content.nl_popup p {
    font-size: 14px;
    font-size: 0.875rem;
    line-height: normal;
}

#facebox .facebox_content.nl_popup .haken_gruen li{
    margin-bottom: 0;
}

#facebox .facebox_content.nl_popup .page_headline{
    font-size: 36px;
    font-size: 2.25rem;
    font-weight: bold;
}



#facebox .facebox_content > p:first-child{
    margin-top:0;
}
#facebox .facebox_content > p:last-child{
    margin-bottom:0;
}

#facebox .close{
    position:absolute;
    top:5px;
    right: 5px;
    padding:2px;
}
#facebox .close img{
    opacity:0.7;
}
#facebox .close:hover img{
    opacity:1.0;
}

#facebox .loading {
    text-align: center;
}

#facebox .image {
    text-align: center;
}

#facebox img {
    border: 0;
}

#facebox_overlay {
    position: fixed;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
}

.facebox_hide {
    z-index:-100;
}

.facebox_overlayBG {
    background-color: #000;
    z-index: 99;
}



.hilfebox{
    width: 100%;
    background-color: #F6F6F6;
    box-sizing: border-box;
    border: none;
    padding: 20px;
    margin: 15px 0 10px 0;
}
.hilfebox_antworten{
    width: 75%;
    box-sizing: border-box;
    padding-right: 50px;
}
.hilfebox_themen{
    width: 25%;
    box-sizing: border-box;
}








div.dropdown {
    position: relative;
    height: 17px;
    text-align:left;
}
div.submenu{
    position: absolute;
    top: 25px;
    left: -60px;
    z-index: 100;
    width: 180px;
    display: none;
    margin-left: 10px;
    padding: 0 0 15px 0;
}
div #submenu_1, div #submenu_77, div #submenu_2, div #submenu_3, div #submenu_9, div #submenu_111, div #submenu_23, div #submenu_36{
    background-color: #3F3F3F;
}
div #submenu_2{
    padding: 0;
}


#submenu_111 a{
    color: white;
}

#submenu_111 .btn_aktion2_label{
    border-color: white;
}

#preise #submenu_111 {
    top: 50px;
    left: 0;
    z-index: 100;
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
    margin-left: 0;
    color: white;
}

#preise #submenu_111 li {
    margin-left: 0;
}
#preise #submenu_111 li {
    background: url(../img/layout/pfeil_rechts_weiss_klein.png) left 4px no-repeat;
    padding: 0 0 7px 18px;
}




div.submenu li{
    margin-left: 0 !important;
}

.dropdown  li a {
    display: block;
    padding: 6px 15px;
    cursor: pointer;
    text-decoration:none;
    width: 100%;
}

.dropdown  li.text {
    padding: 0px 15px;
    font-size: 13px;
    font-size: 0.8125rem;
    color: white;
}

.dropdown  li.leer {
    margin: 0;
    padding: 0;
    height: 10px !important;
}


#header a.has_sub {
    z-index: 110;
    display: block;
    height: 28px;
    color: #000000;
}
.submenu_list{
    margin:0px;
    padding:0px;
    padding: 11px 0 0 0px;
    border-top: 1px solid #dedede;
    float: none !important;
}
.submenu_list li, .nofloat{
    float: none !important;
}




.dropdown #submenu_3 li.text, .dropdown #submenu_36 li.text{
    font-size: 13px;
    font-size: 0.8125rem;
    height: auto;
    border-bottom: 1px #DEDEDE solid;
    padding-bottom: 10px;
    line-height: 18px;
    padding-top: 10px;
    cursor: default;
}
.dropdown #submenu_3 li:first-child.text, .dropdown #submenu_36 li:first-child.text {
    font-weight: bold;
    background-color: #535353;
}
.dropdown #submenu_3 li:last-child.text, .dropdown #submenu_36 li:last-child.text {
    border-bottom: none;
    padding-bottom: 0;
}

.dropdown #submenu_3 li:last-child.text a, .dropdown #submenu_36 li:last-child.text a{
    padding-left: 0;
}



.dropdown #submenu_3 li.text a, .dropdown #submenu_36 li.text a{
    font-size: 13px !important;
    font-size: 0.8125rem;
    text-decoration: underline !important;
    font-weight: normal;
}

.dropdown #submenu_3 li a{
    display: inline;
    padding: 0 0 0 5px;
}


.dropdown #submenu_36 li a {
    display: inline;
    padding: 0 0 0 0;
}

.dropdown #submenu_36 .submenu_list{
    overflow-y: auto;
    max-height: 500px;
}

.dropdown #submenu_2 {
    width: 220px;
    left: -142px;
}

.dropdown #submenu_3, .dropdown #submenu_36 {
    position: absolute;
    top: 28px;
    left: -243px;
    z-index: 100;
    width: 390px;
    margin-left: 10px;
    background-color: #3F3F3F;
    background-image: none;
    padding-top: 0;
}

.dropdown #submenu_3 .submenu_list, .dropdown #submenu_36 .submenu_list {
    padding: 0px;
}

.dropdown #submenu_3 .submenu_list, .dropdown #submenu_36 .submenu_list {
    border-top: none;
}


.dropdown #submenu_23 {
    left: -7px;
    width: 350px;
    overflow: hidden;
}

.dropdown #submenu_23 li.text{
    height: auto;
    padding-left: 0;
}

.dropdown #submenu_23 li.text a{
    font-size: 13px !important;
    font-size: 0.8125rem  !important;
}

.dropdown #submenu_77{
    height: 42px;
    line-height: 20px;
    top: -66px;
    left: -80px;
}

.dropdown #submenu_77 li{
    margin: 0;
    line-height: 18px;
}

.dropdown #submenu_77 .submenu_list{
    margin: 10px 0 0 0;
}














body#projekt_lp .projekt_ag_zitat{
    background: url(../img/layout/kommentar_div_hg.png) top center no-repeat;
}

body#projekt_lp .projekt_ag_zitat .zitat_text{
    margin: 20px auto 10px auto;
    padding: 0 40px 0 40px;
    text-align: center;
    font-size: 18px;
    font-size: 1.125rem;
    font-style: italic;
}

body#projekt_lp h2, #preise h2, body#tour h2{
    margin: 30px 0 30px 0;
    font-size: 36px;
    font-size: 2.25rem;
}


body#projekt_lp .projekt_ag_zitat .ag_bewertung_sterne{
    margin: 10px auto 0 auto;
    text-align: center;
}


body#projekt_lp .gewinnerDesingInfo h1, #testimonials .header_hg h1{
    font-size: 48px;
    font-size: 3rem;
    font-weight: 700;
    line-height: 48px;
}



#testimonials .header_hg {
    height: 600px;
    background-size: cover;
    background-position: center center;
    overflow: hidden;
    background: url(../img/layout/kundenmeinungen-hero.jpg) no-repeat top left;
    color: white;
}

#testimonials .header_hg h1{
    line-height: 60px;
    margin: 80px 0 20px 0;
}


.bulb_bg{
    background-color: #F9F9FC;
}
.zigzag_bg{
    background-color: #F9F9FC;
}
.geometric_bg{
    background-color: #F9F9FC;
}

section .breite100.bulb_bg{
    padding-top: 20px;
}





.max_15{
    max-width: 15px;
    max-height: 15px;
}

.max_50{
    max-width: 50px;
    max-height: 50px;
}


.max_75{
    max-width: 75px;
    max-height: 75px;
}
.max_100{
    max-width: 100px;
    max-height: 100px;
}
.max_35{
    max-width: 35px;
    max-height: 35px;
}
.max_135{
    max-width: 135px;
    max-height: 135px;
}
.max_100_50{
    max-width: 100px;
    max-height: 50px;
}

.max_215{
    max-width: 215px;
    max-height: 215px;
}

.max_255{
    max-width: 255px;
    max-height: 255px;
}

.max_90_prozent{
    max-width: 90%;
    height: auto;
}

.max_100_prozent{
    max-width: 100%;
    height: auto;
}



.min_height_360{
    min-height: 360px;
}
.min_height_430{
    min-height: 430px;
}
.min_height_540{
    min-height: 540px;
}
.bild_max_h_135_b_70_prozent{
    height: 130px;
    max-height: 130px;
    -o-object-fit: contain;
    object-fit: contain;
    width: 70%;
}


body#direktauftrag .designs .design{
    width: 90px;
    height: 90px;
    margin: 0 25px 25px 0;
}

body#direktauftrag .designs .design .bild {
    width: 90px;
    height: 90px;
    border-bottom: 2px #EFEFEF solid;
}

body#direktauftrag .designs .design .bild img{
    max-width: 90px;
    max-height: 90px;
    float: none;
    margin: 0 auto 0 auto;
}
body#direktauftrag .designs .design .bild a {
    text-decoration: underline !important;
}

body#direktauftrag dt {
    width: 33%;
    box-sizing: border-box;
}
body#direktauftrag .breite100 dd{
    width: 66%;
    box-sizing: border-box;
}






#dragfile{
    border: 1px gray dashed;
    padding: 20px 20px 10px 20px;
    background-color: #F4F4F4;
    width: 100%;
    box-sizing: border-box;
}
#dragfile i{
    font-size: 16px;
    font-size: 1rem;
}

#dragfile .teilnehmen .dl-btn{
    background-color: transparent !important;
    color: #091182;
    border: 1px solid #091182;
}
#dragfile .teilnehmen .dl-btn:hover{
    color: #091182 !important;
}

#dragfile .teilnehmen .dl-btn .ui-button-text{
    padding: 0 1em;
}

#dragfile .teilnehmen .dl-btn.disabled .ui-button-text{
    color: #D9D9D9;
}


body#exampleCategories .breite100_content:not(#footer_content,#footer_links) li {
    list-style: none;
    margin-bottom: 12px;
    font-size: 16px;
}

body#kategorien .breite100_content:not(#footer_content,#footer_links) li a{
    text-decoration: none;
    color: #5B59E3;
    font-size: 16px;
    font-size: 1rem;
}
body#kategorien .breite100_content li a:hover{
    text-decoration: underline;
}

#navi_content ul {
    position: relative;
}
#navi_content ul li {
    float: left;
    min-height: 1px;
    vertical-align: middle;
}

#navi_content ul li.alle{
    border-top: 1px white solid;
}

#navi_content ul li.hover,
#navi_content ul li:hover {
    position: relative;
    z-index: 599;
}
#navi_content ul ul {
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 598;
    width: 100%;
}
#navi_content ul ul li {
    float: none;
    padding: 0;
    margin: 0;
}
#navi_content ul ul ul {
    top: 0;
    left: 250px;
    width: 250px;
    margin-left: 0;
}
#navi_content ul li:hover > ul {
    visibility: visible;
}
#navi_content ul ul {
    bottom: 0;
    left: 0;
}
#navi_content ul ul {
    margin-top: 0;
}
#navi_content ul ul li {
    font-weight: normal;
    height: 50px;
}
#navi_content a {
    display: block;
}

#navi_content > ul {
    *display: inline-block;
}
#navi_content:after,
#navi_content ul:after {
    content: '';
    display: block;
    clear: both;
}
#navi_content ul ul {
    min-width: 250px;
}
#navi_content ul ul a {
    background: #3F3F3F;
    line-height: 150%;
    padding: 15px 20px;
    font-size: 14px;
    font-size: 0.875rem;
}

#navi_content ul ul a:hover {
    background-color: #5D5D5D;
    text-decoration: none !important;
}

#navi_content ul ul li {
    position: relative;
}
#navi_content ul ul li.has-sub > a:after {
    content: '>';
    position: absolute;
    top: 50%;
    right: 15px;
    margin-top: -8px;
    margin-left: 5px;
}


a.a_dropdown{
    padding-left: 20px;
    background: url(../img/layout/pfeil_unten_grau.png) left 6px no-repeat;
}

.haken_gruen, .kreuz_grau, ul.link, .haken_liste_aktion1, .haken_liste_aktion2{
    list-style: none;
    margin: 0;
}

#bsp{
   fill: #0a89c0;
}

.haken_gruen li, .kreuz_grau li, .haken_liste_aktion1 li, .haken_liste_aktion2 li{
    background: url(../img/layout/check_circle.svg) left 3px no-repeat;
    background-size: 23px 23px;
    padding-left: 40px;
    margin-bottom: 15px;
    list-style-type: none;
    line-height: 26px;
}

.haken_liste_aktion2 li{
    background: url(../img/layout/check_circle.svg) left 3px no-repeat;
    background-size: 23px 23px;
}



ul.link li{
    background: url(../img/layout/list_link.png) center left no-repeat;
    padding-left: 15px;
    margin-bottom: 5px;
    list-style-type: none;
}



.kreuz_grau li{
    background-image: url(../img/layout/kreuz_grau.png);
}

.leistung{
    padding: 20px 20px 30px 20px;
    margin-bottom: 10px;
    position: relative;
    background-color: #F6F6F6;
}

.leistung_logo, .leistung_logo_karte, .leistung_cd, .leistung_logojimdo{
    font-style: italic;
}

.leistung_logo, .leistung_logo_karte, .leistung_cd{
    background: #F6F6F6 url(../img/cat/60/Icon_Logo.svg) 93% 16px no-repeat;
}

.leistung_logo_karte{
    background: #F6F6F6 url(../img/cat/60/Icon_Logo_Visitenkarte.svg) 93% 13px no-repeat;
}
.leistung_cd{
    background: #F6F6F6 url(../img/cat/60/Icon_Corporate_Design.svg) 93% 20px no-repeat;
}
.leistung_logosocial{
    background: #F6F6F6 url(../img/cat/60/Icon_Logo_Socialmedia.svg) 93% 15px no-repeat;
}
.leistung_firmenname{
    background: #F6F6F6 url(../img/cat/60/Icon_Firmenname.svg) 93% 20px no-repeat;
}
.leistung_namelogo{
    background: #F6F6F6 url(../img/cat/60/Icon_Logo_Firmenname.svg) 93% 20px no-repeat;
}


.leistung .highlight{
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: #091182;
    width: 195px;
    height: 40px;
    color: white;
    text-align: center;
    line-height: 38px;
    font-size: 16px;
    font-size: 1rem;
}

.leistung .highlight.highlight_oben{
    top: 0;
}

.leistung .highlight strong{
    font-size: 18px;
    font-size: 1.125rem;
    font-style: normal;
}

.leistung label {
    display: inline;
    float: none;
    font-weight: 600;
    font-size: 16px;
    font-size: 1rem;
    font-style: normal;
}
.leistung p {
    margin-top: 15px;
    font-size: 16px;
    font-size: 1rem;
    line-height: 24px;
}

.leistung li {
    margin-right: 25px;
}

.leistung .haken_gruen {
    margin: 13px 0 0 4px;
}

.leistung .haken_gruen li {
    padding-left: 27px;
    line-height: 25px;
    background: url(../img/layout/check_circle.svg) left 2px no-repeat;
    background-size: 23px 23px;
    font-size: 16px;
    font-size: 1rem;
}

.leistung .highlight2 {
    right: 215px;
    background-color: #25AADD;
}

.haken_gruen li:last-child, .kreuz_grau li:last-child{
    margin-bottom: 0;
}






ul.thumbnails.image_picker_selector {
    overflow: auto;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}
ul.thumbnails.image_picker_selector ul {
    overflow: auto;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}
ul.thumbnails.image_picker_selector li.group {width:100%;}
ul.thumbnails.image_picker_selector li.group_title {
    float: none;
}
ul.thumbnails.image_picker_selector li {
    margin: 0px 7px 7px 0px;
    float: left;
}
ul.thumbnails.image_picker_selector li .thumbnail {
    padding: 5px 5px 0 5px;
    border: 1px solid #dddddd;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
ul.thumbnails.image_picker_selector li .thumbnail img {
    -webkit-user-drag: none;
    max-width: 135px;
    max-height: 135px;
}
ul.thumbnails.image_picker_selector li .thumbnail.selected {
    background: #0088cc;
}



.account_projekt_liste input[type=checkbox]{
    margin-left: 2px;
}





.notif-bot-cnt{
    position: fixed;
    bottom: 0;
    margin: 10px;
}

.notif-alert {
    padding: 8px 35px 8px 14px;
    margin-bottom: 20px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    background-color: #fcf8e3;
    border: 1px solid #fbeed5;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.notif-alert-info {
    color: #3a87ad;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.notif-alert-info a{
    color: #3a87ad;
}




#divScrollMixedContent{
    width:100%;
    position: relative;
    display: block;
    height: 450px;
    margin-top: 40px;
}

/* Invisible left hotspot */
div.scrollingHotSpotLeft
{
    /* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
    min-width: 75px;
    width: 10%;
    height: 100%;
    /* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
    background-image: url(../lib/js/divscroll/images/big_transparent.gif);
    background-repeat: repeat;
    background-position: center center;
    position: absolute;
    z-index: 200;
    left: 0;
    /*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
    cursor: url(../lib/js/divscroll/images/cursors/cursor_arrow_left.png), url(../lib/js/divscroll/images/cursors/cursor_arrow_left.cur),w-resize;
}

/* Visible left hotspot */
div.scrollingHotSpotLeftVisible
{
    background-image: url(../lib/js/divscroll/images/arrow_left.gif);
    background-color: #fff;
    background-repeat: no-repeat;
    opacity: 0.35; /* Standard CSS3 opacity setting */
    -moz-opacity: 0.35; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */
    filter: alpha(opacity = 35); /* Opacity for Internet Explorer. */
    zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */
}

/* Invisible right hotspot */
div.scrollingHotSpotRight
{
    min-width: 75px;
    width: 10%;
    height: 100%;
    background-image: url(../lib/js/divscroll/images/big_transparent.gif);
    background-repeat: repeat;
    background-position: center center;
    position: absolute;
    z-index: 200;
    right: 0;
    cursor: url(../lib/js/divscroll/images/cursors/cursor_arrow_right.png), url(../lib/js/divscroll/images/cursors/cursor_arrow_right.cur),e-resize;
}

/* Visible right hotspot */
div.scrollingHotSpotRightVisible
{
    background-image: url(../lib/js/divscroll/images/arrow_right.gif);
    background-color: #fff;
    background-repeat: no-repeat;
    opacity: 0.35;
    filter: alpha(opacity = 35);
    -moz-opacity: 0.35;
    zoom: 1;
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper
{
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

div.scrollableArea
{
    position: relative;
    width: auto;
    height: 100%;
}






/* Slider */

#slides {
    display: none
}

#slides .slidesjs-navigation {
    margin-top:5px;
}



.slidesjs-pagination {
    margin: 7px 0 0 75px;
    float: left;
    list-style: none;
}

.slidesjs-pagination li {
    float: left;
    margin: 0 3px;
}

.slidesjs-pagination li a {
    display: block;
    width: 10px;
    height: 0;
    padding-top: 10px;
    background-image: url(../img/layout/slider_pagination2.png);
    background-position: 0 -10px;
    float: left;
    overflow: hidden;
}

.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
    background-position: 0 0px
}

.slidesjs-pagination li a:hover {
    background-position: 0 -20px
}

#slides a:link,
#slides a:visited {
    color: #333
}

#slides a:hover,
#slides a:active {
    color: #9e2020
}

#faq_fragen .fragen h2{
    margin-bottom: 50px;
}

#faq_fragen .fragen p.frage{
    font-weight: bold;
    margin: 0;
    cursor: pointer;
}


#faq_fragen .fragen .frage_antwort{
    margin-bottom: 10px;
    padding: 20px;
}

#faq_fragen .fragen .frage_antwort .antwort{
    margin: 15px 0 0 0;
    width: 90%;
}

#faq_fragen .fragen .frage_antwort .antwort ul{
    margin: 15px 0 15px 20px;
}

#faq_fragen .fragen .frage_antwort.frage_off{
    background-color: #FBFBFB;
}

#faq_fragen .fragen .frage_antwort.frage_on{
    background-color: white;
}





.designer_auswahl_item{
    text-align: center;
    width: 125px;
    height: 95px;
    overflow: hidden;
    float: left;
    margin: 0 10px 10px 0;
    font-size: 14px;
    font-size: 0.875rem;
    position: relative;
    cursor: pointer;
}

.designer_auswahl_item#designer_auswahl_erster{
    cursor: auto;
}

.designer_auswahl_item#designer_auswahl_erster:hover img{
    cursor: auto;
    opacity: 1; filter: alpha(opacity=100);
}


.designer_neu:hover img{
    opacity: 0.3; filter:alpha(opacity=30);
}

.designer_max_erreicht{
    opacity: 0.1; filter:alpha(opacity=10);
}
.designer_max_erreicht:hover img{
    opacity: 1; filter:alpha(opacity=100);
}


.designer_auswahl_item .designer_entfernen{
    position: absolute;
    top: 0;
    right: 10px;
}

#designer_auswahl_neu{
    width: 60px;
    height: 60px;
    margin-top: 18px;
    margin-left: 15px;
}

#mehr_designer_finden_btn{
    margin: 0 0 20px 25px;
}


#cookie-banner{
    font-size: 16px;
    font-size: 1rem;
    background-color: #434343;
    color: white;
    width: 100%;
    display: inline-flex;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 999999;
    padding: 25px 0;
    opacity: 0.95; filter:alpha(opacity=95);
    -webkit-box-shadow: 0 -4px 15px rgba(0, 0, 0, 0.15);
    box-shadow: 0 -4px 15px rgba(0, 0, 0, 0.15);
}

#cookie-banner a{
    color: white;
}
#cookie-banner a.btn{
    box-shadow: none;
    padding: 10px 60px;
}

#cookie-banner input{
    width: 20px;
    height: 20px;
}

.schatten{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.cookie-banner-btn {
    position: fixed;
    left: 10px;
    bottom: 10px;
    width: 10vw;
    height: 10vw;
    max-width: 30px;
    max-height: 30px;
    z-index: 999999;
    background: #f1f1f1 url("../img/layout/fingerprint-black.svg") center center no-repeat;
    background-size: contain;
    border: 0;
    border-radius: 50%;
    padding: 0;
    margin: 0;
    transition: all 350ms ease;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
}

.cookie-banner-btn:hover {
    background: #5B59E3 url("../img/layout/fingerprint-white.svg") center center no-repeat;
}


/* ----------------------------------------------------------------------------- *
 *                        < 1170px                                               *
 * ----------------------------------------------------------------------------- */
@media only screen and (max-width: 73.125rem) {

    #header_sticky  {
        padding-top: 27px;
    }

    #header_sticky * {
        text-align: left !important;
    }

    #header_sticky .breite33{
        margin-bottom: 10px;
    }

    #navi_content, #page, .content, #footer_content, #header #header_content, .breite100 .breite100_content, #startseite ul.design_kategorien,
    body#projekt_lp .projekt_ag_zitat .zitat_text, .sof, .sof_650, .profil_daten_text{
        width: auto !important;
    }


    /* ----- RASTER Start ----- */

    .breite20, .breite100 .breite100_content .breite20, #page .content .breite20{
        width: 19%;
    }

    .breite25, .breite100 .breite100_content .breite25, #page .content .breite25{
        width: 24%;
    }

    .breite33, .breite100 .breite100_content .breite33{
        width: 32%;
    }

    .breite33, .breite100 .breite100_content .breite40{
        width: 39%;
    }

    .breite33, .breite100 .breite100_content .breite60{
        width: 59%;
    }

    .breite50, .breite100 .breite100_content .breite50, #page .content .breite50{
        width: 49%;
    }

    .breite66, .breite100 .breite100_content .breite66, #page .content .breite66{
        width: 65%;
    }



    /*
    In einer 50% Spalte 2 Spalten 50%-50%
    zB Startseite
    */
    .breite100 .breite100_content .breite50 .breite50{
        width: 100%;
        margin-right: 0;
        float: none;
        margin-bottom: 20px;
    }
    .breite100 .breite100_content .breite50 .breite50.float_right{
        width: 100%;
        clear: both;
        float: none;
        margin-top: 30px;
        margin-bottom: 20px;
    }


    .breite100 .breite33.mitte {
        margin-left: 0;
        margin-right: 0;
    }



    /*
    2 Spalten 40%-60% (z.B CMS-Landingpage)
    */
    .breite100_content .breite100_content_40_60 .breite40{
        width: 39%;
    }
    .breite100_content .breite100_content_40_60 .breite60{
        width: 55%;
        margin-left: 15px
    }

    /*
    In einer 60%-Spalte (von 40%-60%) 2 Spalten 50%-50%
    z.B CMS-Landingpage, oberer Bereich
    */
    .breite100_content .breite100_content_40_60 .breite60 .breite50.float_left{
        width: 100%;
        clear: both;
        float: none;
        margin-right: 15px;
    }
    .breite100_content .breite100_content_40_60 .breite60 .breite50.float_right{
        width: 100%;
        clear: both;
        float: none;
    }




    /*
    4 Spalten 25%
    zB Alle Design-Kategorien
    */
    .breite100_content .breite_25_25_25_25 .breite25{
        width: 24%;
        margin-right: 10px;
    }

    /*
    5 Spalten 20%
    zB Website LP
    */
    .breite100_content .breite_20_20_20_20_20 .breite20{
        width: 19%;
        margin-right: 10px;
    }


    /*
    In einer 66% Spalte 3 Spalten 33%-33%-33%
    zB In welche Richtung soll Ihr Design gehen
    .breite100_content_66_33 .breite66 .breite33, .breite100_content_33_66 .breite66 .breite33{
       width: 223px;
    }
    */


    /*
    In einer 66% Spalte 4 Spalten 25%-25%-25%-25%
    zB Preisgeld beim Projektstart
    */
    .breite100_content_66_33 .breite_25_25_25_25 .breite25{
        width: 47%;
        margin-right: 10px;
    }
    .breite100_content_66_33 .breite_25_25_25_25 .breite25:nth-of-type(4n){
        margin-right: 0;
    }


    /*
    In einer 33% Spalte 2 Spalten 50%-50%
    zB Tabelle mit den Daten im Projekt
    */
    .breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50.float_right{
        width: 48%;
    }
    .breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50.float_left{
        margin-right: 0;
        width: 48%;
    }


    /*
    In einer 66% Spalte (von 25%-66%) 2 Spalten 33%-66%
    zB Kommentare in der Kommunikation
    */
    .breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite33{
        width: 33%;
        margin-right: 0;
    }
    .breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite66{
        width: 66%;
    }


    /*
    In einer 66% Spalte (von 66%-33% oder 33%-66%) 2 Spalten 66%-33%
    zB Kommentare in der Daten�bergabe
    */
    .breite100_content_66_33 .breite66 .breite100_content_66_33 .breite66, .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite66, .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite66, .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite66{
        width: 66%;
        margin-right: 0;
    }
    .breite100_content_66_33 .breite66 .breite100_content_66_33 .breite33, .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite33, .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite33, .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite33{
        width: 33%;
    }


    /* ----- RASTER Ende ----- */


    /* nicht scrollbare Spalte */
    #projektstart_spalte_rechts .position_fixed, body#transfer #nav_scroll.stick{
        width: inherit;
    }




    .breite100{
        padding: 0 20px;
    }

    #footer_content{
        padding-top: 20px 0;
    }

    #footer_links .float_right {
        float: left;
        margin: 0 0 30px 0;
    }

    #footer_links li {
        margin-bottom: 10px;
    }

    #footer_links, #footer_links li a{
        font-size: 14px;
        font-size: 0.875rem;
    }

    .dropdown #submenu_77 {
        left: -10px;
    }

    body#projektstart .breite100 .breite100_content{
        padding-left: 0;
        padding-right: 0;
    }

    .breite100 .breite100_content#footer_links{
        padding-left: 0;
        padding-right: 0;
        padding-top: 20px;
    }


    .content{
        width: 1110px;
        padding: 20px 15px 30px 15px;
    }


    #startseite #erfolg #slider_div {
        margin-top: 0;
    }

    #leiste_oben {
        padding: 10px 15px;
    }


    #startseite p, .btn_aktion1_label, .btn_aktion2_label, .btn_aktion3_label, #startseite ul.design_kategorien li a, .fontsize18, .fontsize18 a, a.fontsize18,
    .form_label, .leistung .highlight strong{
        font-size: 16px;
        font-size: 1rem;
    }

    #kostenStart, .infoRahmenBlock {
        padding: 20px 15px;
    }

    #startseite p.btn_aktion1_label, #startseite p.btn_aktion2_label, .btn_aktion1_label, .btn_aktion2_label, .btn_aktion3_label {
        line-height: 20px;
    }


    .page_headline{
        margin: 20px 0 20px 0;
    }

    .page_headline, .page_headline span{
        font-size: 26px;
        font-size: 1.625rem;
    }


    #kostenStart dd {
        width: 75px;
    }


    #footer_content div ul, #footer_links ul{
        margin-top: 0;
    }


    /*
    zB beim Projektstart -> Laufzeit Ihres Projektes
    */
    .breite100_content_66_33 .breite66 dt {
        width: 39%;
    }

    .breite100_content_66_33 .breite66 dd {
        width: 60%;
    }


    .schritt_headline, h2.zitat_mit_avatar span {
        font-size: 22px !important;
        font-size: 1.375rem !important;
        margin-top: 0 !important;
    }



    .preisgeld_tarif{
        margin: 0 10px 30px 0;
    }

    .preisgeld_tarif:last-child{
        margin-right: 0;
    }

    .preisgeld_tarif.margin_left_30{
        margin-left: 0 !important;
    }



    #profil_head .profil_links select {
        width: 90%;
        box-sizing: border-box;
    }

    #profil_head {
        padding: 20px;
    }

    body#profil #portfolio_designs_div, body#profil #gewinner_designs_div, body#profil #letzte_designs_div, #weitere_designs{
        height: auto !important;
    }
    body#profil .mehr_designs_zeigen, .designs .mehr_designs_zeigen{
        display: none;
    }

    body#profil .designs {
        padding: 30px 0 20px 20px !important;
    }


    body#profil .profil_info_daten .profil_daten_text {
        float: none;
        width: auto;
        margin: 20px 20px 0 30px;
    }





    body#community .TickerVertical {
        width: auto;
    }

    .wettbewerb_starten .float_left, .wettbewerb_starten .float_right {
        height: auto;
        min-height: 80px;
    }

    body#projektstart .projektstart_faq_iframe{
        display: none !important;
    }

    body#projektstart .formfield_550, body#projektstart .formfield, .formfield_breit{
        width: 100%;
    }

    .meldung {
        width: auto !important;
    }



    .form_feld_spalte{
        margin-left: 0;
    }

    body#login .formfield, body#registrieren .formfield {
        width: auto !important;
        clear: both;
        float: none;
    }
    form label span {
        height: auto;
    }



    .faq_hilfe{
        width: 30% !important;
        box-sizing: border-box;
    }
    .search-2{
        width: 65% !important;
        box-sizing: border-box;
    }
    div.search-2 table {
        width: 100% !important;
    }
    div.search-2 table .input-case {
        width: 80% !important;
    }

    body#projekt_lp .projekt_ag_zitat{
        padding-bottom: 10px;
    }
    body#projekt_lp .projekt_ag_zitat .zitat_text{
        background: none;
    }

    .reiternavi {
        margin-top: 20px;
    }

    body#projekt .panes textarea.formfield_breit, body#projekt .panes p.textarea_hinweis, body#projekt .panes textarea.formfield_550{
        width: 100%;
        box-sizing: border-box;
    }

    .designs .design:nth-of-type(4n){
        margin-right: 20px;
    }


    .leistung_logo, .leistung_logo_karte, .leistung_cd, .leistung_firmenname, .leistung_namelogo, .leistung_logosocial{
        background-image: none;
        height: auto;
    }

    #facebox .facebox_content.nl_popup{
        background-image: none;
        background-color: white;
        padding-left: 30px;
        padding-bottom: 20px;
        width: 550px;
        height: auto;

    }
    #facebox{
        left: 50px;
    }

    .leistung .highlight, .leistung .highlight{
        display: none;
    }

    .designs .design2,.designs .design2 .bild {
        height: auto;
    }
    .designs .design2 .bild {
        min-height: 150px;
    }

    .designs .design6:nth-of-type(6n) {
        margin-right: 15px;
    }

    .reiternavi a{
        font-size: 16px;
        font-size: 1rem;
    }

    body#profil .tabs ul.tabs_liste li{
        padding: 0 10px 0 0;
    }
    body#profil .reiternavi li a {
        padding-right: 20px;
    }

    .designer_kartei_info_statistik {
        margin-left: 15px;
    }


    #designbeispiele_balken #footer_links .float_right {
        margin: 0 0 0 0;
    }

    .preisgeld_tarif .preisgeld_tarif_vorteile ul li.zeilen2{
        min-height: auto;
    }
    .preisgeld_tarif .preisgeld_tarif_vorteile ul li.zeilen3{
        min-height: auto;
    }

}
/* ----------------------------------------------------------------------------- *
 *                       ENDE < 1170px                                           *
 * ----------------------------------------------------------------------------- */




/* ----------------------------------------------------------------------------- *
 *                          > 760px && < 1170px                                  *
 * ----------------------------------------------------------------------------- */
@media only screen and (min-width: 47.5em) and (max-width: 73.125rem){

    /*
    5 Spalten 20%
    zB Website LP
    */
    .breite100_content .breite_20_20_20_20_20 .breite20{
        width: 49%;
        margin-right: 0;
        margin-bottom: 30px;
    }


    #header {
        height: auto;
    }


    #navi #navi_content {
        padding: 0;
    }

    #navi ul li {
        margin: 0;
        padding: 10px 8px 0;
    }
    #navi ul li a {
        font-size: 14px;
        font-size: 0.875rem;
    }

    #startseite .designcrowd, #startseite .infobox, #testimonials .designcrowd, #testimonials .infobox{
        width: 45%;
        height: auto;
    }


    #startseite .infobox, #testimonials .infobox{
        margin-top: 15px;
    }
    #startseite .infobox p, #testimonials .infobox p {
        font-size: 14px;
        font-size: 0.875rem;
    }
    #startseite .infobox .btn_2zeiler{
        margin-bottom: 15px;
        width: 80%;
    }

    #header ul {
        margin: 0;
        float: right;
        list-style: outside none none;
    }



    #startseite .designbeispiel{
        background: none;
        background-color: white;
        border: 1px #D7D7D7 solid;
        margin-bottom: 15px;
    }

    #startseite .designbeispiel dl {
        margin-bottom: 0px;
    }

    #startseite .mehr_designbeispiele {
        background: none;
        padding-left: 0;
        font-size: 13px;
        font-size: 0.8125rem;
    }
    #startseite .mehr_designbeispiele a{
        font-size: 13px;
        font-size: 0.8125rem;
    }

    #startseite .mehr_designbeispiele a.margin_left_10, #startseite .mehr_designbeispiele a.margin_left_20{
        margin-left: 5px;
    }

    #startseite ul.design_kategorien li{
        height: 120px;
    }

    h3, #startseite h3, .fragen_support h3, .fragen_support .float_left p.tel, body#projekt_lp h2{
        font-size: 18px !important;
        font-size: 1.125rem !important;
    }

    .haken_versprechen, #startseite .infobox p, #testimonials .infobox p, #dragfile{
        width: auto !important;
    }

    #startseite .btn_2zeiler, .btn_2zeiler{
        font-size: 14px;
        font-size: 0.875rem;
        letter-spacing: normal;
    }


    .fragen_support .float_right{
        margin-top: 0 !important;
    }


    .breite33 img{
        max-width: 95% !important;
        height: auto;
    }

    .bild_max_h_135_b_70_prozent{
        height: 130px !important;
        max-height: 130px !important;
        width: 70%;
    }

    .breite33 label.inp{
        font-size: 11px;
        font-size: 0.6875rem;
    }


    .designer_kartei{
        width: 47% !important;
    }

    .designer_kartei .designer_portfolio_bilder .bild1, .designer_kartei .designer_portfolio_bilder .bild2{
        width: 40% !important;
        height: auto;
        margin: 0 0 15px 20px;
    }

    .designer_kartei .designer_portfolio_bilder .bild1 img, .designer_kartei .designer_portfolio_bilder .bild2 img{
        width: 80% !important;
        height: auto;
        margin: 0 !important;
    }

    .designer_kartei .designer_portfolio_bilder {
        width: 100% !important;
        height: auto;
        min-height: 160px;
    }

    .designer_kartei .designer_kartei_info .designer_kartei_info_buttons {
        padding: 15px 10px;
    }
    .designer_kartei .designer_kartei_info .designer_kartei_info_buttons .btn{
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        padding: 0 5px;
    }

    .designer_kartei .designer_kartei_info .designer_kartei_info_avatar {
        height: auto;
    }

    .wettbewerbe{
        width: auto !important;
        clear: both;
        float: none;
    }
    .wettbewerbe_projektfilter{
        float: left;
    }
    .wettbewerbe_projektfilter .projektfilter{
        float: left;
        width: 40%;
        margin-right: 30px;
    }

    #profil_head .avatar_pic {
        width: 14%;
        box-sizing: border-box;
    }



    .faq_hilfe{
        width: 100% !important;
        float: none;
    }
    .search-2{
        width: 100% !important;
        float: none;
        margin-top: 20px;
    }




    .preisgeld_tarif {
        width: 45%;
        margin-right: 5%;
    }

    /*.projekt_starten_navi{*/
    /*    display: none;*/
    /*}*/

    #hilfeboxKurz strong{
        display: none;
    }

    #designbeispiele_balken .breite50.float_left {
        margin-top: 10px;
        float: left;
    }

    #startseite #erfolg #slider_div .slidesjs-slide{
        max-width: 90%;
        height: auto;
    }


}
/* ----------------------------------------------------------------------------- *
 *                         ENDE > 760px && < 1170px                              *
 * ----------------------------------------------------------------------------- */









/* ----------------------------------------------------------------------------- *
 *                           < 900px                                             *
 * ----------------------------------------------------------------------------- */

@media only screen and (max-width: 56.25em) {

    #projektstart_spalte_rechts{
        /*display: none;*/
    }

    .preisgeld_tarif {
        width: 100% !important;
        margin: 0 0 50px 0 !important;
    }

    .projektstart_preisgeld .breite66{
        width: 100% !important;
    }

    .preisgeld_tarif_vorteile li .cursor_help{
        display: none;
    }


}




/* ----------------------------------------------------------------------------- *
 *                           < 760px                                             *
 * ----------------------------------------------------------------------------- */
@media only screen and (max-width: 47.5em) {

    .flex-container .flexitem_order_one { order: -1; }

    .mobil_center{
        text-align: center !important;
    }

    #slider_div{
        width: auto !important;
        margin-top: 50px !important;
    }


    /* ----- RASTER Start ----- */

    .breite20, .breite20, .breite100 .breite100_content .breite20, #page .content .breite20{
        width: auto;
        float: none;
        margin-bottom: 30px;
    }

    .breite25, .breite25, .breite100 .breite100_content .breite25, #page .content .breite25{
        width: auto;
        float: none;
    }

    .breite33, .breite100 .breite100_content .breite33{
        width: auto;
        float: none;
        margin-right: 0;
    }

    .breite33, .breite100 .breite100_content .breite40{
        width: auto;
        float: none;
    }

    .breite33, .breite100 .breite100_content .breite60{
        width: auto;
        float: none;
    }

    .breite50, .breite100 .breite100_content .breite50, #page .content .breite50{
        width: auto;
        float: none;
    }

    .breite66, .breite100 .breite100_content .breite66, #page .content .breite66{
        width: auto;
        float: none;
    }



    /*
    In einer 50% Spalte 2 Spalten 50%-50%
    zB Startseite
    */
    .breite100 .breite100_content .breite50 .breite50{
        width: 100%;
        margin-right: 0;
        float: none;
    }
    .breite100 .breite100_content .breite50 .breite50.float_right{
        width: 100%;
        clear: both;
        float: none;
        margin-top: 30px;
    }


    .breite100 .breite33.mitte {
        margin-left: 0;
        margin-right: 0;
    }


    /*
    In einer 50% Spalte 2 Spalten 50%-50%
    zB Kontaktformular
    */
    .breite100 .breite100_content_66_33 .breite33.float_right{
        margin-top: 30px;
    }




    /*
    2 Spalten 40%-60% (z.B CMS-Landingpage)
    */
    .breite100_content .breite100_content_40_60 .breite60{
        margin-top: 50px;
        margin-left: 0;
    }

    /*
    In einer 60%-Spalte (von 40%-60%) 2 Spalten 50%-50%
    z.B CMS-Landingpage, oberer Bereich
    */
    .breite100_content .breite100_content_40_60 .breite60 .breite50.float_left{
        width: 100%;
        clear: both;
        float: none;
        margin-right: 15px;
    }
    .breite100_content .breite100_content_40_60 .breite60 .breite50.float_right{
        width: 100%;
        clear: both;
        float: none;
    }





    /*
    5 Spalten 20% (zB Website LP)
    */
    .breite100_content.breite_20_20_20_20_20 .breite20{
        width: 47%;
        float: left;
    }

    .breite100_content.breite_20_20_20_20_20 .breite20:nth-of-type(2n){
        margin-right: 0;
    }





    /*
    4 Spalten 25%
    zB Alle Design-Kategorien
    */
    .breite100_content.breite_25_25_25_25 .breite25{
        width: 47%;
        float: left;
    }

    .breite100_content.breite_25_25_25_25 .breite25:nth-of-type(2n){
        margin-right: 0;
    }






    /*
    In einer 66% Spalte 3 Spalten 33%-33%-33%
    zB In welche Richtung soll Ihr Design gehen

    .breite100_content_66_33 .breite66 .breite33, .breite100_content_33_66 .breite66 .breite33{
       width: 223px;
    }
    */


    /*
    In einer 66% Spalte 4 Spalten 25%-25%-25%-25%
    zB Preisgeld beim Projektstart
    */
    .breite100_content_66_33 .breite_25_25_25_25 .breite25{
        width: 45%;
        margin-right: 10px;
        float: left;
    }
    .breite100_content_66_33 .breite_25_25_25_25 .breite25:nth-of-type(4n){
        margin-right: 0;
    }


    /*
    In einer 33% Spalte 2 Spalten 50%-50%
    zB Tabelle mit den Daten im Projekt
    */
    .breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50.float_right{
        width: 48%;
        float: right;
    }
    .breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50.float_left{
        margin-right: 0;
        width: 48%;
        float: left;
    }

    /*
    2 Spalten 25%-66%
    zB Kommentare in der Kommunikation
    */
    .breite100 .breite100_content .breite100_content_25_66 .breite66, .breite100 .breite100_content .breite100_content_25_66 .breite66{
        width: 100%;
        margin-right: 0;
    }


    /*
    In einer 66% Spalte (von 25%-66%) 2 Spalten 33%-66%
    zB Kommentare in der Kommunikation
    */
    .breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite33{
        width: 33%;
        margin-right: 0;
        float: left;
    }
    .breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite66{
        width: 66%;
        float: right;
    }


    /*
    In einer 66% Spalte (von 66%-33% oder 33%-66%) 2 Spalten 66%-33%
    zB Kommentare in der Daten�bergabe
    */
    .breite100_content_66_33 .breite66 .breite100_content_66_33 .breite66, .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite66, .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite66, .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite66{
        width: 66%;
        margin-right: 0;
        float: right;
    }
    .breite100_content_66_33 .breite66 .breite100_content_66_33 .breite33, .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite33, .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite33, .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite33{
        width: 33%;
        float: left;
    }


    /* ----- RASTER Ende ----- */


    .breite100 .breite100_content, #navi #navi_content{
        padding: 0;
    }

    section .breite100 {
        padding: 50px 20px 30px 20px;
    }

    #header {
        height: auto;
        padding-bottom: 10px;
    }


    body#projekt .content, body#projekt .content .breite100, body#direktauftrag .content, body#direktauftrag .content .breite100{
        padding-left: 0;
    }


    #leiste_oben ul {
        float: left;
    }

    #leiste_oben ul li{
        margin: 10px 0 0 0;
        float: none;
    }


    /*.projekt_starten_navi{*/
    /*    display: none;*/
    /*}*/

    #header_content ul li.nachricht, #header_content ul li.bewertung, #header_content ul li.konto, #header_content ul li.news, #header_content ul li.todo, #header_content ul li.hallo{
        display: none;
    }

    body#hilfe .header_hg{
        height: auto;
        padding: 0px 0 20px 0;
    }

    #navi, #navi_content, #navi ul li, h1, #header{
        height: auto !important;
    }

    #footer div{ width: auto !important; padding-bottom: 20px !important; }

    .sof_1, .sof_2, .sof_3{ float: none; clear: both; width: 100%; margin: 30px 0 20px 0; }
    .sof_1 img.float_left{ margin-right: 40px;}

    h2, body#projekt_lp h2{
        font-size: 20px;
        font-size: 1.25rem;
    }

    h3, #startseite h3, .fragen_support h3, section#schritte h3, section#meinung h3{
        font-size: 18px;
        font-size: 1.125rem;
        #text-align: left;
    }



    .beispielprojekt_div .beispielprojekt_name{
        line-height: 24px;
    }
    .beispielprojekt_div .beispielprojekt_name a{
        font-size: 16px;
        font-size: 1rem;
    }

    #footer #footer_content{
        padding-left: 20px;
    }
    #footer #footer_content p, #footer #footer_content a {
        font-size: 14px;
        font-size: 0.875rem;
    }

    #header_content ul{
        float: left;
        margin: 10px 0 0 0;
        width: 100% !important;
    }
    #header_content ul li, #navi_content ul li{
        float: none !important;
        /* margin: 0 0 10px 0 !important; */
        height: 32px !important;
    }

    #navi_content ul ul li{
        height: 32px !important;
        padding-bottom:  10px;
    }
    #navi_content ul ul a {
        padding: 15px 10px;
    }



    #header ul li.account{
        border: none;
        padding: 0;
    }




    #navi_content ul li:last-child{margin-bottom: 0 !important;}
    #navi_content{
        clear: both;
    }
    #navi_content ul, #anmelden_block ul{
        display: none;
    }

    .menu-btn{
        display: block;
        float: right;

    }

    #navi #anmelden_block{
        float: none;
    }

    #navi #anmelden_block ul{
        margin-top: 0;
    }




    #startseite .designbeispiel{
        background: none;
        background-color: white;
        border: 1px #D7D7D7 solid;
        margin-bottom: 15px;
    }

    #startseite .designbeispiel dl {
        margin-bottom: 0px;
    }

    #startseite .mehr_designbeispiele a{
        display: block;
        font-size: 13px;
        font-size: 0.8125rem;
        line-height: 22px;
        line-height: 1.375rem;
    }

    #startseite .mehr_designbeispiele a.margin_left_10, #startseite .mehr_designbeispiele a.margin_left_20{
        margin-left: 0;
    }




    .fragen_support .float_right p {
        height: 40px;
    }

    .fragen_support .float_left{
        background-image: none;
    }


    #startseite .designer_testimonial, #startseite .designer_testimonial .designer_zitat, #startseite .designer_testimonial .designer_name {
        width: auto !important;
        height: auto !important;
    }


    .haken_versprechen, #startseite .infobox p, .gewinnerDesingInfo, #testimonials .infobox p, .seite404, #dragfile{
        width: auto !important;
    }

    .seite404 h1{
        margin: 100px 0 0 20px;
        width: 50%;
    }

    .seite404 h1 strong{
        font-size: 26px;
        font-size: 1.625rem;
    }
    .seite404 div{
        margin: 180px 0 0 0;
        width: 50%;
    }





    .haken_versprechen{
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        height: auto;
        min-height: 45px;
    }

    .preisgeld_tarif{
        margin: 0 10px 30px 0;
    }
    .ui-accordion .btn_2zeiler{
        width: 100% !important;
        max-width: 240px !important;
        font-size: 14px;
        font-size: 0.875rem;
        padding: 5px 10px 0 10px;
    }


    .designer_kartei{
        width: 100% !important;
    }

    .designer_kartei .designer_portfolio_bilder .bild1, .designer_kartei .designer_portfolio_bilder .bild2{
        width: 40% !important;
        height: auto;
        margin: 0 0 15px 20px;
    }

    .designer_kartei .designer_portfolio_bilder .bild1 img, .designer_kartei .designer_portfolio_bilder .bild2 img{
        width: 80% !important;
        height: auto;
        margin: 0 !important;
    }

    .designer_kartei .designer_portfolio_bilder {
        width: 100% !important;
        height: auto;
    }
    .designer_kartei .designer_kartei_info .designer_kartei_info_buttons {
        padding: 15px 10px;
    }
    .designer_kartei .designer_kartei_info .designer_kartei_info_buttons .btn{
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        padding: 0 5px;
    }


    #profil_head {
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        padding: 20px;
    }

    .sof .sof_text, .sof_650 .sof_text {
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        width: 100% !important;
    }
    .sof .sof_btn, .sof_650 .sof_btn {
        width: 100% !important;
        margin-top: 10px;
    }
    .sof .sof_btn a, .sof_650 .sof_btn a {
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        padding: 0 5px;
    }

    .sof .sof_btn .sof_link, .sof_650 .sof_btn .sof_link{
        text-align: left;
    }


    body#profil .profil_info_daten .profil_daten_text {
        clear: both;
        margin: 0 20px;
    }


    .wettbewerbe{
        width: auto !important;
        clear: both;
        float: none;
    }
    .wettbewerbe_projektfilter{
        float: left;
    }
    .wettbewerbe_projektfilter .projektfilter{
        float: left;
        width: 40%;
        margin-right: 30px;
    }
    .projekt_teaser{
        width: 100% !important;
        float: left !important;
    }

    body#community .TickerVertical ul li{
        width: auto !important;
    }


    #facebox {
        left: 10px !important;
    }
    #facebox .facebox_content {
        width: 90% !important;
        padding: 10px !important;
    }

    #facebox .nl_info{
        height: auto;
        margin-bottom: 15px;
    }


    #facebox .close{
        right: 70px;
    }

    .faq_hilfe{
        width: 100% !important;
        float: none;
    }
    .search-2{
        width: 100% !important;
        float: none;
        margin-top: 20px;
    }





    body#screenshots .header_titel{
        width: auto;
        height: auto;
    }


    body#screenshots .header_titel .breite50 a{
        font-size: 13px;
        font-size: 0.8125rem;
    }


    body#screenshots #designScreenshot #kommentare_zum_design{
        position: inherit;
        margin: 20px 0 0 10px;
        width: 95%; text-align: left;
        box-sizing: border-box;
    }




    div.impromptu{
        width: 90%;
    }

    div.impromptu .impromptumessage textarea#inputField{
        width: 100% !important;
    }

    .dropdown #submenu_2, div.submenu{
        left: -7px;
    }

    ul.submenu_list li {
        border-bottom: none !important;
    }

    .dropdown li.leer {
        display: none;
    }
    .dropdown li{
        padding: 0 !important;
        margin: 0 !important;
    }

    ul.pop li {
        padding-left: 18px !important;
    }


    .dropdown li.text{
        padding-left: 15px !important;
    }

    ul.pop .submenu_list{
        margin-top: 0 !important;
    }

    #startseite ul.design_kategorien li{
        height: 120px;
    }


    body#kategorien .breite100_content li a{
        font-size: 14px;
        font-size: 0.875rem;
    }

    dl #ppplus, dl #continueButton {
        margin-left: 0 !important;
    }

    .reiternavi li a {
        font-size: 13px;
        font-size: 0.8125rem;
    }
    .reiternavi li {
        padding: 0 10px 0 10px;
    }


    body#projektstart .leistung {
        height: auto;
    }



    .page_headline, .page_headline span{
        font-size: 20px;
        font-size: 1.25rem;
        padding-bottom: 0;
    }

    .designbeispiel dt, .designbeispiel dd {
        width: 47% !important;
    }

    body#projektstart .meldung{
        margin-top: 20px;
    }


    body#transfer #nav_scroll.stick {
        position: inherit;
    }


    .projekt_header .content {
        margin-left: 0;
    }


    #wettbewerb_head .float_left {
        padding: 15px 15px 0 15px;
    }

    #wettbewerb_head .teilnehmen, body#projekt .text_zum_design{
        width: auto;
    }
    body#projekt .share, #wettbewerb_head .teilnehmen{
        float: left;
    }

    .breite33 img{
        max-width: 100%;
        height: auto;
    }

    .bild_max_h_135_b_70_prozent{
        height: 130px !important;
        max-height: 130px !important;
        width: 50%;
    }

    .wettbewerb_starten {
        padding-right: 0;
    }


    .designbeispiel dt, .designbeispiel dd{
        width: 45% !important;
    }

    #preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_vorteile ul li{
        background-image: none;
        padding-left: 10px;
    }

    #preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis .preis_brutto{
        font-size: 18px;
        font-size: 1.125rem;
    }
    #preise .preise_brutto_netto .preisgeld_tarif .preisgeld_tarif_kopf .preisgeld_tarif_preis .preis_netto{
        font-size: 17px;
        font-size: 1.0625rem;
    }

    section#meinung .referenzbild_ag{
        left: 15px;
        float: left;
    }

    .designs .design2{
        width: 500px;
    }
    .designs_sort_form{
        float: none;
    }

    #hilfeboxKurz{
        float: none;
        margin-top: 20px;
    }

    .designs_sort_form label{
        width: 130px;
    }
    .designs_sort_form:nth-of-type(2n) {
        margin-left: 0;
    }



    body#screenshots .spalte_pfeile, body#screenshots .spalte_designer{
        text-align: left;
        margin-top: 20px;
    }


    #navi_content ul ul li.has-sub > a:after {
        content: '';
    }


    #designbeispiele_balken {
        min-height: 75px;
    }
    #designbeispiele_balken .breite50.float_right {
        float: right;
    }
    #designbeispiele_balken .breite50.float_left {
        margin-top: 10px;
        margin-bottom: 10px;
        float: left;
    }

    #designbeispiele_balken .btn {
        margin-bottom: 10px;
    }

    .display_none_u_760{
        display: none;
    }

    .designer_auswahl_item {
        width: 85px;
        height: 65px;
    }

    .designer_auswahl_item .max_75{
        max-width: 35px !important;
        max-height: 35px !important;
    }

    #designer_auswahl_neu {
        margin-top: 0;
    }

    #cookie-banner{
        font-size: 14px;
        font-size: 0.875rem;
    }

    #cookie-banner .breite100_content{
        padding: 0 15px;
    }

    #cookie-banner #cookie_hinweis_text_2, #cookie-banner .cookie_kategorie_text{
        display: none;
    }

    #profil_head .avatar_pic {
        margin-bottom: 70px;
    }

    body#projekt .content{
        padding-right: 0;
    }

    #designbeispiele_balken #footer_links li {
        margin: 0 15px 0 0;
    }

    #designbeispiele_balken #footer_links .float_right {
        margin: 0 0 10px 0;
    }

    #designbeispiele_balken #footer_links li {
        line-height: 20px;
    }

    #designbeispiele_balken #impressm_links{
        margin-bottom: 10px;
    }

    #designbeispiele_balken .btn_weiter {
        margin-bottom: 0;
    }

    .min_height_360, .min_height_430{
        min-height: auto;
    }

    .btn_aktion1_label, .btn_aktion2_label, .btn_aktion3_label{
        padding-left: 10px;
        box-sizing: border-box;
    }

    section#schritte p.btn_aktion2_label, .btn_aktion1_label.mit2zeilen, .btn_aktion2_label.mit2zeilen, .btn_aktion3_label.mit2zeilen {
        height: auto;
    }

    #header img.float_left {
        margin: 10px 0 0 0;
    }

    #header ul.menu_eingeloggt li{
        margin-left: 0;
    }

    .designer_verzeichnis{
        padding-left: 20px;
    }

    .designer_verzeichnis select#online{
        display: block;
    }
}
/* ----------------------------------------------------------------------------- *
 *                          ENDE < 760px                                         *
 * ----------------------------------------------------------------------------- */




/* ----------------------------------------------------------------------------- *
 *                           < 320px                                             *
 * ----------------------------------------------------------------------------- */
@media only screen and (max-width: 20em) {



    /* ----- RASTER Start ----- */

    .breite20, .breite100 .breite100_content .breite20, #page .content .breite20{
        width: auto;
        float: none;
    }

    .breite25, .breite100 .breite100_content .breite25, #page .content .breite25{
        width: auto;
        float: none;
    }

    .breite33, .breite100 .breite100_content .breite33{
        width: auto;
        float: none;
    }

    .breite33, .breite100 .breite100_content .breite40{
        width: auto;
        float: none;
    }

    .breite33, .breite100 .breite100_content .breite60{
        width: auto;
        float: none;
    }

    .breite50, .breite100 .breite100_content .breite50, #page .content .breite50{
        width: auto;
        float: none;
    }

    .breite66, .breite100 .breite100_content .breite66, #page .content .breite66{
        width: auto;
        float: none;
    }



    /*
    In einer 50% Spalte 2 Spalten 50%-50%
    zB Startseite
    */
    .breite100 .breite100_content .breite50 .breite50{
        width: 100%;
        margin-right: 0;
        float: none;
    }
    .breite100 .breite100_content .breite50 .breite50.float_right{
        width: 100%;
        clear: both;
        float: none;
        margin-top: 30px;
    }


    .breite100 .breite33.mitte {
        margin-left: 0;
        margin-right: 0;
    }



    /*
    2 Spalten 40%-60% (z.B CMS-Landingpage)
    */
    .breite100_content .breite100_content_40_60 .breite60{
        margin-top: 30px;
    }

    /*
    In einer 60%-Spalte (von 40%-60%) 2 Spalten 50%-50%
    z.B CMS-Landingpage, oberer Bereich
    */
    .breite100_content .breite100_content_40_60 .breite60 .breite50.float_left{
        width: 100%;
        clear: both;
        float: none;
        margin-right: 15px;
    }
    .breite100_content .breite100_content_40_60 .breite60 .breite50.float_right{
        width: 100%;
        clear: both;
        float: none;
    }



    /*
    5 Spalten 20% (zB Website LP)
    */
    .breite100_content .breite_20_20_20_20_20 .breite20{
        width: auto;
        float: none;
        margin-right: 0;
    }



    /*
    4 Spalten 25%
    zB Alle Design-Kategorien
    */
    .breite100_content .breite_25_25_25_25 .breite25{
        width: auto;
        float: none;
        margin-right: 0;
    }

    /*
    In einer 66% Spalte 3 Spalten 33%-33%-33%
    zB In welche Richtung soll Ihr Design gehen
    .breite100_content_66_33 .breite66 .breite33, .breite100_content_33_66 .breite66 .breite33{
       width: 223px;
    }
    */


    /*
    In einer 66% Spalte 4 Spalten 25%-25%-25%-25%
    zB Preisgeld beim Projektstart
    */
    .breite100_content_66_33 .breite_25_25_25_25 .breite25{
        width: auto;
        margin-right: 0;
        float: none;
    }


    /*
    In einer 33% Spalte 2 Spalten 50%-50%
    zB Tabelle mit den Daten im Projekt
    */
    .breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50.float_right{
        width: 48%;
        float: right;
    }
    .breite100 .breite100_content .breite100_content_66_33 .breite33 .breite50.float_left{
        margin-right: 0;
        width: 48%;
        float: left;
    }

    /*
    2 Spalten 25%-66%
    zB Kommentare in der Kommunikation
    */
    .breite100 .breite100_content .breite100_content_25_66 .breite66, .breite100 .breite100_content .breite100_content_25_66 .breite66{
        width: 100%;
        margin-right: 0;
    }


    /*
    In einer 66% Spalte (von 25%-66%) 2 Spalten 33%-66%
    zB Kommentare in der Kommunikation
    */
    .breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite33{
        width: 33%;
        margin-right: 0;
        float: left;
    }
    .breite100 .breite100_content .breite100_content_25_66 .breite66 .breite100_content_33_66 .breite66{
        width: 66%;
        float: right;
    }


    /*
    In einer 66% Spalte (von 66%-33% oder 33%-66%) 2 Spalten 66%-33%
    zB Kommentare in der Daten�bergabe
    */

    .breite100_content_66_33 .breite66 .breite100_content_66_33 .breite66,
    .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite66,
    .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite66,
    .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite66
    {
        width: 100%;
        margin-right: 0;
        float: right;
    }
    .breite100_content_66_33 .breite66 .breite100_content_66_33 .breite33,
    .breite100_content_66_33 .breite66 .breite100_content_33_66 .breite33,
    .breite100_content_33_66 .breite66 .breite100_content_33_66 .breite33,
    .breite100_content_33_66 .breite66 .breite100_content_66_33 .breite33{
        width: 100%;
        float: left;
    }


    /* ----- RASTER Ende ----- */

    .breite100 .breite100_content{
        padding: 0;
    }

    section .breite100 {
        padding: 50px 20px 30px 20px !important;
    }

    #header {
        height: auto;
        padding-bottom: 30px;
    }

    #header_content img.logo{
        max-width: 90%;
    }

    #wettbewerb_head .float_left, #wettbewerb_head .float_right div{
        padding: 0;
    }

    .btn_2zeiler{
        line-height: 23px !important;
        line-height: 1.4375rem !important;
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        width: 95% !important;
        letter-spacing: normal !important;
        padding: 0 5px !important;
    }
    .btn_2zeiler span{
        font-size: 11px !important;
        font-size: 0.6875rem !important;
    }


    h3, #startseite h3, .fragen_support h3{
        font-size: 15px;
        font-size: 0.9375rem;
        text-align: left;
        font-weight: normal !important;
    }



    .fragen_support .float_left p.beraten {
        clear: both;
        margin: 0 0 5px 0 !important;
    }
    .fragen_support .float_right{
        margin-top: 0 !important;
    }

    #startseite .infobox p, #testimonials .infobox p {
        font-size: 14px;
        font-size: 0.875rem;
    }

    #startseite p {
        font-size: 13px;
        font-size: 0.8125rem;
    }


    .ui-accordion .btn_2zeiler span{
        font-size: 11px;
        font-size: 0.6875rem;
    }


    .designer_kartei .designer_kartei_info .designer_kartei_info_buttons .btn{
        float: none;
        width: 90%;
        margin-bottom: 10px;
    }

    .designer_verzeichnis select {
        width: 100%;
    }
    .designer_verzeichnis input#user {
        width: 75%;
    }
    .designer_kartei .designer_kartei_info .designer_kartei_info_name{
        font-size: 13px !important;
        font-size: 0.8125rem !important;
    }
    .designer_kartei .designer_kartei_info .designer_kartei_info_statistik {
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        margin-left: 15px;
    }


    body#profil .designs .design {
        height: auto;
        width: 85%;
    }
    body#profil .designs .design .bild {
        width: 95%;
    }


    .page_headline {
        line-height: 26px;
        line-height: 1.625rem;
    }

    .profil_navi {
        background-image: none;
        font-size: 13px !important;
        font-size: 0.8125rem !important;
    }
    .profil_navi li {
        float: none;
        padding: 0;
    }
    .profil_navi li, .profil_navi li.highlight {
        height: 25px;
    }

    .wettbewerb_starten .float_left, .wettbewerb_starten .float_right {
        background-image: none !important;
        padding-left: 0 !important;
    }


    .customer_rating, .ssl_button {
        display: none;
    }


    .wettbewerbe_projektfilter .projektfilter{
        width: 90%;
        margin-right: 0px;
    }

    body#community .gewinnerDesingBild, body#projekt_lp .gewinnerDesingBild{
        width: auto !important;
    }
    body#community .gewinnerDesingBild img, body#projekt_lp .gewinnerDesingBild img{
        width: 100%;
        height: auto;
    }



    #facebox .nl_info .user_interesse_designer{
        display: block;
        margin-top: 5px;
    }

    label {
        float: none;
        width: auto;
    }

    .formfield_550, .formfield, .formfield_breit {
        width: 100%;
        box-sizing: border-box;
        float: none;
        display: block;
    }

    .designs_sort {
        width: auto;
        height: auto;
        padding-bottom: 10px;
    }

    body#screenshots #header .pfeile span {
        display: block;
        margin: 5px 0;
    }

    .designbeispiel_popup{
        float: none !important;
        clear: both !important;
        padding: 20px 0 10px 0;
    }

    .designbeispiel_popup dl {
        width: 80px;
    }
    .designbeispiel_popup dd {
        font-size: 12px;
        font-size: 0.75rem;
    }

    #startseite ul.design_kategorien li{
        width: 50% !important;
        box-sizing: border-box;
    }

    .designs .design.design3, .designs .design.design3 .bild, .designs .design.design3 .info {
        width: 100% !important;
        box-sizing: border-box;
    }
    .designs .design.design3 .bild img{
        max-width: 100%;
        height: auto;
    }
    .breite100 dd{
        width: 100% !important;
    }

    body#kategorien h2{
        font-size: 16px;
        font-size: 1rem;
    }

    #navi_content ul ul a {
        font-size: 12px;
        font-size: 0.75rem;
    }

    #navi_content ul ul ul {
        left: 180px;
        width: 180px;
    }
    #navi_content ul ul {
        min-width: 180px;
    }

    .designbeispiel dt, .designbeispiel dd{
        width: 45% !important;
    }


    .seite404{
        height: auto !important;
        background-image: none;
    }

    .seite404 h1{
        margin: 0;
        width: auto !important;
        color: #000000;
        line-height: 150%;
        text-align: left;
    }

    .seite404 div{
        margin: 40px 0 0 0px;
    }

    .projekt_header {
        background-color: transparent;
        border-bottom: none;
    }

    .reiternavi {
        height: auto;
        margin-top: 30px;
    }

    .reiternavi li{
        width: 100%;
        background-color: #F6F6F6;
        margin-bottom: 3px;
        float: none;
        box-sizing: border-box;
    }

    .reiternavi li.highlight {
        border: none;
        height: auto;
        background-color: transparent;
        background-color: #F6F6F6;
    }

    #hilfebox{
        display: none;
    }

    ul.pop a.has_sub {
        width: auto;
    }

    .preisgeld_tarif {
        width: 100%;
        margin-right: 0;
    }
    #preise #h_kat_name {
        display: block;
    }
    #preise .content .submenu {
        top: 92px;
    }


    body#projekt_lp .beispielprojekt_div .beispielprojekt_desc{
        display: none;
    }

    body#projekt_lp .beispielprojekt_div .beispielprojekt_bild{
        display: block;
        width: 50%;
        border: none;
    }
    body#projekt_lp .beispielprojekt_div .beispielprojekt_bild img{
        width: 100% !important;
        height: 100% !important;
    }
    body#projekt_lp .beispielprojekt_div .beispielprojekt_designs, .beispielprojekt_div .beispielprojekt_preis{
        width: 25%;
        border: none;
    }

    body#projekt_lp .beispielprojekt_div .beispielprojekt_designs .fontsize16, .beispielprojekt_div .beispielprojekt_preis .fontsize16{
        font-size: 12px;
        font-size: 0.75rem;
    }

    .kosten_hinweis_klammern{
        margin-left: 0;
    }



    .designs .design2{
        width: 100%;
        height: 100%;
        box-sizing: border-box;
    }
    .designs .design2 .bild {
        width: 100%;
        height: 100%;
        box-sizing: border-box;
    }
    .designs .design2 .bild img {
        max-width: 100%;
        max-height: 100%;
        box-sizing: border-box;
    }
    .designs_sort_form select{
        margin-top: 3px;
    }

    .display_none_u_540{
        display: none;
    }

    #cookie-banner #nur_notwendige_btn{
        display: block;
        margin: 10px 0 0 0;
    }

    #cookie-banner a.btn {
        font-size: 12px;
        font-size: 0.75rem;
        padding: 5px 30px;
    }

    #cookie-banner #cookie_hinweis_akzeptieren{
        display: none;
    }

    #profil_head .avatar_pic {
        margin-bottom: 10px;
    }


    .dropdown #submenu_23 {
        width: 95%;
    }
    .dropdown #submenu_23 li{
        height: auto !important;
    }
    .dropdown #submenu_23 li.text a{
        padding-left: 0 !important;
    }

    #designbeispiele_balken #footer_links li {
        margin: 0 15px 0 0;
    }
    #designbeispiele_balken .breite50.float_right {
        float: left;
        margin-top: 10px;
    }

    #designbeispiele_balken .breite50.float_right {
        margin-bottom: 10px;
    }

    #footer_links li {
        line-height: 20px;
    }

    #header_content img.logo {
        max-width: 80%;
    }

}
/* ----------------------------------------------------------------------------- *
 *                          ENDE < 320px                                         *
 * ----------------------------------------------------------------------------- */



/* ----------------------------------------------------------------------------- *
 *                           > 320px & < 540px                                   *
 * ----------------------------------------------------------------------------- */
@media only screen and (min-width: 20em) and (max-width: 33.75em) {

    #startseite .btn_2zeiler, .green.btn_2zeiler{
        width: 70%;
        letter-spacing: normal;
        font-size: 14px;
        font-size: 0.875rem;
        height: auto;
        padding-bottom: 8px;
    }


    .btn_2zeiler span{
        display: none !important;
    }

    .preisgeld_tarif {
        width: 100%;
        margin-right: 0;
    }
    #preise #h_kat_name {
        display: block;
    }
    #preise .content .submenu {
        top: 92px;
    }

    .kosten_hinweis_klammern{
        margin-left: 0;
    }

    .designbeispiel dt span, .designbeispiel dd span{
        font-size: 12px;
        font-size: 0.75rem;
    }

    .designer_verzeichnis select {
        width: 100%;
    }
    .designer_verzeichnis input#user {
        width: 75%;
    }

    .profil_navi {
        background-image: none;
        font-size: 13px !important;
        font-size: 0.8125rem !important;
    }
    .profil_navi li {
        float: none;
        padding: 0;
    }
    .profil_navi li, .profil_navi li.highlight {
        height: 25px;
    }

    .designbeispiel_popup{
        float: none !important;
        clear: both !important;
        padding: 20px 0 10px 0;
    }

    .designbeispiel_popup .green.btn_2zeiler {
        font-size: 13px !important;
        font-size: 0.8125rem !important;
        padding: 0 5px;
        width: 90%;
    }

    #startseite ul.design_kategorien li{
        width: 50% !important;
        box-sizing: border-box;
    }

    body#community .gewinnerDesingBild, body#projekt_lp .gewinnerDesingBild{
        width: auto !important;
    }
    body#community .gewinnerDesingBild img, body#projekt_lp .gewinnerDesingBild img{
        width: 100%;
        height: auto;
    }

    .designs .design.design3, .designs .design.design3 .bild, .designs .design.design3 .info {
        width: 100% !important;
        box-sizing: border-box;
    }
    .designs .design.design3 .bild img{
        max-width: 100%;
        height: auto;
    }

    body#kategorien h2{
        font-size: 16px;
        font-size: 1rem;
    }

    #navi_content ul ul a {
        font-size: 12px;
        font-size: 0.75rem;
    }

    #navi_content ul ul ul {
        left: 180px;
        width: 180px;
    }
    #navi_content ul ul {
        min-width: 180px;
    }

    .seite404{
        height: auto !important;
        background-image: none;
    }

    .seite404 h1{
        margin: 0;
        width: auto !important;
        color: #000000;
        line-height: 150%;
        text-align: left;
    }

    .seite404 div{
        margin: 40px 0 0 0px;
    }



    .projekt_header {
        background-color: transparent;
        border-bottom: none;
    }

    .reiternavi {
        height: auto;
        margin-top: 30px;
    }

    .reiternavi li{
        width: 100%;
        background-color: #F6F6F6;
        margin-bottom: 3px;
        float: none;
        box-sizing: border-box;
    }

    .reiternavi li.highlight {
        border: none;
        height: auto;
        background-color: transparent;
        background-color: #F6F6F6;
    }


    body#profil .reiternavi {
        background: none;
    }

    body#profil .reiternavi li {
        background-color: #F6F6F6 !important;
    }

    body#profil .tabs ul.tabs_liste li {
        height: 36px;
    }


    #hilfebox{
        display: none;
    }

    ul.pop a.has_sub {
        width: auto;
    }

    body#projekt_lp .beispielprojekt_div .beispielprojekt_bild{
        display: block;
        width: 50%;
    }
    body#projekt_lp .beispielprojekt_div .beispielprojekt_designs, .beispielprojekt_div .beispielprojekt_preis{
        width: 25%;
    }
    body#projekt_lp .beispielprojekt_div .beispielprojekt_desc{
        display: none;
    }

    #testimonials .header_hg {
        height: 400px;
    }
    .nutzermeinung img {
        float: none;
    }
    .nutzermeinungen .nutzermeinung_zitat_info{
        margin-left: 0;
        margin-top: 5px;
    }

    body#projekt_lp .gewinnerDesingInfo h1, #testimonials .header_hg h1{
        font-size: 24px;
        font-size: 1.5rem;
        line-height: 30px;
    }


    .designs .design2{
        width: 100%;
        height: 100%;
        box-sizing: border-box;
    }
    .designs .design2 .bild {
        width: 100%;
        height: 100%;
        box-sizing: border-box;
    }
    .designs .design2 .bild img {
        max-width: 100%;
        max-height: 100%;
        box-sizing: border-box;
    }
    .designs_sort_form select{
        margin-top: 3px;
    }

    body#screenshots #designScreenshot #kommentare_zum_design textarea{
        width: 100%;
    }

    body#screenshots #designScreenshot #kommentare_zum_design .bewertung .float_left{
        float: none;
        display: block;
        margin-bottom: 5px;
    }


    div.slideout-form {
        right: 0;
        left: 0;
        margin-right: auto;
        margin-left: auto;
        width: 85%;
    }

    .display_none_u_540{
        display: none;
    }

    #cookie-banner #nur_notwendige_btn{
        display: block;
        margin: 10px 0 0 0;
    }

    #cookie-banner #cookie_hinweis_akzeptieren{
        display: none;
    }

    .dropdown #submenu_23 {
        width: 95%;
    }
    .dropdown #submenu_23 li{
        height: auto;
        line-height: 14px !important;
    }
    .dropdown #submenu_23 li{
        height: auto !important;
    }
    .dropdown #submenu_23 li.text a{
        padding-left: 0 !important;
    }

    #designbeispiele_balken #footer_links li {
        margin: 0 15px 0 0;
    }
    #designbeispiele_balken .breite50.float_right {
        float: left;
        margin-top: 10px;
    }

    #footer_links li {
        line-height: 20px;
    }

    #header_content img.logo {
        max-width: 80%;
    }

}
/* ----------------------------------------------------------------------------- *
 *                          ENDE > 320px & < 540px                               *
 * ----------------------------------------------------------------------------- */









@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */

    .designbeispiel #designbeispiel_bild_1.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceOne.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_1.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceOne.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_2.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceTwo.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_2.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceTwo.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_3.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceThree.png);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_3.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceThree.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_4.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFour.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_4.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFour.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_5.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFive.jpg);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_5.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFive.webp);
    }

    .designbeispiel #designbeispiel_bild_6.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSix.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_6.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSix.webp);
        background-size: cover;
    }


    .designbeispiel #designbeispiel_bild_7.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSeven.png);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_7.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSeven.webp);
    }

    .designbeispiel #designbeispiel_bild_8.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceEight.png);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_8.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceEight.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_9.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceNine.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_9.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceNine.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_10.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceTen.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_10.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceTen.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_11.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceEleven.png);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_11.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceEleven.webp);
    }

    .designbeispiel #designbeispiel_bild_12.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceTwelve.png);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_12.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceTwelve.webp);
    }

    .designbeispiel #designbeispiel_bild_13.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceThirteen.png);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_13.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceThirteen.webp);
    }

    .designbeispiel #designbeispiel_bild_14.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFourTeen.png);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_14.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFourTeen.webp);
    }

    .designbeispiel #designbeispiel_bild_15.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFifteen.png);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_15.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceFifteen.webp);
    }

    .designbeispiel #designbeispiel_bild_16.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSixteen.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_16.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSixteen.webp);
        background-size: cover;
    }

    .designbeispiel #designbeispiel_bild_17.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSevenTeen.png);
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_17.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceSevenTeen.webp);
    }

    .designbeispiel #designbeispiel_bild_18.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceEighteen.jpg);
        background-size: cover;
    }
    .modernizr_webp .designbeispiel #designbeispiel_bild_18.lazy-background.visible{
        background: url(../img/landing/home/reference/referenceEighteen.webp);
        background-size: cover;
    }

}