/* CSS Document */

/* --- FONT IMPORT --- */

@import url('https://fonts.googleapis.com/css?family=Raleway:400,700');
@import url("https://use.typekit.net/kze0jwz.css");

/* --- CSS IMPORT --- */

@import url("header.css");
@import url("footer.css");


/* --------------------------
  Reset
--------------------------- */

* {
    padding: 0;
    margin: 0;
}


p,
tr {
    font-family: "brandon-grotesque";
}


/* --------------------------
  Main Styles
--------------------------- */

/* --------------------------
  Background Image
--------------------------- */

.container {
    display: flex;

    overflow-x: hidden;
}

.container-landing {
    background-position: center;
    background-size: cover;
    height: 100vh;
    padding: 0;
    margin: 0;
    z-index: -1;
    position: relative;
    transition: all 0.5s;
}

.container-landing-slidemenu {
    transition: margin-left 0.5s;
    margin-left: 250px;
}

/*--- Background Images ---*/

#main-showcase {
    background-image: url('../images/main-bg.jpg');
}

#contact-showcase {
    background-image: url('../images/94.jpg');
}

#bio-showcase {
    background-image: url('../images/_MG_0964-Bearbeitet_old.jpg');
}

@media(max-width: 600px) {
    #side-menu {
        font-size: 0.7em;
    }
    .container-landing-slidemenu {
        margin-left: 150px;
    }
    .logo-txt {
        transform: scale(0.6);
        margin: -1em -2.5em 0 0;
    }
}