@import url(fonts.css);
body { font-family: 'Ogilvy Sans'; font-weight: 300; font-style: normal;}

a{text-decoration:none;}
a:hover{text-decoration:none;}

button:focus {outline:0 !important;}


/*.logo {position:fixed; z-index: 1031; right:80px; text-align:center; font-size: 50px; top:0; width: calc(100% - 160px); margin:5px 0;}*/

header{ position: fixed; top: 0; left: 0; right: 0; height: 0; text-align: center; z-index: 1000;}
.logo {text-align: center; z-index:1038}
.logo a {display: inline-block; z-index: 1039; font-size: 50px; margin: 8px 0;}

.burger { z-index: 1036; text-align:right;}
.burger button { display: inline-block; z-index: 1037; font-size: 8px; margin: 24px 40px 24px 0; border:none;background:none;}


.show ~ header .burger button{margin: 10px 30px 10px 0;}
.show ~ header .burger .icon-Burger:before{font-size:32px}

.scrollholder{z-index:5; position: absolute; bottom:20px; width:100%;}
.scrollholder.red .icon-Pfeil_runter:before {color:#EB3F43;}

.fp-slidesNav.fp-bottom {bottom: 50px;}
#fp-nav ul li a span, .fp-slidesNav ul li a span { background: rgba(255,255,255,0.4); }
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span { height: 12px; width: 12px; margin: -6px 0 0 -6px; background: rgba(255,255,255,1)}
#fp-nav ul li a span, .fp-slidesNav ul li a span { height: 12px; width: 12px; margin: -6px 0 0 -6px;}

/*#menu {display:none}*/

/* Backgrounds will cover all the section
* --------------------------------------- */
.work, .work .slide{ background-size: cover; /*background-attachment: fixed;*/ background-position:center center;}
.awards { background-size: cover; /*background-attachment: fixed;*/ background-position:center center;}

.work .infos{color:#FFFFFF; padding-top:10px;}
.work .icon-Play{font-size:80px;}


.spacer-item{height:calc(50% - 40px);}
.work-item{height:calc(50% + 40px);padding: 0 60px;}

.content{padding:0 30px;}
.content img {width:100%; max-width:550px;}
.slide img{width:100%; max-width:1280px; height:auto;}

.fp-controlArrow.fp-next,
.fp-controlArrow.fp-prev {
    width: 0;
    border-width: 0;
    border-color: transparent;
    color:#FFFFFF;
}
.fp-controlArrow.fp-prev {
    transform: rotate(90deg);
    left:30px;
    margin-top:-16px;
}
.fp-controlArrow.fp-next {
    transform: rotate(270deg);
    right:30px;
    margin-top:16px;
}

.fp-controlArrow.fp-next:before,
.fp-controlArrow.fp-prev:before{
    font-family: 'icomoon' !important;
    content: "\e905";
    font-size:20px;
    line-height:20px;
}

.modal-dialog {
    max-width:85%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal-body {
    position:relative;
    padding:0px;
}
.close {
    position:absolute;
    right:-30px;
    top:0;
    z-index:999;
    font-size:2rem;
    font-weight: normal;
    color:#fff;
    opacity:1;
}
.modal-backdrop.show {
    opacity: 1;
}

.navbar-collapse{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height:100%!important;
    background-color:#24298f;
    color:#ffffff;
    z-index:5;
}
.navbar-nav{ align-items: center; justify-content: center;  height: 100%;}
.navbar-nav li a{color:#EB3F43;
     font-size: 80px;
     padding: 10px 0;line-height:80px
 }
.collapsing {
    -webkit-transition: none;
    transition: none;
}

.navbar-collapse footer{position:absolute; bottom:30px; width:100%; text-align:center;}
.navbar-collapse footer p, .footer p, .footer a{ color:#eb3f43; font-size:14px; }

.navbar-collapse.show ~ .burger span,
.navbar-collapse.show ~ .logo span {
    color: #eb3f43;
}

header .logo{right:90px!important; left:90px!important;}
/*.logo .midnightHeader{right:90px!important; left:90px!important;}*/

.midnightHeader.default a, .midnightHeader.default button {
    background: none;
    color: #FFFFFF;
}
.midnightHeader.white a, .midnightHeader.white button {
    background: none;
    color: #FFFFFF;
}
.midnightHeader.red a, .midnightHeader.red button {
    background: none;
    color: #eb3f43;
}

.flex-fill {
    flex:1;
}

.logos img{margin:15px 0;}
footer, .footer {padding:1rem;}


.overlay {
    background-color:rgba(0,0,0,0.3);
    background-blend-mode: multiply;
}