* {
    box-sizing: border-box;
    font-family: 'Assistant', sans-serif; 
    color: #323132;
    background-color: #F5F5F4;
}

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

a:link {
    text-decoration: none;
    color: #323132;
  }

body {
    width: 98%;
    margin-left:auto;
    margin-right:auto;
}


h1 {
    clear: both;
    font-size: 1.5em;
}

h2 {
    clear: both;
    font-size: 1.2rem;
    margin-top: 2rem;
    color: #8D6E47;
}

h3 {
    clear: both;
    font-size: 1rem;
    margin-top: 2rem;
}

h4 {
    clear: both;
    font-size: 1em;
}

nav {
    position: sticky;
    top: 0;
}

.header-h1 {
    color:#F39E4D;
    text-transform: uppercase;
    font-size: 1.5em;
    margin: inherit;
}

.header-h2 {
    color: #323132;
    font-size: 2em;
    margin: inherit;
}

.li-header {
    display: block;
    padding: 2px;
    font-weight: bold;
}

.ul-header {
    color: #323132;
    padding: 0;
}

.alert {
    clear: both;
    color: #8D6E47;
    font-weight: bold;
    font-size: 1.5em;
}

article{
    clear: both;
}

img {
    width: 100%;
    max-width: 600px;
}

.title-container {
    clear: both;
    position: relative;
    text-align: center;
}

.title-centered {
    position: absolute;
    border: 3px solid #F5F5F4;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(0,0,0, 0.4);
}

.title-text {
    color: #F5F5F4;
    background-color: inherit;
    margin: 10px;
    font-size: 1rem;
}



.title-img {
    max-width: 100%;
}


address {
    font-style: normal;
}

.adress-name {
    font-weight: bold;
    padding: 5px 0px;

}

.float-left {
    width: 100%;
    padding: 0px;
}

.float-right {
    width: 100%;
    padding: 0px;
}

input, textarea {
    width: 100%;
    font-size: 1em; 
    padding: 4px;
    font-family: inherit;
    font-weight: lighter;
    border-radius: 0.3em;
} 

input[type=submit] {
    background-color: #F39E4D;
    cursor: pointer;
    width: 10em;
    padding: .3em 0;
    border-radius: 0.7em;
    margin-top: 0.7em;
}


footer {
    clear:both;
    border-top: 1px solid #F39E4D;
    padding: 10px;
    margin-top: 25px;
    text-align: center;
    }

.footer-legal {
    padding-top: 10px;
}


@media only screen and (min-width: 800px) {

    body {
        width: 80%;
        max-width: 1200px;
        margin-left:auto;
        margin-right:auto;
        padding: 5px;
    }

    nav {
        position: static;
        top: 0;
    }
 
    .float-left {
        float: left;
        width: 50%;
        padding: 10px;
    }
        
    .float-right {
        float: right;
        width: 50%;
        padding: 10px;
    }

    .li-header {
        float: left;
        display: block;
        padding: 15px;
        font-weight: bold;
    }
    
    .ul-header {
        float: right;
        color: #36344d;
    }

    .title-text {
        font-size: 2rem;
    }
    

  }