@charset "UTF-8";
/* Reset ============================================ */
 *, 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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
     margin: 0;
     padding: 0;
     border: 0;
     font-size: 100%;
     font: inherit;
     vertical-align: baseline;
     box-sizing: border-box;
}
 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
     display: block;
}
 body {
     line-height: 1.5;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     -webkit-text-size-adjust: 100%;
     -ms-text-size-adjust: 100%;
}
 button {
     text-transform: none;
     overflow: visible;
     cursor: pointer;
}
/* Typography ============================================ */
 body {
     font-family: 'Open Sans', sans-serif;
     font-size: 16px;
     line-height: 1.6em;
     color: #333;
}
 @media only screen and (min-width: 1600px) {
     body {
         font-size: 1.2rem;
    }
}
 i {
     font-style: italic;
}
 strong {
     font-weight: bold;
}
 h1, h2, h3, h4 {
     font-family: 'Marcellus', sans-serif;
     margin-bottom: 0.5rem;
     line-height: 1.2;
}
 h1 {
     font-size: 4rem;
}
 h2 {
     font-size: 1.75rem;
     margin-bottom: 2rem;
}
 h3 {
     font-size: 1.5rem;
}
 #intro h3 {
     font-size: 2rem;
}
 h4 {
     font-size: 1.25rem;
}
 h5 {
     font-style: italic;
}
 em {
     font-style: italic;
     color: #58D5EE;
}
 p {
     margin-bottom: 1rem;
}
 p:empty {
     padding: 0.5rem
}
 a {
     color: #333;
     transition: all 0.15s ease-in-out;
}
 a:hover, a:focus, a:active, a:hover span {
     color: #ED97C2!important;
     text-decoration: none;
     outline: 0;
}
 a:hover:before, a:focus:before, a:active:before {
     background: #ED97C2;
     outline: none;
}
 a span {
     transition: all 0.15s ease-in-out;
}
 .btn {
     margin-top: 2rem;
     background: #7BDFF2;
     color: white;
     padding: 12px 20px;
     text-align: center;
     white-space: nowrap;
     vertical-align: middle;
     user-select: none;
     transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}
 .btn:hover, .btn:focus, .btn:active {
     background-color: #F7D6E0;
     color: white;
     text-decoration: none;
     outline: 0;
     box-shadow: none;
}
 .font-light {
     font-weight: 100;
}
 .font-400 {
     font-weight: 400;
}
 .font-bold {
     font-weight: 600;
}
 .check-list li {
     display: block;
     margin-left: 18px;
}
 .check-list li:before {
     content: "\f00c";
     font-family: 'FontAwesome';
     font-size: 10px;
     float: left;
     margin-left: -17px;
     color: #ED97C2;
}
 .list-circle {
     list-style-type: circle;
}
 .list-circle li {
     margin-left: 17px;
}
/* Layout ============================================ */
 .pb-15 {
     padding-bottom: 15px;
}
 @media only screen and (max-width: 991px) {
     .gallery-pb {
         padding-bottom: 15px;
    }
}
 .mb-3rem {
     margin-bottom: 3rem;
}
 @media only screen and (max-width: 575px) {
     .mb-sm {
         margin-bottom: 3rem;
    }
}
 @media only screen and (max-width: 767px) {
     .mb-md {
         margin-bottom: 3rem;
    }
}
 @media only screen and (min-width: 768px) {
     .mtop-5 {
         margin-top: 5rem;
    }
}
 section {
     padding: 4em 0;
}
 section:focus {
     outline: none;
}
 .service-item div {
     margin-bottom: 30px;
     margin-top: 13px;
}
 .card {
     box-shadow: 0 10px 15px -3px rgb(0 0 0 / 7%), 0 4px 6px -2px rgb(0 0 0 / 5%);
     border: 0;
     height: 100%;
}
 .mint-back {
     background-color: #EFF7F6;
}
 .pink-back {
     background-color: #F7D6E0;
}
 .blue-back {
     background-color: #D6F1F7;
}
 .green-back {
     background-color: #D6F7ED;
}
 .pink-border {
     border-left: 5px solid #ED97C2;
     padding-left: 15px;
     padding-right: 15px;
     width: fit-content;
}
/* Project specifics ============================================ */
/* navigation */
 @media only screen and (min-width: 992px) {
     nav {
         height: 130px;
    }
}
 nav a {
     color: #333;
}
 nav .btn {
     margin: 1rem;
     transition: 0.4s;
}
 @media only screen and (min-width: 992px) {
     .navbar-expand-lg .navbar-nav .nav-link {
         padding: 0 1.5rem;
    }
}
 .brand-black {
     max-height: 120px;
}
 .brand-black {
     display: inline-block;
}
 .navbar-toggler {
     border-color: #333;
     height: 49px;
}
 .navbar-toggler span {
     display: block;
     background-color: #333;
     height: 3px;
     width: 25px;
     margin-top: 5px;
     margin-bottom: 5px;
     position: relative;
     left: 0;
     opacity: 1;
     transition: all 0.35s ease-out;
     transform-origin: center left;
}
 .navbar-toggler span:nth-child(1) {
     margin-top: 0.3em;
}
 .navbar-toggler:not(.collapsed) span:nth-child(1) {
     transform: translate(15%, -33%) rotate(45deg);
}
 .navbar-toggler:not(.collapsed) span:nth-child(2) {
     opacity: 0;
}
 .navbar-toggler:not(.collapsed) span:nth-child(3) {
     transform: translate(15%, 33%) rotate(-45deg) ;
}
 .navbar-toggler span:nth-child(1) {
     transform: translate(0%, 0%) rotate(0deg) ;
}
 .navbar-toggler span:nth-child(2) {
     opacity: 1;
}
 .navbar-toggler span:nth-child(3) {
     transform: translate(0%, 0%) rotate(0deg) ;
}
 .shrink {
     background-color: white;
     background-color: rgba(255,255,255, 0.9);
     border-bottom: 1px solid #F7D6E0;
}
 nav.shrink a {
     color: #333;
}
 .shrink a:hover {
     color: #ED97C2;
}
 .shrink .btn {
     color: white;
}
 .shrink .btn:hover {
     color: white;
}
 .shrink .navbar-toggler {
     border-color: #333;
}
 .shrink .navbar-toggler span {
     background-color: #333;
}
 @media only screen and (min-width: 992px) {
     .shrink {
         padding: 0 1rem;
    }
     nav.shrink .btn {
         margin: 0.5rem 1rem;
    }
}
 @media only screen and (min-width: 400px) and (max-width: 991px) {
     nav.shrink .btn {
         margin: 0 1rem;
    }
}
 @media only screen and (max-width: 399px) {
     nav .btn {
         margin-left: auto;
         margin-right: 0;
    }
}
 .navbar-collapse.show~.btn, .navbar-collapse.collapsing~.btn {
     margin-left: auto;
     margin-right: 0;
}
 .navbar-collapse.show, .navbar-collapse.collapsing {
     padding-top: 1rem;
}
 .navbar-toggler:focus {
     outline: none;
}
 .dropdown-menu {
     min-width: 50px;
     left: 30px!important;
}
 .dropdown-menu, .dropdown-item:focus, .dropdown-item:hover {
     background: rgba(255,255,255,0.3);
     border: none;
}
 @media only screen and (min-width: 992px) {
     .nav-link {
         position: relative;
    }
     .nav-link:before {
         position: absolute;
         bottom: 0;
         left: 0;
         right: 0;
         margin: auto;
         width: 0;
         content: '.';
         color: transparent;
         height: 1px;
         transition: all .5s;
    }
     .nav-link:hover:before {
         width: 80%;
    }
}
 @media only screen and (max-width: 991px) {
     .navbar-nav {
         background: white;
         padding-right: 1rem;
         border-radius: 10px
    }
     .navbar-nav li {
         text-align: right;
    }
     .dropdown-item {
         padding-right: 0
    }
}
 .dropdown-item {
     text-align: center
}

/* intro */
 #intro {
     background-image: url("/static/images/intro3.png");
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     position: relative;
}
 #intro:before {
     content: "";
     background-color: rgba(255,255,255, 0.85);
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     opacity: 0.75;
}
 #intro > .container {
     padding-top: 30vh;
     padding-bottom: 1rem;
     position: relative;
}
 #intro .brand{
     max-height: 80px
}
 #kontakt .brand {
     display: inline-block;
     max-height: 40px;
     position: relative;
     top: 10px;
     margin: 0 0.3rem
}
 .brand.reverse {
     transform: scaleX(-1);
}
 h1 p {
     margin: 0
}
 pre {
     white-space: pre-wrap;
    /* css-3 */
     white-space: -moz-pre-wrap;
    /* Mozilla, since 1999 */
     white-space: -pre-wrap;
    /* Opera 4-6 */
     white-space: -o-pre-wrap;
    /* Opera 7 */
     word-wrap: break-word;
    /* Internet Explorer 5.5+ */
}
/* sub-title */
 #sub-title p {
     display: inline;
     position: relative;
     top: -4px;
     padding-left: 7px;
}
 @media only screen and (min-width: 992px) {
     #sub-title .lead {
         position: relative;
         padding-right: 30px;
    }
}
 @media only screen and (max-width: 991px) {
     #sub-title {
         text-align: center;
    }
}
/* gallery */
 .gallery a:hover .card-title {
     color: #ED97C2;
     font-weight: bold;
}
 .gallery img {
     width: 100%;
}
 .gallery .card .galerie3-photo {
     height: 200px;
}
 .gallery .card .galerie1-photo {
     height: 200px;
}
 .gallery .card .galerie4-photo {
     height: 200px;
}
 .gallery .card .galerie2-photo {
     height: 200px;
}
 @media only screen and (min-width: 992px){
     .gallery .card .galerie3-photo {
         height: 200px;
    }
     .gallery .card .galerie1-photo {
         height: 126px;
    }
     .gallery .card .galerie4-photo {
         height: 381px;
    }
     .gallery .card .galerie2-photo {
         height: 126px;
    }
}
 .gallery .card-title {
     margin: 0;
}
/* about */
 @media only screen and (max-width: 767px) {
     .img-profile {
         margin: 0 auto 3rem;
         max-width: 350px;
    }
     .txt-profile {
         text-align: center;
    }
}
/* contact */
 address {
     font-size: 1.2rem;
}
 address a {
     display: block;
     color: inherit;
     z-index: 1;
     padding-bottom: 2rem;
}
 address a:hover, address a:active, address a:focus {
     color: #333;
}
 address a:hover .hover-address, address a.phone:hover {
     color: white;
}
 address i.fa {
     position: relative;
     bottom: -5px;
     font-size: 2.3rem;
     padding-right: 10px;
}
 @media only screen and (max-width: 767px) {
     .social {
         margin-top: 3rem;
    }
}
 .follow .fa {
     color: #333;
     font-size: 2rem;
     padding: 10px;
     transition: all 0.15s ease-in-out;
}
 .follow a, .archiv a {
     text-decoration: none
}
 .follow a:hover, .follow a:hover .fa {
     color: white!important;
}
 @media only screen and (max-width: 767px) {
     address {
         text-align: center;
    }
     address a:nth-child(1) {
         padding-bottom: 0;
    }
     address a:nth-child(2) {
         padding-bottom: 4rem;
    }
}
 footer {
     padding: 1rem 0;
     font-size: 0.9rem;
     text-align: center
}
 footer a {
     text-decoration: underline;
}

/* archiv */
 .img-item {
     margin: 10px;
     text-align: center;
}
 .img-item img {
     border-radius: 50%;
     width: 20vw;
     height: 20vw;
     max-width: 400px;
     max-height: 400px;
     object-fit: cover;
     opacity: 0.8;
     transition: all 0.15s ease-in-out;
}
 .img-item:hover img {
     opacity: 1
}
 @media only screen and (max-width: 767px){
     .img-item img {
         width: 80vw;
         height: 80vw
    }
}

/* event */
 .event {
     text-align: center
}
 .event img {
     width: 50%;
     border-radius: 10px;
     margin-right: auto !important;
     margin-left: auto !important;
     display: block !important;
}
 .event a {
     text-decoration: underline;
     font-weight: bold;
}

/* repertoar */
 @media only screen and (max-width: 767px){
     .repertoar iframe {
         max-width: 100vw!important
    }
}

/* 404 */
 .not-found {
     min-height: 60vh;
}