*{

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



a{

    text-decoration: none;

    color: rgba(247, 177, 1, 1);

}



html body{



    max-width: 80vw;

    margin: auto;

    font-family: 'Open Sans',sans-serif;

    line-height: 1.5;

    background:  rgba(51, 51, 51, 1);

}



header{



    background: url(./images/Logo-bagr-sever.png), url(./images/excav11.jpg);

    padding: 20px;

    padding-right: 40px;

    background-position: right top, center top;

    background-size: 300px, cover;

    background-origin: content-box, padding-box;

    background-repeat: no-repeat, no-repeat;

    height: 40vh;



    margin-top: 20px;

    



    border-radius: 1rem;

   

}











#uvod{

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: space-evenly;





    background: url(./images/excav9.jpg)

    no-repeat

    top;

    background-position: center top;

    background-size: cover;

    

    border-radius: 1rem;

   

    height: 50vh;



    margin: 30px 0;



}



.box{

    margin: 0 5vw;

    text-align: center;



    background: rgba(51, 51, 51, 0.5);

    border-radius: 1rem;

    padding: 1rem;

    color: silver;

}



.link

{

    margin: 0 5vw;

    text-align: center;



    background: rgba(51, 51, 51, 0.5);

    border-radius: 1rem;

    padding: 1rem;

}



.link :hover{

    color: rgba(247, 177, 1, 1);

    font-weight: bolder;



}



#Znacky{

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: space-evenly;





    background: url(./images/excav1.jpg)

    no-repeat

    center;

    background-size: cover;

   

    border-radius: 1rem;



    height: 50vh;



    margin: 30px 0;



}



#Pozvani{

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: space-evenly;





    background: url(./images/excav5.jpg)

    no-repeat

   center;

    background-size: cover;

   

    border-radius: 1rem;



    height: 50vh;



    margin: 30px 0;



}



footer{

    color: silver;

    text-align: center;

    margin-top: 40px;

    margin-bottom: 40px;

}







/* kontakt.html */







#kontakt{

    display: flex;

    justify-content: space-evenly;

    text-align: center;

    padding: 30px 0;

    margin-top: 30px;

}



i{

    color:rgba(247, 177, 1, 0.55);

    font-size: 3rem;

    padding: 10px;

}



#kontakt a :hover{

    color: rgba(247, 177, 1, 1);

}











/* Mobile device CSS */

@media only screen and (max-width:480px){







    html body{

        max-width: 100vw;

        line-height: 1.2;

        

    }



    header{

        background-position: center bottom;

        padding: 10px;

        border-radius: 0;

        margin-top: 0;

        height: 40vh;

    }



    #uvod{

        border-radius: 0;

        margin: 10px 0;

        font-size: 0.75rem;

    }



    #Znacky{

        border-radius: 0;

        margin: 10px 0;

        font-size: 0.75rem;

    }



    #Pozvani{

        border-radius: 0;

        margin: 10px 0;

        font-size: 0.75rem;

    }



    footer{

        font-size: 0.5rem;

        margin: 10px 0;

    }



    .link{

        font-size: 1rem;

    }



    .main{

        text-align: center;

        border-radius: 0;

        margin: 10px 0;

    }



    #loga{

        flex-direction: column;

        align-items: center;

    }



    .img-logo{

        margin: 15px 0;

    }



    #text p{

        padding: 0 10px;

    }



    .ref-L{

        margin: 10px 0;

        border-radius: 0;

        background: grey;

        padding: 10px;

        height: 100%;

        

    }

    

    .ref-L p{

        background: rgba(51, 51, 51, 0.75);

        color: silver;

        text-align: center;

        width: 100%;

        border-radius: 10px;

        margin: auto;

        margin-bottom: 10px;

        padding: 10px 0;

    }

    

    .ref-item{

        height: auto;

    }



    .ref-R{

        margin: 10px 0;

        border-radius: 0;

        background: grey;

        padding: 10px;

        height: 100%;

        

    }

    

    .ref-R p{

        background: rgba(51, 51, 51, 0.75);

        color: silver;

        text-align: center;

        width: 100%;

        border-radius: 10px;

        margin: auto;

        margin-bottom: 10px;

        padding: 10px 0;

    }



    .photo img{

        opacity: 1;

    }



    /* kontakt.html */



    #map img{

        width: 100vw;

        border-radius: 0;

        display: none;

    }



    #map{

        background: url(./images/obecne/map-mobile.png);

        background-position: center;

        margin-top: 10px;

        height: 40vh;

    }



    #kontakt{

        margin-top: 10px;

    }

}