/*@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gothic+A1:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');*/


/* gothic-a1-regular - latin */

@font-face {
    font-family: 'Gothic A1';
    font-style: normal;
    font-weight: 400;
    src: local(''), url('/fonts/gothic-a1-v13-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('/fonts/gothic-a1-v13-latin-regular.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/* gothic-a1-500 - latin */

@font-face {
    font-family: 'Gothic A1';
    font-style: normal;
    font-weight: 500;
    src: local(''), url('/fonts/gothic-a1-v13-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('/fonts/gothic-a1-v13-latin-500.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/* gothic-a1-600 - latin */

@font-face {
    font-family: 'Gothic A1';
    font-style: normal;
    font-weight: 600;
    src: local(''), url('/fonts/gothic-a1-v13-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('/fonts/gothic-a1-v13-latin-600.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/* gothic-a1-700 - latin */

@font-face {
    font-family: 'Gothic A1';
    font-style: normal;
    font-weight: 700;
    src: local(''), url('/fonts/gothic-a1-v13-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('/fonts/gothic-a1-v13-latin-700.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/* gothic-a1-800 - latin */

@font-face {
    font-family: 'Gothic A1';
    font-style: normal;
    font-weight: 800;
    src: local(''), url('/fonts/gothic-a1-v13-latin-800.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('/fonts/gothic-a1-v13-latin-800.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/* gothic-a1-900 - latin */

@font-face {
    font-family: 'Gothic A1';
    font-style: normal;
    font-weight: 900;
    src: local(''), url('/fonts/gothic-a1-v13-latin-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('/fonts/gothic-a1-v13-latin-900.woff') format('woff');
    /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

body {
    background-color: #000000 !important;
    color: #f8f8f8;
    font-family: 'Gothic A1', sans-serif;
    font-weight: 400;
    outline: none;
}

.bred {
    border: 1px solid red;
}

.white {
    color: #f8f8f8;
}

.mail {
    color: #f1a0c6;
}

.mail:hover {
    color: #f8f8f8;
    font-weight: 500;
}

.textinbild {
    position: absolute;
    top: 50%;
    left: 23%;
    transform: translate(-50%, -50%);
    background-color: black;
    text-align: left;
    padding-left: 14px;
    padding-right: 40px;
    padding-top: 7px;
    padding-bottom: 6px;
}

.btn {
    margin-left: 60%;
    font-weight: 500;
}

.icon-align {
    display: inline;
    vertical-align: middle
}


/****** LIGHT BOX GALLERY *******/


/* GALLERIE */

.galerie {
    width: 100%;
    padding-top: 15px;
}

.text {
    font-family: 'Gothic A1', sans-serif;
}

.font {
    font-family: 'Gothic A1', sans-serif;
    font-size: 20px;
    font-weight: 400;
}

.center {
    text-align: center;
}

.color {
    color: #f1a0c6;
    /**color: #FF7474;**/
}

.links:hover {
    color: white;
    font-weight: 500;
}

.tfarbe {
    font-family: 'Gothic A1', sans-serif;
    color: #f8f8f8;
}

.pic {
    max-width: 400px;
    width: 85%;
}

.headline1 {
    font-weight: 700;
    font-size: 160%;
    font-family: 'Gothic A1', sans-serif;
}

.headline2 {
    color: #f1a0c6;
    font-weight: 600;
    font-family: 'Gothic A1', sans-serif;
    font-size: 110%;
}

.headline3 {
    font-weight: 700;
    font-family: 'Gothic A1', sans-serif;
    font-size: 140%;
    margin-bottom: 200px;
}

.background {
    background-color: #282828;
    padding-left: 15px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-right: 15px;
}


/** PADDING & MARGIN **/

.pt100 {
    padding-top: 100px;
}

.pt50 {
    padding-top: 50px;
}

.pt30 {
    padding-top: 30px;
}

.mt30 {
    margin-top: 30px;
}


/** sidePanel **/

.pusha-panel {
    z-index: 1500;
}

.pusha-panel,
.colorstandard {
    background-color: #141414 !important;
    color: #ffffff;
}

div.sidepane {
    font-family: 'Gothic A1', sans-serif;
    text-transform: uppercase;
    margin: 3px 0 9px 15px;
    font-size: 100%;
    font-weight: 700;
}

div.sidepane a:hover {
    color: #FFFFFF;
}

div.sidepane .submenue {
    margin: 3px 0 9px 21px;
    font-size: 90%;
}

.colorstandard a {
    color: #f1a0c6;
}


/*************** S T A N D A R D S **********************/

h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
div {
    color: #ffffff;
}

h1 {
    word-break: break-all;
    font-weight: 800;
}

h2,
h3 {
    /*  word-break: break-all;*/
    font-weight: 700;
    font-size: 200%;
}

h4,
h5,
h6 {
    /*  word-break: break-all;*/
    font-weight: 600;
}

.red {
    color: red;
    font-style: italic;
}

nav {
    height: 130px;
}

a,
nav a {
    color: #f1a0c6;
}

.container {
    width: 1920px;
    max-width: 100%;
}

.container2 {
    width: 980px;
    max-width: 100%;
}

nav {
    max-width: 1200px !important;
    padding: 0 0.75rem;
    margin: 0 auto;
}

nav,
.nav-wrapper {
    background-color: #000000;
    box-shadow: none;
    text-transform: uppercase;
    font-weight: 500;
}

.nav-wrapper a.brand-logo img {
    max-height: 100% !important;
    display: inline-block;
    margin-top: 15px;
}

.nav-wrapper a {
    height: 96%;
}

nav .brand-logo {
    color: #fff;
    font-size: 1rem;
}

.headertitle {
    font-weight: 600;
    text-align: center;
    height: 130px;
    line-height: 130px;
}

nav a.navlink {
    height: 130px;
}

.knopf {
    font-size: 300px;
}

nav a i {
    line-height: 130px !important;
}

.fliesstext {
    max-width: 550px;
    margin: 14px auto;
}


/*********************** H E L P E R S *************************/

.mt0 {
    margin-top: 0;
}

.mt9 {
    margin-top: 9px;
}

.mtminus10 {
    margin-top: -10px;
}

.mt12 {
    margin-top: 12px;
}

.mt15 {
    margin-top: 15px;
}

.mt15important {
    margin-top: 15px !important;
}

.mt25 {
    margin-top: 25px;
}

.mt45 {
    margin-top: 45px;
}

.mt55 {
    margin-top: 55px;
}

.mt55important {
    margin-top: 55px !important;
}

.mt95 {
    margin-top: 95px;
}

.mb0 {
    margin-bottom: 0;
}

.mb15 {
    margin-bottom: 15px;
}

.mb25 {
    margin-bottom: 25px;
}

.mb45 {
    margin-bottom: 45px !important;
}

.mb65 {
    margin-bottom: 65px;
}

.mb95 {
    margin-bottom: 95px;
}

.mr0 {
    margin-right: 0 !important;
}

.mr5 {
    margin-right: 5px !important;
}

.mr09 {
    margin-right: 9px;
}

.mr12 {
    margin-right: 12px;
}

.mr18 {
    margin-right: 18px;
}

.mr25 {
    margin-right: 25px;
}

.ml0 {
    margin-left: 0 !important;
}

.ml5 {
    margin-left: 5px !important;
}

.ml25 {
    margin-left: 25px;
}

.ml25important {
    margin-left: 25px !important;
}

.pr0 {
    padding-right: 0;
}

.pl0 {
    padding-left: 0;
}

.pr12 {
    padding-right: 12px;
}

.tright {
    text-align: right;
    horiz-align: right;
}

.pb2 {
    padding-bottom: 2px;
}

.pb25 {
    padding-bottom: 25px;
}

.pb55 {
    padding-bottom: 55px;
}

.pt0 {
    padding-top: 0px;
}

.pt2 {
    padding-top: 2px;
}

.pt7 {
    padding-top: 7px;
}

.pt25 {
    padding-top: 25px;
}

.pl25 {
    padding-left: 18px;
}

.pl32 {
    padding-left: 32px;
}


/** FOOTER **/


/*footer {
  width: 100%;
  position: fixed;
  bottom: 0;
  border: 1px solid red;
}*/

.rekofooter {
    width: 980px;
    max-width: 100%;
    display: block;
    margin-top: 100px;
    font-family: 'Gothic A1', sans-serif;
    font-weight: 300;
}

.rekofooter a {
    text-transform: uppercase;
    display: inline-block;
    font-weight: 600;
    text-align: center;
    font-family: 'Gothic A1', sans-serif;
}

.rekofooter a:hover {
    color: #ffffff;
}

.rekofooter a:after {
    margin-left: 6px;
    margin-right: 6px;
    font-weight: 700;
    content: ".";
}

.rekofooter a:last-child:after {
    content: none;
}


/*
.swiper-slide {
background-image: url(/ressources/content/project_tree/shop4/background.png);
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;


}
*/

.swiper-button-prev,
.swiper-button-next {
    position: fixed !important;
    top: 47%;
}

.rekoteaser {
    background: #75aa9e;
    color: #000000;
}


/******************** REKO CARDS *************************/

.btn-reko,
.closesidenav {
    background-color: #f1a0c6;
}

.btn-reko,
.closesidenav2 {
    background-color: white;
    color: black;
}

.btn-reko:hover,
.closesidenav2:hover {
    box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
    background-color: #f1a0c6;
}

.btn-reko:link,
.btn-reko:visited {
    background-color: #f1a0c6;
}

.btn-reko:hover,
.closesidenav:hover {
    box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
    background-color: #ffc8e2;
    font-weight: 500;
}

.btn-reko {
    transform: scale(70%);
}

.cardreko {
    border: 0px solid #4e7191;
    background-color: #344b5e;
    text-transform: uppercase;
    font-size: 70%;
}

.portfoliocardcontent {
    border-top: 1px solid #4e7191;
    background-color: #344b5e00;
    text-transform: uppercase;
    font-size: 100%;
    text-align: center;
    padding: 15px;
}

.portfoliocard {
    border: 0px solid #4e7191;
    background-color: #3A546C;
    text-transform: uppercase;
    height: 50%;
    font-size: 80%;
}

.cardreko .card-title {
    font-size: 110%;
    width: 100%;
    font-weight: 600;
    text-align: center;
}

.cardreko .card-content,
.cardreko .card-action {
    text-align: center;
    padding-left: 12px;
    padding-right: 12px;
}

.cardreko .card-reveal * {
    color: #000000;
}

img.activator:hover {
    cursor: pointer;
}

.inlineblock {
    display: inline-block;
}


/****************** SLIDER ************************/


/** aktiver Punkt kann hier angegeben werden ***/

.indicator-item {
    transform: scale(70%)
}

.indicator-item.active {
    background-color: rgb(146, 146, 146) !important;
}

.slider_small {
    width: 640px;
}

.slides-sm li img {
    height: 50%;
    width: 50%;
    background-size: cover;
    background-position: center;
}


/****************** Extra Fonts ************************/


/** hier sind spezielle Einstellungen für Typobeschreibungen für die Referenzprojekte… ***/

.headBeschreibung {
    font-size: 140%;
}

i.standardtext {
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 4px
}

.headBeschreibung::before {
    margin-right: 10px;
}

.headAttribute {
    font-size: 140%;
}

.headAttribute::before {
    margin-right: 10px;
}

.headBeschreibung-ohne {
    font-size: 140%;
}


/************************** MEDIA QUERYS **************** */

@media screen and (max-width: 680px) {
    .uklein {
        min-width: 99%;
    }
}

@media screen and (max-width: 860px) {
    .sm100 {
        min-width: 49%;
    }
}

@media screen and (max-width: 990px) {
    nav a.navlink {
        position: absolute;
        right: 0;
    }
}

@media screen and (max-width: 860px) {
    .sm100 {
        min-width: 49%;
    }
}

@media screen and (max-width: 500px) {
    .pic {
        text-align: center;
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media screen and (max-width: 500px) {
    .btn {
        text-align: center;
    }
}

@media screen and (max-width: 1000px) {
    .galerieframe {
        width: 100% !important;
    }
}

@media screen and (max-width: 765px) {
    .media1 {
        min-width: 99%;
    }
}

@media screen and (max-width: 800px) {
    .media2 {
        min-width: 99%;
    }
}

@media screen and (max-width: 767px) {
    .media3 {
        min-width: 99%;
        text-align: center;
    }
}

@media screen and (max-width: 910px) {
    .media4 {
        min-width: 99%;
        width: 30%;
    }
    .btn {
        margin: 0;
    }
}


/*# sourceMappingURL=reko.css.map */