.index_grid_holder { margin:0 auto; width:100%; display:block; margin-top:130px; max-width: 1850px; } .index_grid1 {width:65%; height:700px; float:left;    object-fit: cover;  } .index_grid2 {width:33%;  height:336px; float:left;  margin-bottom:28px;  margin-left:2%; object-fit: cover; overflow:hidden; border-radius:5px;  background-image: url("foto_slider/g2.jpg"); background-size:cover !important; background-repeat: no-repeat;  align-items: center;display: flex; justify-content: center; } .index_grid3 {width:33%;  height:336px; float:left;  margin-bottom:28px;  margin-left:2%; object-fit: cover; overflow:hidden;  border-radius:5px; background-image: url("foto_slider/g3.jpg"); background-size:cover !important; background-repeat: no-repeat;  align-items: center;display: flex; justify-content: center; } .gird-min-ztmaveni {width:100%; background:rgba(0,0,0,0.5);height:100%;align-items: center;display: flex; justify-content: center;}  .index_grid2 h2, .index_grid3 h2, .index_grid4 h2 {color:white; font-size:270%; text-align:center;   font-weight:600; line-height:1.1; margin:0; padding:10px;}    @media screen and (max-width:1700px) {  .index_grid1 {height:630px;} .index_grid2 {height:305px;  margin-bottom:20px; } .index_grid3 {height:305px;  margin-bottom:20px; } .index_grid4 { height:197px;  margin-bottom:20px; } .index_grid2 h2, .index_grid3 h2, .index_grid4 h2 { font-size:200%;} }   @media screen and (max-width:1000px) { .index_grid1 {width:100%; height:600px;} .index_grid2 {width:49%; margin-left:0; margin-top:30px; height:250px;  } .index_grid3 {width:49%;margin-top:30px; height:250px; } .index_grid4 {width:49%;margin: 0 auto; margin-top:30px; float: none;height:250px; }   }  @media screen and (max-width:600px) { .index_grid2 {width:100%; margin-left:0; margin-top:30px; } .index_grid3 {width:100%;margin-top:0px; margin-left:0; } .index_grid4 {width:100%;margin-top:30px; margin-left:0; }  .index_grid2, .index_grid3  {object-fit: contain; object-position:  center; width:100%; } .index_grid2 img, .index_grid3 img  {object-fit: contain; object-position:  center; width:100%; } }  .slider-obal { overflow-x: hidden; position: relative; height: 100%;  -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: all-scroll; margin-bottom:0; width:100%; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; max-width:2000px; border-radius:5px; } @media screen and (max-width:800px) { .slider-obal { height: 600px;} .index_grid1 {height:600px;} }  @media screen and (max-width:600px) { .slider-obal { height: 500px;} .index_grid1 {height:500px;} }  .slider { z-index: 1; position: relative; height: 100%;  }  .slider.animace { -webkit-transition: -webkit-transform 0.5s; transition: -webkit-transform 0.5s; transition: transform 0.5s; transition: transform 0.5s, -webkit-transform 0.5s; will-change: transform;  }  .slider.animace .slide-pozadi { -webkit-transition: -webkit-transform 0.5s; transition: -webkit-transform 0.5s; transition: transform 0.5s; transition: transform 0.5s, -webkit-transform 0.5s; will-change: transform;  }  .slide { position: absolute; top: 0; width: 100%; height: 100%; overflow: hidden;  }  .slide-pozadi { position: absolute; top: 0; left: -50%; width: 100%; height: 100%; background-size: cover !important; will-change: transform;  }  .slide:nth-child(1) {left: 0; } .slide:nth-child(1) .slide-pozadi { left: 0; background-image: url("foto_slider/1.jpg"); background-size: 100%; animation-name: shrink; animation-duration: 3s; animation-delay: 0s; background-position: 60% 50%; }  .slide:nth-child(2) {left: 100%; } .slide:nth-child(2) .slide-pozadi { left: -50%; background-image: url("foto_slider/2.jpg"); background-size: 100%; animation-name: shrink; animation-duration: 3s; animation-delay: 5s; background-position: 30% 50%; }  .slide:nth-child(3) {left: 200%;} .slide:nth-child(3) .slide-pozadi { left: -100%; background-image: url("foto_slider/3.jpg"); background-size: 100%; animation-name: shrink; animation-duration: 3s; animation-delay: 10s; background-position: 30% 50%; }  .slide:nth-child(4) {left: 300%;} .slide:nth-child(4) .slide-pozadi { left: -150%; background-image: url("foto_slider/4.jpg"); background-size: 100%; animation-name: shrink; animation-duration: 3s; animation-delay: 15s; }  .slide:nth-child(5) {left: 400%;} .slide:nth-child(5) .slide-pozadi { left: -200%; background-image: url("foto_slider/5.jpg"); background-size: 100%; animation-name: shrink; animation-duration: 3s; animation-delay: 20s; }  .slide-obsah { position: absolute; margin: 0 auto; text-align:center; width:70%; padding:2%; margin-top:200px; max-width: 650px; height: auto; background-color:rgba(0, 0, 0, 0.7); border-radius: 0 5px 5px 0; }  @media screen and (max-width:800px) { .slide-obsah { width:85%;   margin-top:100px;} }  .slide-obsah h1 { text-align:left; font-size:320%; color:white; padding:5px; font-weight:600; font-family: 'Nata Sans', sans-serif; margin-top:20px; line-height:1.3; margin-bottom:15px; }  .slide-obsah h2 { text-align:left; font-size:170%; color:white; padding:5px; font-weight:500; font-family: 'Nata Sans', sans-serif; margin-top:20px; line-height:1.3; margin-top:0; }   .slide-nadpis {padding-left:2%;padding-right:2%;}  .slider-strankovani { position: absolute; z-index: 3; bottom: 2rem; font-size: 0; list-style-type: none;  margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; }  .slider-strankovani_element { position: relative; display: inline-block; vertical-align: top; width: 1.5rem; height: 1.5rem; margin: 0 0.5rem; border-radius: 50%; border: 2px solid #fff; cursor: pointer; box-sizing: border-box; padding: 0; }  .slider-strankovani_element:before { content: ""; position: absolute; left: 50%; top: 50%; width: 0.8rem; height: 0.8rem; background: #fff; border-radius: 50%; -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); box-sizing: border-box; margin: 0; padding: 0; }  .slider-strankovani_element.active:before, .slider-strankovani_element:hover:before { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); box-sizing: border-box; margin: 0; padding: 0; }   .tlacitko_slider { width:170px; background:#db2227; color:white; font-size:120%; text-align:center; padding:10px; display: inline-block; margin:0 auto; margin-top:10px; margin-bottom:20px; margin-right:10px; margin-left:10px; transition: all 0.7s ease; border-radius:5px; border:0px; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; float:left;} .tlacitko_slider:hover {  transform:  scale(1.1); }  @media (max-width: 1800px) { .slide:nth-child(1)   .slide-pozadi  { background-size: cover; animation-name:none; } .slide:nth-child(2)   .slide-pozadi  { background-size: cover; animation-name:none; } .slide:nth-child(3)   .slide-pozadi  { background-size: cover; animation-name:none; } .slide:nth-child(4)   .slide-pozadi  { background-size: cover; animation-name:none; }  .slide:nth-child(5)   .slide-pozadi  { background-size: cover; animation-name:none; }   }  @media screen and (max-width: 1700px) {  .slide-obsah h1 { font-size:300%; line-height:1;} .slide-obsah h2 { font-size:180%;} }   @media screen and (max-width:1350px) {  .slide-obsah h1 {font-size:250%;} .slide-obsah h2 { font-size:160%; }  @media screen and (max-width:700px) {  .slide-obsah h1 { font-size:220%;} .slide-obsah h2 { font-size:150%; font-weight:400;}; }   @media screen and (max-width:450px) {  .slide-obsah h1 { font-size:200%;} .slide-obsah h2 { font-size:130%; font-weight:400;}; }    @keyframes shrink { 0% { background-size: 115%; } 100% { background-size: 100%; } }   @keyframes shrink2 { 0% { background-size: 120%; } 100% { background-size: 100%; }  @keyframes shrink3 { 0% { background-size: 120%; } 100% { background-size: 100%; }  @keyframes shrink4 { 0% { background-size: 120%; } 100% { background-size: 100%; } }