body{
    background-image: url(../images/bg.jpg);
    background-position: top;
    background-repeat: repeat-x;
}

body:after{
    content: url(../images/okoli/skiing-active.png) url(p../images/okoli/skating-active.png) url(../images/okoli/swimming-active.png) url(../images/okoli/walking-active.png) url(../images/okoli/tennis-active.png);
    display:none;
}

a.nh{
    width:100%;
    color:inherit!important;
    display:block;
}

h1{
    margin-bottom:50px;
}

h2{

}

h2 span{
    font-size:15px;
    display:block;
}

.main-menu.sticky.is-anchored .top-bar .top-bar-right .menu>li>a:hover {
    text-decoration:underline;
    color:#FFFFFF;
}

.main-menu.sticky.is-anchored .top-bar .top-bar-right .menu>li.page.active>a {
    text-decoration:underline!important;
    color:#FFFFFF;
}

#book{
    width:80%;
    margin:0 auto;
    padding-top:250px;
    padding-bottom:200px;
    display:block;
}

#previo-booking-iframe{
    width:100%;
}

.gallery{
    width:100%;
    margin:0 auto;
    padding-bottom:100px;
}

.gallery ul{
    width:100%;
    margin:0;
    list-style:none;
    text-align:left;
    font-size:0;
    display:block;
}

.gallery li{
    width:25%;
    height:270px;
    overflow:hidden;
    float:left;
}

.gallery li a img{
    width:100%;
    display:block;

    transition: all .5s ease;
}

.gallery li a:hover img{
    width:120%!important;
    max-width:120%!important;
    margin-top:-10%;
    margin-left:-10%;
}

/*
.gallery ul{
    list-style:none;
    text-align:left;
    font-size:0;
    display:table;
}

.gallery li{
    width:25%;
    height:100%;
    font-size:0;
    overflow:hidden;
    display:inline-table;
}

.gallery li span{
    width:100%;
    height:250px;
    overflow:hidden;
    display:block;
}

.gallery li a{
    width:100%;
    display:block;

    transition: all .5s ease;
}

.gallery li a:hover{
    width:120%!important;
    margin-top:-10%;
    margin-left:-10%;
}

.gallery li a img{
    width:100%;
    display:block;
}
*/

#video{
    margin-bottom:100px;
}

.video{
    width:50%;
    padding-bottom:5%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    float:left;
}

.video.left{
    padding-right:2.5%;
}

.video.right{
    padding-left:2.5%;
}

.video span{
    position:relative;
	padding-bottom:56.25%;
	padding-top:25px;
	height:0;
    display:block;
}

.video span iframe{
    position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.table{
    width:60%;
    margin:0 auto;
    padding-bottom:100px;
}

.table tr{
    background-color:transparent!important;

}

.table td{
    border-bottom:1px solid #f1f1f1;
}

.table td:first-child{
    color:#40aa95;
}

.submenu{
    position:relative;
    width:80%;
    margin:0 auto;
    margin-bottom:50px;
    z-index:100;
}

.submenu ul{
    list-style:none;
}

.submenu li{
    width:20%;
    float:left;
}

.submenu li a{
    background-position: top;
    background-repeat: no-repeat;
    background-size:100px;
    padding-top:80px;
    cursor: pointer;
    display:block;
}

.submenu li.active a{
    color:#000000;

    transition: all .5s ease;
}

.submenu li#lyzovani a{
    background-image: url(../images/okoli/skiing.png);
}

.submenu li.active#lyzovani a, .submenu li#lyzovani a:hover{
    background-image: url(../images/okoli/skiing-active.png);
}

.submenu li#brusleni a{
    background-image: url(../images/okoli/skating.png);
}

.submenu li.active#brusleni a, .submenu li#brusleni a:hover{
    background-image: url(../images/okoli/skating-active.png);
}

.submenu li#plavani a{
    background-image: url(../images/okoli/swimming.png);
}

.submenu li.active#plavani a, .submenu li#plavani a:hover{
    background-image: url(../images/okoli/swimming-active.png);
}

.submenu li#turistika a{
    background-image: url(../images/okoli/walking.png);
}

.submenu li.active#turistika a, .submenu li#turistika a:hover{
    background-image: url(../images/okoli/walking-active.png);
}

.submenu li#ostatni a{
    background-image: url(../images/okoli/tennis.png);
}

.submenu li.active#ostatni a, .submenu li#ostatni a:hover{
    background-image: url(../images/okoli/tennis-active.png);
}

.okoli{

}

.okoli > div{
    display:none;
}

.okoli > div.active{
    display:block;
}

.block{
    width:33.3%;
    padding:0 15px 0 15px;
    text-align:left;
    float:left;
}

.mybadge:hover .inner {
    background-color:#40aa95;
    background-image:none;
}

.text-canter strong{
    font-weight:bold;
}

.clear{
    clear:both;
}

@media screen and (max-width: 110em) {
    .gallery li{
        height:200px;

    }
}

@media screen and (max-width: 100em) {
    .gallery li{
        height:180px;

    }
}

@media screen and (max-width: 90em) {
    .gallery li{
        height:160px;

    }
}

@media screen and (max-width: 80em) {
    #book{
        width:90%;
    }

    .gallery li{
        width:33.3%;
        height:220px;

    }

    .submenu{
        width:90%;
    }
}

@media screen and (max-width: 72em) {
    .gallery li{
        height:195px;
    }
}

@media screen and (max-width: 64em) {
    body{
        background-image: url(../images/bg2.jpg);
    }

    #book{
        width:98%;
        padding-top:120px;
        padding-bottom:80px;
    }

    .gallery li{
        width:50%;
        height:250px;
    }

    #video{
        margin-bottom:0;
    }

    .video{
        width:100%;
        margin-bottom:50px;
        float:left;
    }

    .video.left{
        padding-right:0;
    }

    .video.right{
        padding-left:0;
    }

    .block{
        width:50%;
    }

    .submenu{
        width:100%;
    }

    .section-three .reservation{
            margin:0 auto -4rem auto;
    }
}

@media screen and (max-width: 50em) {
    .gallery li{
        height:200px;
    }
}

@media screen and (max-width: 47em) {
    body{
        background-image: none;
    }

    #book{
        padding-top:60px;
    }

    .gallery li{
        height:190px;
    }


}

@media screen and (max-width: 40em) {
    .gallery li{
        width:100%;
        height:auto;
    }

    .block{
        width:100%;
    }
}