/* pages/evo-icl-page.php's dedicated CSS. Dead-code audit (2026-09-08): this template
   has exactly 2 live rows (SK id 1996, CZ id 231813). Unlike some other pages in this
   project, this page's OWN "krokovac" 5-step animation (.kroky/.oko/.puzdro/.pocket/
   .rana-element/.multi-element/.waves-element/.skalpel-element/.drop-element) IS live -
   left fully untouched. But .row-after and .row-process have no matching <div> anywhere
   in this page's markup at all (confirmed via grep - not even a conditional gate hiding
   them), and .lentikula/.smile-element/.laser-element are leftover copy-paste from a
   DIFFERENT page's krokovac image set - this page's own <img> tags (evo-icl-page.php
   lines 123-131) use a different 5-image set entirely, none of which use those three
   classes (confirmed: .lentikula is referenced only in this page's own JS via
   $('.lentikula').hide(), which matches zero elements - a harmless no-op). Also removed:
   .img-responsive, #pocket .revolucna-novinka, and the whole .row-trash .anime/.trash/
   .close_top/.glasses/.open_top glasses-toggle animation (same "not used on this page"
   pattern as clear.php/psychologicka_pomoc.php). Cut this file from 1666 lines to well
   under 1400.

   Known pre-existing issue, NOT part of this cleanup (flagged for a future pass): this
   page's row-order/row-trash/cattegory sections still use BS3-syntax grid classes
   (col-sm-2/col-sm-6, not yet tier-shifted to col-md-*), unlike the row-anime section
   further down which already uses col-md-*/col/col-lg-* - this page was only partially
   migrated in an earlier session. */


	.mobil-navi ul {
		margin-top: 0px!important;
	}

	.posunto {
		padding-left: 60px;
	}

	#pocket .row-trash {
		background-color: #f3f1f0;
		padding: 60px 0px;
	}

	#pocket .row-banner {
		background-position: center top;
		background-size: cover;
		padding: 50px 0;
		color: var(--color-white);
        position: relative;
	}
	#pocket .row-order {
		background-image: url(/img/magic-pocket/azure.jpg);
		background-position: center top;
		background-size: cover;
		padding: 80px 0;
		color: var(--color-white);
		height: 305px;
	}

	#pocket .row-laser {
		background-image: url(/img/magic-pocket/ziemer-femto-ldv-z8-back.png);
		background-color: #f3f1f0;
		background-position: center top;
		background-size: cover;
		padding: 50px 0;
		color: var(--color-white);
		height: 570px;
	}

	#pocket .row-anime {
		background-image: url(/img/magic-pocket/iclinic-magic-pocket-oko-priebeh.png);
		background-position: center top;
		background-size: cover;
		height: 501px;
	}



	#pocket .row-banner h1 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-white);

		font-size: 56px;
	}
	#pocket .row-banner h2 {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-white);
		font-size: 20px;
	}
	#pocket .row-banner p {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-white);
		font-size: 18px;
		margin-top: 20px;
	}
	#pocket .row-banner .headline {
		max-width: 655px;
		padding: 30px 80px 40px 30px;
		background-color: rgba(29,96,113, 0.8);
		margin-top: 30px;
	}

	#pocket .row-trash h2 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-teal);
		font-size: 36px;

	}


#pocket .row-trash p {
    color: var(--color-text);
}

	#pocket .row-trash h3 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 30px;
	}

	#pocket .row-trash ul {
		margin-top: 10px;
	}


	#pocket .row-trash li {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		font-size: 16px;
		margin-top: 5px;
	}

	#pocket .row-trash .vyhody li {
		padding-left: 40px;
		background: url('/img/magic-pocket/check-icon.svg') no-repeat;
		background-size: 30px 30px;
		min-height: 30px;
	}

	#pocket .row-trash .vyhody li span {
		position:relative;
		top: 5px;
	}

	#pocket .row-trash .description ul li {
		background-image: url('/img/textLi.jpg');
		background-repeat: no-repeat;
		padding-left: 40px;
		margin-bottom: 10px;
	}

	#pocket .row-laser h3 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 20px;
	}

	#pocket .row-laser p {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		font-size: 16px;
		margin-top: 5px;
		max-width: 580px;
		width: auto;
	}


	#pocket .row-order .first-cena {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 10px;
	}

	#pocket .row-order .second-cena {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-teal);
		text-transform: uppercase;
		font-size: 56px;
	}

	#pocket .row-order .second-cena .sup{
		color: var(--color-teal);
		text-transform: initial;
		font-size: 28px;
		position: relative;
		top: -17px;
	}

	#pocket .row-order .third-cena {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 18px;
	}

	#pocket .row-order .text-right img {
		margin-right: 10px;
		margin-top: 8px;
	}

	#pocket .row-order .posun {
		margin-top: 20px;
	}

	#pocket .row-order .btn-order {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-white);
		text-transform: uppercase;
		font-size: 20px;
		background-color: var(--color-teal);
		padding: 15px 20px;
		display: -webkit-inline-box;
		cursor: pointer;
	}

	#pocket .row-order .btn-order i {
		margin-left: 20px;
	}

	#pocket .row-order .under-button {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		font-size: 16px;
		width: 60%;
		margin-top: 5px;
		text-align: center;
		display: -webkit-inline-box;
	}

	#pocket .row-anime h3 {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-teal);
		text-transform: uppercase;
		font-size: 36px;
	}
	#pocket .row-anime p {
		font-family: var(--font-primary);
		font-weight: 400;
		color: var(--color-text);
		font-size: 15px;
		margin-top: 5px;
		max-width: 580px;
		width: auto;
	}

	#pocket .row-anime .btn-order {
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-white);
		text-transform: uppercase;
		font-size: 16px;
		background-color: var(--color-teal);
		padding: 15px 20px;
		display: inline-block;
        margin-top:20px;

		cursor: pointer;
	}

	#pocket .row-anime .btn-order i {
		margin-left: 20px;
	}

	#pocket .row-anime .prava-strana {
		background-image: url('/img/magic-pocket/sh.png');

	}

	#pocket .row-anime .kroky {
		margin-top: 50px;
		background: url('/img/magic-pocket/kroky.jpg') repeat-y;
		background-position: 5px left;
	}

	#pocket .row-anime .kroky li{
		font-family: var(--font-primary);
		font-weight: 700;
		color: var(--color-text);
		text-transform: uppercase;
		font-size: 16px;
		margin-bottom: 30px;
		cursor: pointer;
		display: -moz-deck;
        list-style-position: inside;
	}

	#pocket .row-anime .kroky li .krok {
		font-family: var(--font-primary);
		font-weight: 700;
		color: #8e8e93;
		text-transform: uppercase;
		font-size: 36px;
		border: 2px solid #8e8e93;
		width: 60px;
		height: 60px;
		line-height: 60px;
		display: inline-grid;
		margin-right: 10px;
		background-color: var(--color-white);
	}

	#pocket .row-anime .kroky li .krok-title {
		top: -5px;
	}
	#pocket .row-anime .kroky li:last-child {
		margin-bottom: 0px;
	}
	#pocket .row-anime .kroky li.active .krok, .row-anime .kroky li:hover .krok {
		color: var(--color-white);
		border: 2px solid var(--color-teal);
		background-color: var(--color-teal);
	}

	#pocket .row-anime .kroky li.active .krok-title, .row-anime .kroky li:hover .krok-title {
		color: var(--color-teal);
	}@media (min-width: 1030px) AND (max-width: 1366px){

		#pocket .row-anime .kroky li .krok-title {
			position: relative;
			top: 2px;
			display: -webkit-inline-box;
			width: 170px;
		}

	}@media (min-width: 1020px) AND (max-width: 1200px){

		#pocket .row-anime .kroky li .krok-title {
			position: relative;
			top: 2px;
			display: -webkit-inline-box;
			width: 150px;
		}

	}@media (min-width: 569px) AND (max-width: 650px){

		#pocket .row-anime .kroky li .krok-title {
			position: relative;
			top: 2px;
			display: -webkit-inline-box;
			width: 150px;
		}

	}



	#pocket .row-anime .oko {
		margin-top: 120px;
		position: relative;
		max-width: 413px;
	}

	#pocket .row-anime .oko img {
		max-width: 413px;
        display:none;
	}

    #pocket .row-anime .oko .oko-element {
        display: inline;
        max-width: 413px;
    }
	#pocket .row-anime .puzdro {
		position: absolute;
		top: 98px;
		right: 171px;
		height: 40px;
		display: none;
	}

	#pocket .row-anime .pocket {
		position: absolute;
		display: none;
		top: 101px;
		right: -413px;
	}

	#pocket .row-anime .pocket-full {
		position: absolute;
		display: none;
		top: 101px;
		right: 181px;
	}@media (max-width: 768px){

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
		}
		.posunto {
			max-height: 180px;
		}

	}@media (max-width: 1024px){

		#pocket .row-banner .headline {
			max-width: 475px;
			padding: 70px 35px 70px 30px;
			background-color: rgba(29,96,113, 0.8);
			margin-top: 30px;

		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}

		#pocket .row-order .under-button {
			width: auto;
			margin-top: 15px;
			text-align: center;
			display: block;
		}

		#pocket .row-anime p {
			max-width: inherit;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .oko {
			text-align: center;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}


		#pocket .row-anime .anim-prava {
			width: 50%;
			float: right;
			margin-top: 40px;
		}

		#pocket .row-anime .anim-lava {
			width: 50%;
			float: left;
		}

		#pocket .row-anime .anim-celky {
			width: 100%;
		}

		#pocket .row-order .col-sm-6 {
			width: 100%;
		}

		#pocket .row-order .ceny {
			width: 50%;
			float: right;
			text-align: left;
		}

		#pocket .row-order .symbol-euro {
			width: 50%;
			float: left;
			display: inherit;
		}

	}@media (max-width: 960px){

		#pocket .row-banner .headline {
			max-width: 585px;
			padding: 70px 35px 70px 30px;
			background-color: rgba(29,96,113, 0.8);
			margin-top: 30px;

		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}

		#pocket .row-order .under-button {
			width: auto;
			margin-top: 15px;
			text-align: center;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-banner {
			background-position: 60% top;
		}

		#pocket .row-anime .oko {
			text-align: center;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}


		#pocket .row-anime .anim-prava {
			width: 50%;
			float: right;
			margin-top: 40px;
		}

		#pocket .row-anime .anim-lava {
			width: 50%;
			float: left;
		}

		#pocket .row-anime .anim-celky {
			width: 100%;
		}

		#pocket .row-order .col-sm-6 {
			width: 100%;
		}

		#pocket .row-order .ceny {
			width: 50%;
			float: right;
			text-align: left;
		}

		#pocket .row-order .symbol-euro {
			width: 50%;
			float: left;
			display: inherit;
		}

	}@media (max-width: 800px){

		#pocket .row-banner .headline {
			max-width: 475px;
			padding: 70px 35px 70px 30px;
			background-color: rgba(29,96,113, 0.8);
			margin-top: 30px;

		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}

		#pocket .row-order .under-button {
			width: auto;
			margin-top: 15px;
			text-align: center;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .oko {
			text-align: center;
			max-width: 274px;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}


		#pocket .row-anime .anim-prava {
			width: 50%;
			float: right;
			margin-top: 40px;
		}

		#pocket .row-anime .anim-lava {
			width: 50%;
			float: left;
		}

		#pocket .row-anime .anim-celky {
			width: 100%;
		}

		#pocket .row-order .col-sm-6 {
			width: 100%;
		}

		#pocket .row-order .ceny {
			width: 50%;
			float: right;
			text-align: left;
		}

		#pocket .row-order .symbol-euro {
			width: 50%;
			float: left;
			display: inherit;
		}

	}@media (max-width: 736px){
		#pocket .row-banner .headline {
			padding: 70px 30px 70px 30px;
		}

		#pocket .row-anime .anim-celky {
			width: inherit;
		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}

		#pocket .row-order .under-button {
			width: 80%;
			margin-top: 15px;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .oko {
			text-align: center;
			max-width: 274px;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}


		#pocket .row-anime .anim-prava {
			width: 50%;
			float: right;
			margin-top: 40px;
		}

		#pocket .row-anime .anim-lava {
			width: 50%;
			float: left;
		}

		#pocket .row-order .ceny {
			width: 50%;
			float: right;
			text-align: left;
		}

		#pocket .row-order .symbol-euro {
			width: 50%;
			float: left;
			display: inherit;
		}

	}@media (max-width: 667px){
		#pocket .row-banner .headline {
			padding: 70px 30px 70px 30px;
		}

		#pocket .row-banner h1 {
			font-size: 36px;
		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}

		#pocket .row-order .under-button {
			width: 80%;
			margin-top: 15px;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .oko {
			text-align: center;
			max-width: 274px;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}


		#pocket .row-anime .anim-prava {
			width: 50%;
			float: right;
			margin-top: 40px;
		}

		#pocket .row-anime .anim-lava {
			width: 50%;
			float: left;
		}

		#pocket .row-order .ceny {
			width: 50%;
			float: right;
			text-align: left;
		}

		#pocket .row-order .symbol-euro {
			width: 50%;
			float: left;
			display: inherit;
		}

	}@media (max-width: 568px){


		#pocket .row-anime .anim-prava {
			width: initial;
			float: initial;
			margin-top: initial;
		}

		#pocket .row-anime .anim-lava {
			width: initial;
			float: initial;
		}

		#pocket .row-banner .headline {
			padding: 70px 30px 70px 30px;
		}

		#pocket .row-banner h1 {
			font-size: 36px;
		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}

		#pocket .row-order .under-button {
			width: 80%;
			margin-top: 15px;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .oko {
			text-align: center;
			max-width: 274px;
			margin: 70px auto 30px auto;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}

		#pocket .row-order .ceny {
			width: 50%;
			float: right;
			text-align: left;
		}

		#pocket .row-order .symbol-euro {
			width: 50%;
			float: left;
			display: inherit;
		}
	}@media (max-width: 420px){
		#pocket .row-banner .headline {
			padding: 70px 30px 70px 30px;
		}

		#pocket .row-banner h1 {
			font-size: 36px;
		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}

		#pocket .row-order .under-button {
			width: 100%;
			margin-top: 15px;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .oko {
			text-align: center;
			max-width: 274px;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}

		#pocket .row-anime .anim-prava {
			width: initial;
			float: initial;
			margin-top: initial;
		}

		#pocket .row-anime .anim-lava {
			width: initial;
			float: initial;
		}
		#pocket .row-order .ceny {
			width: inherit;
			float: inherit;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			width: inherit;
			float: inherit;
			display: none;
		}


	}@media (max-width: 380px){
		#pocket .row-banner .headline {
			padding: 20px 30px 20px 20px;
			margin-top: 30px;
		}

		#pocket .row-banner {
			height: 370px;
		}

		#pocket .row-banner h1 {
			font-size: 36px;
		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}
		#pocket .row-order .btn-order, .row-anime .btn-order {
			font-size: 14px;
		}
		#pocket .row-order .under-button {
			width: 100%;
			margin-top: 15px;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .kroky li {
			font-size: 16px;
		}

		#pocket .row-anime .anim-prava {
			width: initial;
			float: initial;
			margin-top: initial;
		}

		#pocket .row-anime .anim-lava {
			width: initial;
			float: initial;
		}

		#pocket .row-anime .oko {
			text-align: center;
			max-width: 274px;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}


	}@media (max-width: 320px){
		#pocket .row-banner .headline {
			padding: 20px 30px 20px 20px;
			margin-top: 0px;
		}

		#pocket .row-banner {
			height: 370px;
		}

		#pocket .row-banner h1 {
			font-size: 36px;
		}

		#pocket .row-anime {
			height: auto;
		}
		#pocket .row-laser {
			height: auto;
		}
		#pocket .row-anime .prava-strana {
			background-image: none;
			padding: 40px 20px;
			text-align: center;
		}

		#pocket .row-order .symbol-euro {
			display: none;
		}

		#pocket .row-order .ceny {
			text-align: center;
		}

		#pocket .row-order {
			height: auto;
		}
		#pocket .row-order .btn-order, .row-anime .btn-order {
			font-size: 14px;
		}
		#pocket .row-order .under-button {
			width: 100%;
			margin-top: 15px;
		}

		#pocket .row-laser img {
			max-width: 100%;
		}

		#pocket .row-anime .kroky li {
			font-size: 16px;
		}

		#pocket .row-anime .anim-prava {
			width: initial;
			float: initial;
			margin-top: initial;
		}

		#pocket .row-anime .anim-lava {
			width: initial;
			float: initial;
		}

		#pocket .row-anime .oko {
			text-align: center;
			max-width: 274px;
		}
		#pocket .row-anime .oko .oko-element {
			width: 100%;
		}


	}


.row-trash .cattegory {
    display: flex;
    border: 2px solid #c1c3c2;
    padding: 12px;
    margin-bottom: 40px;
}

.row-trash .cattegory a {
    padding: 0 15px;
    border-right: 1px solid #eee;
    line-height: 20px;
    font-family: var(--font-primary);
    text-transform: uppercase;
    color: var(--color-text);
    font-size: 14px;
	font-weight: 700;
	display: inline-table;
}
.row-trash .cattegory a span{
   height: 60px;
}

.row-trash .cattegory a:last-child {
	border-right: none;
}

.row-trash .cattegory a.active {
    color: var(--color-teal);
    font-weight: 700
}

.row-trash .cattegory a:hover {
    color: var(--color-teal)
}

.row-trash .select {
    height: 103px;
    padding: 0 18px;
    border: 2px solid #c1c3c2;
	background: var(--color-white);
    width: 100%;
    font-family: var(--font-primary);
    font-size: 20px;
    color: var(--color-text);
	background-image: url(../img/relex-smile/select2.png) !important;
    background-position: right !important;
    background-repeat: no-repeat !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
	padding-right: 45px;
	padding-left: 20px;
}
.mobil-navi {
	margin-bottom: 30px;
	display: none;
}

.mobil-navi ul {
	border-left: 2px solid #c1c3c2;
	border-right: 2px solid #c1c3c2;
	border-bottom: 2px solid #c1c3c2;
    margin-top: 0px;
	position: absolute;
    top: 103px;
    width: calc(100% - 1px);
    background: var(--color-white);
    z-index: 100;
	display: none;
}
.mobil-navi ul li {
	padding: 10px 10px;
	margin: 0px;
}

.mobil-navi ul li:hover {
	background-color: #c1c3c2;
}

.navi-mobil {
	display: none;
}
.bok {
	border-right: 2px solid var(--color-teal);
}@media (max-width: 1024px){
	.row-trash .mobil-navi {
		display: block;
	}

	.row-trash .cattegory {
		display: none;
	}
	.navi-mobil {
		width: 100%;
		text-align: center;
		display: block;
		margin-bottom: 20px;
	}

	.bok {
		border: none;
	}
}
span.bigger{
    font-size:2em;
}
#background-video {
    background: #58606c;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
}
.row-banner-2nd{
    margin: 0px 0 40px;
}
.image-holder{
    text-align: center;
    margin-top: 100px;
}
.image-holder img{
    max-width: 100%;
}
li.krokovac{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
}
.row-implantovanych{
    padding:150px 0;
    background-color:#f3f1f0;
    background-position: center;
    background-size: cover;
}
.row-prekoho-promo{
    padding:150px 0;
    background-color:#f3f1f0;
    background-position: center;
    background-size: cover;
    color:white;
}
.row-prekoho-promo ul{
    list-style-type: disc;
    list-style-position: inside;
}
.row-tabulka{
    padding:60px 0 0;
    background-color:#f3f1f0;
}
.row-tabulka table.table td,
.row-tabulka table.table th
{
    padding: 15px 10px 15px 0;
    border-bottom: 1px solid lightgray;
    text-align: center;
}
.table.yesno{
    margin: 40px 0;
}

.row-tabulka table.table td:first-child{
    text-align: left;
    font-weight:600;
}
.row-tabulka table.table td:nth-child(2){
    padding-right: 30px;
    padding-left: 30px;
}
.yesno .fa-check{
    color: var(--color-teal);
}
.yesno .fa-times{
    color: #8e8e93;
}
.yesno th:nth-child(2),
.yesno td:nth-child(2)

{
    border-right: 1px solid lightgray;
}
.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.yesno th, .yesno td,
.row-tabulka h2,
.row-implantovanych h2,
.row-implantovanych div,
.row-banner-2nd p
{
    color:var(--color-text);
}

.drop-element {
    position: absolute;
    display: none;
    top: 0px;
    right: 182px;;
}
.skalpel-element {
    position: absolute;
    top: 120px;
    right: -480px;
    display: none;
}
.waves-element {
    position: absolute;
    top: 120px;
    right: -480px;
    display: none;
}
.rana-element {
    position: absolute;
    top: 130px;
    right: 190px;
    display: none;
}
.multi-element {
    position: absolute;
    top: 91px;
    right: -170px;
    display: none;
}
.anim-prava img{
    max-width: 100% !important;
}
.rightul li{
    background-image: url(../img/textLi.jpg);
    background-repeat: no-repeat;
    background-position: left 15%;
    padding-left: 15px !important;
    margin-bottom: 10px;
}
#pocket .row-trash-0{
    padding:60px 0px 0px !important;
}
#pocket .row-trash-0 .cattegory{
    margin-bottom:0px !important;
}

/* Bootstrap's reboot sets default margins on h1-h6/p/ul/ol/table, which beats the site's
   own global *{margin:0} reset (a type selector always outranks the universal selector)
   and leaks unwanted spacing into this page's raw CMS-authored content (var28/var31/var42/
   var61/var62 etc, rendered via html_entity_decode). Restore the zero-margin baseline these
   blocks had before Bootstrap was loaded globally. */
.row-banner h1, .row-banner h2, .row-banner h3, .row-banner h4, .row-banner h5, .row-banner h6, .row-banner p, .row-banner ul, .row-banner ol, .row-banner table,
.row-trash h1, .row-trash h2, .row-trash h3, .row-trash h4, .row-trash h5, .row-trash h6, .row-trash p, .row-trash ul, .row-trash ol, .row-trash table,
.row-anime h1, .row-anime h2, .row-anime h3, .row-anime h4, .row-anime h5, .row-anime h6, .row-anime p, .row-anime ul, .row-anime ol, .row-anime table,
.row-implantovanych h1, .row-implantovanych h2, .row-implantovanych h3, .row-implantovanych h4, .row-implantovanych h5, .row-implantovanych h6, .row-implantovanych p, .row-implantovanych ul, .row-implantovanych ol, .row-implantovanych table,
.row-prekoho-promo h1, .row-prekoho-promo h2, .row-prekoho-promo h3, .row-prekoho-promo h4, .row-prekoho-promo h5, .row-prekoho-promo h6, .row-prekoho-promo p, .row-prekoho-promo ul, .row-prekoho-promo ol, .row-prekoho-promo table,
.row-tabulka h1, .row-tabulka h2, .row-tabulka h3, .row-tabulka h4, .row-tabulka h5, .row-tabulka h6, .row-tabulka p, .row-tabulka ul, .row-tabulka ol, .row-tabulka table,
.row-order h1, .row-order h2, .row-order h3, .row-order h4, .row-order h5, .row-order h6, .row-order p, .row-order ul, .row-order ol, .row-order table {
    margin: 0;
}

/* Bootstrap also sets an explicit font-size/font-weight on h1-h6 (e.g. h2{font-size:2rem}),
   which production never had (headings there just render at the browser's native default
   size/weight, since the site's own CSS never touches heading font-size in this content).
   revert restores that native browser default instead of guessing at pixel values. */
.row-banner h1, .row-banner h2, .row-banner h3, .row-banner h4, .row-banner h5, .row-banner h6,
.row-trash h1, .row-trash h2, .row-trash h3, .row-trash h4, .row-trash h5, .row-trash h6,
.row-anime h1, .row-anime h2, .row-anime h3, .row-anime h4, .row-anime h5, .row-anime h6,
.row-implantovanych h1, .row-implantovanych h2, .row-implantovanych h3, .row-implantovanych h4, .row-implantovanych h5, .row-implantovanych h6,
.row-prekoho-promo h1, .row-prekoho-promo h2, .row-prekoho-promo h3, .row-prekoho-promo h4, .row-prekoho-promo h5, .row-prekoho-promo h6,
.row-tabulka h1, .row-tabulka h2, .row-tabulka h3, .row-tabulka h4, .row-tabulka h5, .row-tabulka h6,
.row-order h1, .row-order h2, .row-order h3, .row-order h4, .row-order h5, .row-order h6 {
    font-size: revert;
    font-weight: revert;
}

/* This page's comparison table has class="table" (Bootstrap's own component class) but was
   never styled by Bootstrap before — it relied on cellpadding/cellspacing HTML attributes for
   spacing instead. Bootstrap's .table adds a 1px border-top per cell that wasn't there before,
   adding up across every row. */
.row-tabulka table.table td, .row-tabulka table.table th {
    border-top: none;
}

/* Bootstrap's .table also forces border-collapse:collapse, which disables the table's own
   cellspacing="1" HTML attribute (only effective in separate-borders mode) — restoring the
   ~1px-per-row spacing production still has. */
.row-tabulka table.table {
    border-collapse: separate;
}

/* .z-index-2: no Bootstrap 4.6 z-index utility exists for this exact value. Used on the
   krokovac step-animation's right-side text (h3/p/a inside .posunto), which needs to stay
   above other absolutely-positioned decorative elements in .row-anime. */
.z-index-2 {
    z-index: 2;
}