#ref1{
    background-image:url('../img/reference/veseli2/veseli-new.jpg');
    background-size:cover;
}

#ref2{
    background-image:url('../img/reference/zavodmiru/zv-new.jpg');
    background-size:cover;
}


#ref3{
    background-image:url('../img/reference/kunetice/kunetice-new.jpg');
    background-size:cover;
}

#ref4{
    background-image:url('../img/reference/veseli/veseli-new.jpg');
    background-size:cover;
}

#ref5{
    background-image:url('../img/reference/chrudim/chrudim-new.jpg');
    background-size:cover;
}

#ref6{
    background-image:url('../img/reference/polabiny/polabiny-new.jpg');
    background-size:cover;
}

.visible{
    display:none;
}

.product-label{
    visibility:visible;
    transition:0.7s;
}

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

.text-white{
    color:white;
}

.items-center-horizontal{
    display:flex;
    justify-content: center;
}

.items-center-vertical{
    display:flex;
    align-items: center;
}

.font-navbar{
    font-weight:bolder;
    font-size:20px;
}

.visible-mobile{
    display:block;
}
.font-72{ 
    font-size:72px;
}
.font-40{ 
    font-size:40px;
}
svg { 
    fill: red;
}
.filter-white{
    filter: invert(99%) sepia(99%) saturate(0%) hue-rotate(223deg) brightness(103%) contrast(100%);
}

@font-face {
    font-family: 'DoppioOne';
    src: url(../font/DoppioOne-Regular.ttf);
  }

  *{
    font-family:'DoppioOne';
  }

  .jumbotron{
      background-image:url('../img/bathroom2.jpg');
      height:300px;
      background-size:cover;
      background-position:bottom;
      margin-top:152px;
  }

  .jumbotron2{
      background-image:url('../img/bathroom1.jpg');
      height:300px;
      background-size:cover;
      background-position:bottom;
      margin-top:152px;
  }

  .hvr-underline-from-left {
display: inline-block;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
position: relative;
overflow: hidden;
}
.hvr-underline-from-left:before {
content: "";
position: absolute;
z-index: -1;
left: 0;
right: 100%;
bottom: 0;
background: black;
height: 4px;
-webkit-transition-property: right;
transition-property: right;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.hvr-underline-from-left:hover:before, .hvr-underline-from-left:focus:before, .hvr-underline-from-left:active:before {
right: 0;
}

footer{
background-color:#212121;
color:white;
padding:50px 0;
}

footer a:link, footer a:visited{
color:white;
}

.box-25{
    width:100%;
    transition:0.7s;
    height:500px;
    color:#fff;
}

.box-reference{
    width:100%;
    height:250px;
    border:1px solid gray;
}

.box-in-25{
    background-color:rgba(0,0,0,0.5);
    width:100%;
    height:100%;
    padding-top:100px;
}

.box-in-r{
    background-color:rgba(0,0,0,0.5);
    width:100%;
    height:100%;
    padding-top:100px;
    transition:ease-in-out 0.7s;
}

.box-in-r:hover{
    background-color:rgba(0,0,0,0.2);
    transition:ease-in-out 0.7s;
}

#box1{
    background-image:url('../img/bathroom1.jpg');
    background-size:cover;
}

#box2{
    background-image:url('../img/topeni.jpeg');
    background-size:cover;
}

#box3{
    background-image:url('../img/voda.jpg');
    background-size:cover;
}

#box4{
    background-image:url('../img/plyn.jpg');
    background-size:cover;
}

.rowmk{
    display:flex;
    flex-direction:column;
}
.mapa {
        width:100%; 
        height:100%;
    }

.logo{
    height:70px;
}

#logo{
    transition:0.7s;
}


@media (min-width: 992px){
    .navbar-expand-lg .navbar-nav {
        flex-direction: row;
        justify-content: center;
        }
    .navbar-expand-lg {
        flex-wrap: nowrap;
        justify-content: center!important;
        }

    .jumbotron{
        background-image:url('../img/bathroom2.jpg');
        height:550px;
        background-size:cover;
        background-position:bottom;
    }

    .jumbotron2{
        background-image:url('../img/bathroom1.jpg');
        height:550px;
        background-size:cover;
        background-position:bottom;
    }
    .facebook {
        background-image:url('../img/facebook.svg');
    }
    .mapa {
        width:100%; 
        height:400px;
    }
    
    .nav-item{
        margin-right:20px;
        margin-left:20px;
    }

    .keyword{
        width:600px;
        text-align:left;
        padding-left:80px;
        margin-top:350px;
        font-size:48px;
        display:none;
    }

    .box-reference{
    width:100%;
    height:500px;
    border:1px solid gray;
}

    .visible{
        display:block;
    }

    .visible-mobile{
        display:none;
    }

    .box-25{
        width:33%;
    }


    .rowmk{
        flex-direction:row;
    }

    .product-label{
        visibility:hidden;
        padding:20px;
        transition-property: visibility;
        transition-duration: 0s;
        transition-delay: 0s
    }

    .box-in-25:hover>.product-label{
        visibility:visible;
        transition:0.7s;
        transition-property: visibility;
        transition-duration: 0.7s;
        transition-delay: 0.6s
    }
    .mezera {
        height:170px;
        width:100%;
    }

    .logo{
        height:120px;
    }
}