@media only screen and (max-width: 600px) {
.navbar-custom .navbar-collapse {
 
    background-color: #224998;
    border-radius: 10px;
}
}

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

.kontakt {
    display: none;
}
}


@media (min-width: 1600px)  {
.navbar-custom.top-nav-collapse {
    padding-right: 10rem;
    padding-left: 10rem;
}
}

@media (min-width: 1700px)  {
.navbar-custom.top-nav-collapse {
    padding-right: 12rem;
    padding-left: 12rem;
}
}


.navbar .navbar-brand.logo-image img {
    width: 15rem;
    height: 5rem;
    transition: 0.2s;
    -webkit-backface-visibility: hidden;
}


  .navbar-custom .nav-item .nav-link, .navbar-custom .nav-item .nav-link {
    
    /* font-weight: 100; */
    text-decoration: none;
    text-decoration-color: #ea5e6b00;
    color: #ffffff;
    text-decoration-thickness: 4px;
}


 .navbar-custom .nav-item .nav-link:hover, .navbar-custom .nav-item .nav-link.active {
    
    /* font-weight: 100; */
    text-decoration: underline;
        transition: 1s ease;
    text-decoration-color: #ea5e6b;
    color: #ffffff;
    text-decoration-opacity: 0;
    text-decoration-thickness: 4px;
}




.navbar-custom.top-nav-collapse .navbar-brand.logo-image img {
    width: 10rem;
    height: 3rem;
    transition: 0.2s;
    -webkit-backface-visibility: hidden;
}



.navbar-custom .fa-stack .hexagon {
    width: 1.625rem;
    height: 1.625rem;
    position: absolute;
    background: none;
    background-size: 1.625rem 1.625rem;
    transition: all 0.2s ease;
    background-color: #ea5e6b;
    border-radius: 5px;
}

	.navbar-custom .fa-stack:hover .hexagon {
		background: none;
		background-size: 1.625rem 1.625rem;
        background-color: #fff;
	}
    
    .navbar-custom .fa-stack:hover .fa-stack-1x {
		color: #ea5e6b;
	}
    
    .navbar-custom.top-nav-collapse {
    
    background-color: #224998;
}

.navbar-custom.top-nav-collapse .nav-item .nav-link:hover, .navbar-custom.top-nav-collapse .nav-item .nav-link.active {
    color: #ffffff;
}


.navbar-dark .navbar-nav .nav-link.disabled {
    color: rgb(255 255 255 / 74%);
}


.navbar-custom .fa-stack {
    margin-left: 0.1rem;
    font-size: 0.8125rem;
}

.navbar-custom {
    background-color: #11344800;
}


.btn-solid-lg {
    
    border: 0.125rem solid #ea5e6b;
    
    background-color: #ea5e6b;
    color: #fff;
    margin: 10px;
    
}


.btn-solid-lg:hover {
	background-color: transparent;
	color: #ea5e6b;
	text-decoration: none;
    
}


.section-bg {
    background: url(https://loutky.umeleckavyroba.cz/images/parallax/katalog-loutky.jpg) 50% no-repeat fixed;
    padding: 140px 0 0;

    position: relative;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover!important;
    -moz-background-size: cover!important;
    -o-background-size: cover!important;
    background-size: cover!important;
    text-align: center;
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
}


a.btn.btn-primary.btn-sm.btn-loutky {
    text-decoration: 0;
    background-color: #ea5e6b;
    border-color: #ea5e6b;
    padding: 5px 15px 5px 15px;
    font-weight: 800;
}

a.btn.btn-primary.btn-sm.btn-loutky:hover {
    text-decoration: 0;
    background-color: transparent;
    border-color: #ea5e6b;
    padding: 5px 15px 5px 15px;
    color: #ea5e6b;
    font-weight: 800;
}


a.white {
    text-decoration: none;
}

a.white:hover {
    font-weight: 600;
}



a.back-to-top {
    position: fixed;
    z-index: 999;
    right: 0.75rem;
    bottom: 0.75rem;
    display: none;
    width: 2.625rem;
    height: 2.625rem;
    border-radius: 1.875rem;
    background: #ea5e6b url(../images/up-arrow.png) no-repeat center 47%;
    background-size: 1.125rem 1.125rem;
    text-indent: -9999px;
}


.filter .button-group a.button.is-checked {
    background-color: #ea5e6b;
    color: #fff;
}


ul.list-unstyled.li-space-lg i.fab {
    color: white;
}


.pruh {
    background: url(../images/barevny-pruh.jpg) 50% repeat;
    padding: 10px 0 0;

    position: relative;
    overflow: hidden;
    
    background-position: center center;
    -webkit-background-size: cover!important;
    -moz-background-size: cover!important;
    -o-background-size: cover!important;
    background-size: cover!important;
    text-align: center;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}


.footer {
    padding-top: 5rem;
    background-color: #224998;
}

.copyright {
    
    background-color: #224998;
}

.btn-solid-reg {
    display: inline-block;
    padding: 1.1875rem 0.875rem 1.1875rem 0.875rem;
    border: 0.125rem solid #ea5e6b;
    border-radius: 0.25rem;
    background-color: #ea5e6b;
    color: #fff;
    font: 700 0.75rem/0 "Montserrat", sans-serif;
    text-decoration: none;
    transition: all 0.2s;
}


.btn-solid-reg:hover {
    
    color: #ea5e6b;
    
}





.slider .card-image {
    width: 15rem;
    height: 15rem;

    border-radius: 5%;
}

.spinner-wrapper {
    
    background: #ea5e6b;
}


.filter .button-group a:hover {
    background-color: #ea5e6b;
    color: #fff;
}



@media (min-width: 1400px)  {
.navbar-custom .social-icons {
    display: block;
    margin-left: 0.5rem;
}
}

@media (max-width: 1400px)  {
.navbar-custom .social-icons {
    display: none;
    margin-left: 0.5rem;
}
}

.navbar-custom .dropdown-item:hover .item-text {
    color: #18a5df;
}


.header.loutky {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.5)), url(../images/loutky-vyroba.jpg) center center no-repeat;
    background-size: cover;
}


.header.drevene-stavebnice {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.5)), url(../images/drevene-stavebnice/drevene-stavebnice-web.mp4) center center no-repeat;
    background-size: cover;
}

.header.hracky {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.5)), url(../images/drevene-hracky/drevene-hracky-bg.jpg) center center no-repeat;
    background-size: cover;
}

.header.vyrobce {
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.5)), url(../images/vyrobce-drevenych-hracek.jpg) center center no-repeat;
    background-size: cover;
}


#myVideo {
  position: fixed;
  z-index: -1;
  right: 0;
  bottom: 0;
  min-width: 100%;
  
}


header video {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: auto;
  z-index: -1;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}


 header {
  position: relative;
  background-color: black;
  height: 95vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

header video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

header .container {
  position: relative;
  z-index: 2;
}

header .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0.5;
  z-index: 1;
}

@media (pointer: coarse) and (hover: none) {
  
  header video {
    display: none;
  }
}



.basic-1 .list-unstyled {
	margin-bottom: 1.5rem;
}

.basic-1 .list-unstyled .fas {
	color: #14bf98;
	font-size: 0.5rem;
	line-height: 1.375rem;
}

.basic-1 .list-unstyled .media-body {
	margin-left: 0.625rem;
}

.basic-1 .image-container {
    overflow: hidden;
    border-radius: 0.45rem;
    margin-top: 20px;
    margin-bottom: 40px;
}