html {
    scroll-behavior: smooth;
    }
    
    body {
        background-color: #808080;
        text-align: center;
        /*font-family: Arial, Helvetica, sans-serif;*/
        font-family: 'Montserrat', sans-serif;
        padding: 0;
        margin: 0;
        display: flex;
        min-height: 100vh;
        flex-direction: column;
        font-weight: 500;
        /*animation: 2s ease 0s normal forwards 1 bodyfadein;*/
    }
    
    main {
        min-height: 5em;
        flex: 1;
    }
    
    section {
        min-height: 100%;
    }
    
    a {
        text-decoration: none;
        color: #353535;
    }
    
    li {
        list-style-type: none;
    }
    
    h3 {
        font-size: 40px;
        padding-top: 8%;
        margin-bottom: 5px;
    }
    
    hr {
        width: 30px;
        height: 3px;
        background: #929292;
        border: 0;
        margin-top: 0;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 40px;
    }
    
    #logo, li, img, .button {
        transition: all 300ms;
        -webkit-transition: all 300ms;
        -moz-transition: all 300ms;
        -o-transition: all 300ms;
    }
    
    /* HEADER *************************************************************/
    
    header {
        width: 100%;
        height: 65px;
        position: fixed;
        top: 0px;
        left: 0px;
        background: #a5a5a5;
        box-shadow: 0 1px 3px rgb(0, 0, 0, 0.3);
        z-index: 1;
    }
    
    #logo {
        width: 140px;
        float: left;
        margin: 18px 0 0 50px;
    }
    
    #logo:hover {
        opacity: 0.5;
    }
    
    #logo img {
        width: 100%;
    }
    
    header nav {
        float: right;
        margin: 8px 50px 0 0;
    }
    
    header nav ul li {
        float: left;
        margin-right: 25px;
    }
    
    header nav ul li a {
        font-size: 16px;
    }
    
    header nav ul li:hover {
        padding-top: 5px;
    }
    
    /* HOME *************************************************************/
    
    #home {
        background: url(img/zementgold.jpg);
        background-size: 100vh;
        background-position: center center;
        background-size: cover;
        background-attachment: fixed;
    }
    
    #home h1 {
        margin: 240px auto 0 auto;
        font-size: 150px;
        font-weight: 500;
        color: #999999;
        /*opacity: 0%;
        animation: 5s ease 1s normal forwards 1 h1fadein;*/
    }
    
    #home h2 {
        margin: 0 auto 0 auto;
        font-size: 30px;
        color: #999999;
        /*opacity: 0%;
        animation: 5s ease 1s normal forwards 1 h2fadein;*/
    }
    
    /*#home #homeschrift {
        padding-bottom: 47.5vh;
    }*/
    
    #home #pfeilimg a img {
        margin-top: 18%;
        width: 30px;
        height: 30px;
        opacity: 0.7;
    }
    
    #home #pfeilimg a img:hover {
        opacity: 1;
    }
    
    /* ABOUT *************************************************************/
    
    #about {
        margin-top: 0px;
    }
    
    #about img {
        width: 240px;
        height: 240px;
        border-radius: 50%;
    }
    
    #about h4 {
        font-size: 25px;
    }
    
    #about p {
        max-width: 65%;
        margin: 0 auto 0 auto;
    }
    
    #about img:hover {
        transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -o-transform: scale(1.1);
    }
    
    /* WORK *************************************************************/
    
    #work {
    }
    
    #work #projects {
    }
    
    #projects {
    }
    
    #projects {
        max-width: 900px;
        margin: 0 auto 0 auto;
    }
    
    #projects ul {
        padding: 0;
    }
    
    #projects ul li {
        width: 33.3%;
        float: left;
        margin-bottom: 15px;
    }
    
    #projects img {
        width: 280px;
        height: 170px;
        border-radius: 5px;
    }
    
    #projects img:hover {
        transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -o-transform: scale(1.1);
        box-shadow: 0 5px 5px rgba (0, 0, 0, 0.3);
    }
    
    /* CONTACT *************************************************************/
    
    /*form input, textarea {
        font-size: 15px;
        margin-bottom: 10px;
        border-radius: 2px;
        border: 2px solid;
        border-color: #929292;
        outline: none;
    }
    
    form input:first-child {
        margin-top: 10px;
    }
    
    form input {
        width: 552px;
        height: 30px;
    }
    
    form textarea {
        width: 550px;
        height: 200px;
        resize: none;
    }
    
    .input_text {
        color: #4a4a4c;
        padding-left: 10px;
    }
    
    ::-webkit-input-placeholder {color: #929292;}
    ::-moz-input-placeholder {color: #929292;}
    :-ms-input-placeholder {color: #929292;}
    :-moz-input-placeholder {color: #929292;}
    
    .button {
        background-color: #4a4a4c;
        color: #929292;
        width: 566px;
        height: 50px;
    }
    
    .button:hover {
        background-color: #929292;
        color: #4a4a4c;
    }*/

    #iframec {
        border: none; 
        width:40%; 
        height:700px; 
        margin: 0 0 0 1%;
    } 
    
    /* FOOTER *************************************************************/
    
    footer {
        width: 100%;
        height: 50px;
        background-color: #929292;
    }
    
    footer p {
        font-size: 12px;
        color: #e6e6e6;
        padding: 9px;
    
    }

    /* MEDIA *************************************************************/

    @media screen and (max-width: 1048px) {
        header {
            height: auto;
        }
    
        #logo {
            width: 100px;
            margin-top: 5px;
        }
    
        header nav {
            margin-top: 0;
        }
    
        #home h1 {
            font-size: 90px;
            margin-top: 200px;
        }
    
        #home h2 {
            font-size: 22px;
        }
    
        h3 {
            padding-top: 12%;
        }
    
        #about p {
            width: 80%;
        }
    
        #projects {
            width: auto;
        }
    
        #projects ul li {
            width: 100%;
            float: none;
        }
    
        #projects ul li:last-child{
            padding-bottom: 20%;
        }
    
        #projects img {
            width: 55%;
            height: auto;
        }
    
        /**form input, form textarea {
            
        }**/
    }
    
    /**** Handys  ****/
    
    @media screen and (max-width: 480px) {
        
        header nav ul li {
            /*float: left;*/
            text-align: center;
            margin-right: 34px;
        }

        header nav {
            text-align: center;
            margin: 8px 50px 0 0;
        }

        #home h1 {
            font-size: 60px;
        }

        #home h2 {
            font-size: 18px;
            margin-top: 200px;
        }

        form input {
            width: 300px;
            height: 30px;
        }
        
        form textarea {
            width: 300px;
            height: 200px;
            resize: none;
        }
        
        .input_text {
            color: #4a4a4c;
            padding-left: 10px;
        }
    
        .button {
            background-color: #4a4a4c;
            color: #929292;
            width: 300px;
            height: 50px;
        }
        
        .button:hover {
            background-color: #929292;
            color: #4a4a4c;
        }

        header nav ul li a {
            font-size: 12px;
        }
        
        header nav ul li:hover {
            padding-top: 2px;
        }
        
        header nav {
            float: right;
            margin: 8px 20px 0 0;
            padding-bottom: 18px;
        }

        #logo {
            width: 70px;
            float: left;
            margin: 18px 0 0 20px;
            padding-bottom: 1px;
        }
    }
    
    /**body2{
        margin: 0;
        padding: 0;
        background: #9b6ba3;
    }
    .search-box{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: #5d7177;
        height: 40px;
        border-radius: 40px;
        padding: 10px;
    }
    .search-btn{
        color: #e84118;
        float: right;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: #9b6ba3;
        display: flex;
        justify-content: center;
        align-items: center;
    } ***/
    
    .sub-menu-1 {
        display: none;
        
    }
    
    .main-nav ul li:hover .sub-menu-1 {
        display: block;
        position: absolute;
        background: rgb(0, 100, 0);
        margin-top: 15px;
        margin-left: -15px;
        
    }

    @media screen and (max-width: 600px) {
    
        form input {
        max-width: 552px;
        height: 30px;
    }
    
    form textarea {
        max-width: 550px;
        height: 200px;
        resize: none;
    }
    
    .input_text {
        color: #4a4a4c;
        padding-left: 10px;
    }

    .button {
        background-color: #4a4a4c;
        color: #929292;
        max-width: 566px;
        height: 50px;
    }
    
    .button:hover {
        background-color: #929292;
        color: #4a4a4c;
    }
}

/*@keyframes bodyfadein {
    0% {opacity: 0;}
    100% {opacity: 1;}
}*/

/*@keyframes h1fadein {
    0% {opacity: 0;}
    20% {opacity: 1;}
    40% {opacity: 0;}
    60% {opacity: 0;}
    80% {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes h2fadein {
    0% {opacity: 0;}
    20% {opacity: 0;}
    40% {opacity: 0;}
    60% {opacity: 1;}
    80% {opacity: 0;}
    100% {opacity: 1;}
}*/