@font-face {font-family: 'MetroflexNarrow-Reg';src: url('webfonts/246410_0_0.eot');src: url('webfonts/246410_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/246410_0_0.woff') format('woff'),url('webfonts/246410_0_0.ttf') format('truetype');}


html, body {
        margin: 0 auto;
        padding: 0;
}



body {
        background-color:#51152F;
        padding:0;
        margin: 0 auto;

}

*,div,span,p,a,h1,h2,h3{
        font-family: 'Bitter', serif;
        font-size:17px;
        color:#501531;
        line-height:170%;
}
.display-project {
    float: left;
    margin-right: 30px;
    margin-bottom: 35px;
	height: 430px;
}
.port-bild  {
float:none;
}
.subnavigation                                          { height:37px; }
.subnavigation ul                                       { margin:0; padding:0; }
.subnavigation li                                       { margin:0; padding:0; list-style:none; float:left; padding:0 8px 0 0; font-family: MetroflexNarrow-Reg; color:#51152F; font-size:22px; font-weight:normal; text-decoration:none; letter-spacing:0.01em; }
.subnavigation li a                                     { padding:0 8px 0 0; font-family: MetroflexNarrow-Reg; color:#51152F; font-size:22px; font-weight:normal; text-decoration:none; letter-spacing:0.01em; }
.subnavigation li a:hover,
.subnavigation li a.active ,.subnavigation li a.selected                { color:#DA3794; }


a.mainnavi.high,
a.mainnavi:hover                                        { color:#DA3794; /*background:url(bilder/navi-active.jpg) no-repeat right top; padding:0 15px 0 0;*/ }

.contentpage p  { margin:0; padding:30px 0 30px 0; }
.contentpage div    { margin:0 0 0 0; padding:0 0 0 0; }
.contentpage img    { margin:0 0 0 0; padding:0 0 0 0; width: 100%}
.contentpage p.bildtext { margin:0; padding:15px 0 30px 0; }


h3 a            { color:#51152F; }

#bg{
border-top:6px solid #DA3794;
width:100%;
background:url(bilder/verlauf.png) top left repeat-x;
background-color:#eeeee9;
}



#maincontainer{
max-width: 940px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
min-height: 750px;
}



#topsection{
border-bottom: 6px solid #E4E1DA;
background:url(bilder/slogan-web-print.png) top right no-repeat;
margin-bottom:20px;
}

#topmenu{
border-bottom: 6px solid #E4E1DA;
margin-bottom:20px;
max-width: 940px;
}




#contentwrapper{
float: left;
width: 100%;
margin-bottom:30px;
}



#contentcolumn{
margin-left: 0px; /*Set left margin to LeftColumnWidth*/
}

.contentpage .content-left ul, .contentpage .content-left  li{
list-style-type:none;
margin:0;
padding:0;
}

.contentpage .content-left  li{
height:28px;
font-family: MetroflexNarrow-Reg;
        color:#DA3794;
        font-size:22px;
        font-weight:normal;
        text-decoration:none;
        margin:0;
        letter-spacing:0.01em;
}



.clearleft{clear:left}

#footer{
clear: left;
color: #DA3794;
margin: 0 auto;
padding-left:0px;
padding-top:30px;
padding-top:30px;
text-decoration:none;
margin-bottom:30px;
max-width: 940px;
}

a{color: #948E7E;text-decoration:none;}

#footer td, #footer a,#footer span{
color: #DA3794;
font-size:14px;
text-decoration:none;
line-height:25px;
font-weight:normal;
}
#footer .part1, #footer .part2{
margin-bottom:30px;
float:left;
width:30%;
}
#footer .part3, #footer .part4{
margin-bottom:20px;
float:left;
width:20%;
}

h1,h2,#topmenu a, .content-left li a {
        font-family: MetroflexNarrow-Reg;
        color:#DA3794;
        font-size:22px;
        font-weight:normal;
        text-decoration:none;
        margin:0;
        letter-spacing:0.01em;
}

.content-left a:hover, .content-left li a.active {
        color: #51152F;
}

h3{
margin:0;
margin-bottom:5px;
}

#topmenu a{
color:#51152F
}

#topmenu a:hover{
color:#DA3794
}

.contentpage a.graulink{
        color: #948e7f;
}

a.mehr{
    color: #51152F;
    display: inline-block;
	font-weight: bold;
    margin-top: 10px;
    padding-top: 1px;
    line-height:16px;
    text-decoration: none;
    min-height: 80px;
}


a.portfolio{
    color: #51152F;
    display: inline-block;
	font-weight: regular;
    margin-top: 10px;
    padding-top: 1px;
    line-height:16px;
    text-decoration: none;
    min-height: 80px;
}


a.zurueck{
    color: #51152F;
    display: inline-block;
	font-weight: bold;
    margin-top: -80px;
    padding-top: 1px;
    line-height:16px;
    text-decoration: none;
    min-height: 80px;
}



/* von Muhammed
a.mehr{
    color: #51152F;
    display: inline-block;
	
    margin-top: 10px;
    padding-top: 1px;
    line-height:16px;
    text-decoration: none;
    min-height: 100px;
}
*/



a:hover{
        color: #DA3794;
}

a.mehr:hover{
        color: #DA3794;
}

.contentpage a                  { color: #51152F; text-decoration:none; }
.contentpage a:hover    { color: #DA3794; }
.contentpage a:hover     h3{ color: #DA3794; }

.portfolio a.mehr{
    font-weight: normal;
    margin-top: 0px;
    padding-top: 0px;
}

.raquo{
        font-size:18px;
        position:relative;
        top:0px;
        left:4px;
        /*float:right;
        font-weight:normal;
        padding-top:2px;
        display:inline-block;
        margin-left:6px;*/
}

#topmenu ul, #topmenu li{
list-style-type:none;
margin:0;
padding:0;
margin-right: 20px;
margin-bottom: 15px;
display: inline-block;
margin-top: -15px;
}

#topmenu li{
font-size:24px;
height:32px;
}

p {
        padding: 0px;
}

.inner{
margin-top: 10px;
margin-bottom: 10px;
margin-left: 0;
margin-right: 0;
}


bxslider{
	margin-top: 50px;
}


#contentcolumn .inner{
line-height:22px;
}

#contentcolumn h2{
clear:both;
font-size:24px;
margin-bottom:10px;
margin-top:0px;
}

#contentcolumn .content-left.small h2{
margin-top:0px;
margin-bottom:8spx;
}

h1.intro, h1.intro span {
        font-family: 'Bitter', serif;
        font-size:30px;
        color:#DA3794;
        font-weight:normal;
        line-height:36px;
        letter-spacing:0em;
}

h1.intro{
clear:both;
padding-top:0px;
margin-top:0;
}

div.startteaser, div.contentpage{
clear:both;
padding-bottom:20px;
padding-top:0px;
margin-bottom:20px;
margin-top:0;
width:100%}

div.contentpage{
padding-top:12px;
}

div.portfolio{
margin-right:-40px;
width:760px;
}

.teaserwrapper{

}

.content-right{
margin-top:20px;
line-height:160%;
padding-bottom:20px;
}

.content-right-kontakt{
margin-top:33px;
float: left;
padding-bottom:20px;
width:300px;
}

.content-right.wide{
line-height:26px;
margin-top:20px;
}

.content-left{
float: left;
max-width: 450px; /*Width of left column*/
padding-right:20px;
padding-bottom:20px;
line-height:160%;
margin-right:20px!important;
}

.content-left-kontakt{
margin-top:-15px;
float: left;
width: 450px; /*Width of left column*/
padding-right:20px;
padding-bottom:20px;
}

.content-left.small{
margin-top:30x;
width: 197px;
height: 300px;
}

.port-teaser{
float:left;
margin-right:15px;
height:370px;
}

.port-bild{
width: 440px;
}


.port-text{
padding-top:10px;
max-width:440px;
line-height:22px;
}

hr{clear:both;
border:none;
margin-top:20px;
margin-bottom:40px;
color: #E4E1DA;
background-color: #E4E1DA;
height: 6px;
}

.img-border{border: 1px solid #E4E1DA;}
.img-borderbig{border: 6px solid #E4E1DA; margin-top:20px;margin-bottom:10px;}
.content-right .img-border{margin-top:5px;margin-bottom:5px;}
.pink, #topmenu a.high{color:#DA3794; }
.lila,h1 span.lila{color:#51152F}


.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

@media only screen and (min-width: 601px) {
  nav ul.menu {
   max-height: 20px;
                        }
   a#nav-m, a.close {
     display: none;
}
  nav ul li {
  margin: 0 30px 0 0;
}
}

@media only screen and (min-width: 768px) {
 nav ul.menu {
   max-height: 20px;
                        }
   a#nav-m, a.close {
     display: none;
}
  nav ul li {
  margin: 0 30px 0 0;
}

}

@media only screen and (max-width: 480px) {
.content-right .img-border {

    width: calc(100% - 14px);
}
#topsection {
    background-size: 240px 100px !important;
}
 }


@media only screen and (max-width: 600px) {
#topsection {
    border-bottom: 6px solid #E4E1DA;
    background: url(bilder/slogan-web-print.png) bottom left no-repeat;
    margin-bottom: 20px;
    padding-left: 8px;
}
#footer .part1, #footer .part2,#footer .part3, #footer .part4{
float:none; margin-left:20px;
width: 100%;
}
h1.intro,div.startteaser {
    padding-left:8px;

}


h1.intro{
   word-wrap: break-word;
}

/* – mehr-Link von Muhammed */
a.mehr {
      min-height: 1px;
}



.content-left {

    padding-bottom: 0px;

}
.pink {
    color: #DA3794;
}

div.startteaser {
display:flex;
margin-bottom: 0px;
flex-direction: column-reverse;
}
nav {
direction: rtl;
margin-top: -15px;
}
#topmenu a.high {
    color: #fff;
    /* color: #fff; */
}
.content-left,.content-right {
float:none;
}
.content-left .span{
word-wrap: break-word;
}
.content-right .img-border {
    margin-right:8px;
    float: left;
}

#logo img {
    padding-bottom:50px;
    padding-left:20px;
}
/*Formatierung Mobiles Menue*/
#topmenu ul, #topmenu li {
    display: block;
    margin-top: 0px;
    z-index: 2;

}
#topmenu a:hover,#topmenu a:active{
color:#fff;
}
a.mainnavi.high, a.mainnavi:hover{

    color: #fff;

}
.display-project{

    margin-left:10px;

}

                        nav ul {
                                top: 12em;
                                position: absolute;
                                background: #DA3794;
                                /*background: rgba(200,200,200,0.95);*/
                                width: 100%;
                                left: -100%;

                                list-style-type:none;
                                margin: 0;
                                margin-left:10px;
                                padding: 0;
                                transition:all .6s ease;
                                -webkit-transition:all .6s ease;
                                height: 100%;
                                display: block;
                        }
                        nav ul li{

                                text-align: left;
                                padding: 0em 0.5em;
                                border-bottom: 1px solid #fff;

                        }
                        nav ul li a {
                                color: #555;
                                padding: 1em 0;
                                padding-left: 15px;
                        }
                        nav ul.menu li a:hover {
                                border-bottom: 0;
                        }

                        /*Hamburger-Icon*/
                        a#nav-m img, a.close img {
                                width: 40px;
                                height: auto;
                        }
                        nav > .close,
                        a#nav-m:target {
                                display: none;
                        }

                        a:target ~ ul,
                        a:target ~ .close {
                                display: inline-block;
                        }

                        a:target ~ .close {

                                margin-left: -40px;
                        }

                        a:target ~ ul {
                                left: 0;
                        }
 }