/************************************
*           GENERAL STYLES          *
************************************/

html, body{
    height: 100%;
    font-family: Lato;
    padding-left: 10;
    padding-right: 10;
}

.container, .container-fluid {
    padding:0;
}

a {
    color: red;
    text-decoration:none;
}

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

li {
    list-style-type:square;
}

.row {
    margin-right:0;
}

.enquote::before {
    content: "»";
}

.enquote::after {
    content: "«";
}

.brand {
    color:red;
}
.language-icon {
    width: 48px;
    height: 48px;
}

a .section-anchor {
    padding-top:24;
}

h1 {
    font-size:60;
    padding-bottom:24;
}

h2 {
    padding:12 0;
    margin:0;
    font-size:36;
}

col-sm-12, col-xs-12 {
    padding:4px;
}

/************************************
*             FRONT PAGE            *
************************************/

#frontpage {
    height: 100vh;
}

.logo img {

    max-width:100%;
}

#bildmarke {
  height:75vh;
  margin-top:10vh;
  margin-bottom:10vh;
    text-align: center;
}

#wortmarke {
    margin-top:21vh;
}

#wortmarke img {
    padding-right:40px;
    opacity: 0;

}

/************************************
*             NAVIGATION            *
************************************/

#navigation {
    font-size:10;
    z-index:1000;
    cursor:default;
    background: white;

    display: none;
}

#nav {
    text-align:justify;
}

#nav:after {
    content:'';
    display:inline-block;
    width:100%;
}

#nav a {
    color:black;
}

#nav li {
    display:inline-block;
    list-style-type:none;
}

.fixed-bottom, .fixed-top {
    position:fixed;
}

.flow-nav {
}

.fixed-bottom {
    bottom:0;
    padding-bottom:6;
}

.fixed-top {
    top:0;
    height:5vh;
    padding-top:24;
}

.flow-nav, .fixed-top {
    padding-bottom:48;
}

.active-page {
    color:red;
}

/************************************
*               PAGES               *
************************************/

.section {
    min-height:100vh;
    padding-top:48;
    padding-bottom:48;
    border-bottom: 1px solid gray;
}

#page-content {
    margin-top:80;
    font-size:20;
    text-align:justify;
    hyphens:auto;
}


/*  ACCORDION */

.accordion {
    margin-bottom:6;
    cursor:pointer;
    width:100%;
    text-align: left;
    background:white
    color:red;
}

.accordion:hover {
    color:red;
}

div.panel {
    display: none;
}

.expand {
    font-size:12px;
    line-height:48px;
    vertical-align:middle;
    float:left;
}

/*  QUOTE */

.quote {
    font-size:;
    margin-left:72;
    margin-bottom:48;
    padding-left:12;
    border-left: 4px solid red;
}

.quote-title {
    font-style:normal;
    font-weight:bold;
}

.image-container {
    text-align:center;
}

.portrait {
    width:100%;
    padding-bottom:24;
}

#sidemark {
    font-size:18;
    background:white;
    display:none;
    bottom:96;
    position:fixed;
}

#sidemark .image-container {
    width:100%;
    text-align:center;
}

#sidemark img {
    width:100%;
}

#footer {
    font-size:16;
    height:48;
    padding-top:16;
    width:100%;
    text-align:center;
    border-top:1px solid black;
    background:white;
    box-shadow:-15 -15 white;
    text-transform:uppercase;

    display:none;
}

/* SCREEN SIZE ADAPTATIONS */

@media (min-width: 250px) {
    h1 {
        font-size:80;
    }

    h2 {
        font-size:60;
    }

    #page-content {
        font-size:55;
    }

    #navigation {
        font-size:55;
    }

    .quote {
        font-size: 45;
    }

    .quote-title {
        font-style:normal;
        font-weight:bold;
    }
}

@media (min-width: 500px) {
    h1 {
        font-size:80;
    }

    h2 {
        font-size:60;
    }

    #page-content {
        font-size:35;
    }

    #navigation {
        font-size:40;
        z-index:1000;
        cursor:default;
        background: white;
        padding-bottom: 85;
        display: none;
    }

    .quote {
        font-size:24;
        margin-left:72;
        margin-bottom:48;
        padding-left:12;
        border-left: 4px solid red;
    }

    .quote-title {
        font-style:normal;
        font-weight:bold;
    }
}
