/* Extracted from pages/operation.php's inline <style> block during the Bootstrap
   migration. Redundant duplicates removed: #pocket .container (matches the shared
   css/theme.css rule exactly) and .row-trash table* (no <table> ever appears under
   .row-trash on this page - confirmed via HTML cross-reference, matching the same
   dead pattern already found on operacie-oci-page.css/laserova-new.css). Bootstrap-
   utility splits applied to .stroj/.posunto/.mobil-navi/.select/.cattegory/
   .first-cena/.second-cena/.third-cena/.row-laser table (established pattern from
   prior relex-smile-family pages); .row-order .text-right deleted as fully redundant
   with Bootstrap's own .text-right, already present in the HTML.

   Also removed entirely (2026-09-08): .row-video, .row-process, and the whole
   .row-anime/"krokovac" 5-step animation cluster (.kroky/.oko/.puzdro/.pocket/
   .smile-list/.drop-element/.lentikula/.smile-element/.laser-element/.anim-lava/
   .anim-prava/.anim-celky/.prava-strana), including every one of their breakpoint
   overrides scattered across this file's ~8 media queries. Initially assumed live
   (this page's own PHP conditionally renders them on page_info[var18]/[var16]/
   [var50]), but confirmed via direct DB query that this template has exactly 2 live
   rows (id 2015 SK, id 2025 CZ) and BOTH have var16/var18/var50 empty - so none of
   this ever renders on any live instance of this page. A couple of harmless
   mixed-selector remnants (comma-joined with a still-live selector, e.g.
   ".row-order .btn-order, .row-anime .btn-order") were left alone rather than risk
   breaking the live half of the rule for a few bytes of dead weight. */

	.row-banner {

	}

	.description {
		color: #5e5e5e;
	}

	.akciova, .akciova:hover {
		display: inline-block;
		text-align: left;
		height: 50px;
		line-height: 50px;
		padding: 0 20px;
		margin-top: 15px;
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		text-transform: uppercase;
		color: #36c2b2;
		background-image: url(../img/nbtn.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		cursor: pointer;
	}

	.posunto {
		padding-left: 60px;
	}

	.row-order .stara-cena {
		font-size: 18px!important;
		color: #5e5e5e;
		text-decoration: line-through;
		font-weight: normal;
		position: relative;
		top: -40px;
		left: -15px;
	}

	.img-responsive {
		max-width: 100%;
	}@media (max-width: 768px){
		.posunto {
			max-height: 180px;
		}
	}

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

	.revolucna-novinka {
		position: relative;
		right: 0px;
		top: 0px;
	}

	.vyhody-pravo {
		margin-top: 20px;
	}

	.vyhody-pravo li {
		background-image: url(../img/textLi.jpg);
		background-repeat: no-repeat;
		background-position: left 50%;
		padding-left: 21px;
		margin-bottom: 10px;
	}

	.vyhody-vpravo li {
		background-image: url(../img/textLi.jpg);
		background-repeat: no-repeat;
		background-position: left 50%;
		padding-left: 21px;
		margin-bottom: 10px;
	}

	.row-banner {
		background-position: center top;
		background-size: cover;
		padding: 50px 0;
		color: #fff;
		height: 470px;
	}

	.row-after {
		background-image: url(/img/relex-smile/iclinic-pooperacii.jpg);
		background-position: center top;
		background-size: cover;
		padding: 90px 0;
		color: #fff;
		height: 488px;
	}

	.row-akcia {
		background: url(/img/relex-smile/bg-akcia.png) repeat-x;
		color: #fff;
		height: 90px;
		line-height: 90px;
	}
	.row-order {
		background-image: url(/img/magic-pocket/azure.jpg);
		background-position: center top;
		background-size: cover;
		padding: 80px 0;
		color: #fff;
		height: 305px;
	}

	.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: #fff;
		height: 570px;
	}

	.row-banner h1 {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #fff;
		font-size: 56px;
	}
	.row-banner h2 {
		font-family: 'Open Sans',sans-serif;
		font-weight: 400;
		color: #fff;
		font-size: 20px;
	}
	.row-banner p {
		font-family: 'Open Sans',sans-serif;
		font-weight: 400;
		color: #fff;
		font-size: 18px;
		margin-top: 20px;
	}
	.row-banner .headline {
		max-width: 655px;
		padding: 60px 80px 70px 30px;
		background-color: rgba(29,96,113, 0.8);
		margin-top: 30px;
	}

	.row-trash h2 {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #29c3b1;
		font-size: 36px;

	}
	.row-trash h3 {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #5e5e5e;
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 30px;
	}

	.row-trash ul {
		margin-top: 20px;
	}

	.row-trash li {
		font-family: 'Open Sans',sans-serif;
		font-weight: 400;
		color: #5e5e5e;
		font-size: 16px;
		margin-top: 5px;
	}

	.row-trash .vyhody li {
		padding-left: 40px;
		background: url('/img/magic-pocket/check-icon.svg') no-repeat;
		background-size: 30px 30px;
		min-height: 30px;
		margin-bottom: 10px;
	}
	.row-trash .vyhody li span {
		position:relative;
		top: 5px;
	}

	.row-trash .anime {
		min-height: 360px;
	}

	.akciova {
		color: #fff!important;
	}

	.row-after h3 {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #5e5e5e;
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 20px;
	}

	.row-after p {
		font-family: 'Open Sans',sans-serif;
		font-weight: 400;
		color: #5e5e5e;
		font-size: 16px;
		margin-top: 15px;
		max-width: 480px;
		width: auto;
	}

	.row-laser h3 {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #5e5e5e;
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 20px;
	}

	.row-laser p {
		font-family: 'Open Sans',sans-serif;
		font-weight: 400;
		color: #5e5e5e;
		font-size: 16px;
		margin-top: 5px;
		max-width: 480px;
		width: auto;
	}

	.row-laser table {
		margin-top: 60px;
		margin-bottom: 40px;
	}

	.row-laser table td.lave{
		text-align: left;
		height: 120px;
	}
	.row-laser table td.prave{
		text-align: right;
	}

	.row-order .first-cena {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #5e5e5e;
		text-transform: uppercase;
		font-size: 20px;
		margin-top: 10px;
	}
	.row-order .second-cena {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #36c2b2;
		text-transform: uppercase;
		font-size: 56px;
	}

	.row-order .second-cena .sup{
		color: #36c2b2;
		text-transform: uppercase;
		font-size: 28px;
		position: relative;
		top: -17px;
	}

	.row-order .third-cena {
		font-family: 'Open Sans',sans-serif;
		font-weight: 400;
		color: #5e5e5e;
		text-transform: uppercase;
		font-size: 18px;
	}

	.row-order .text-right img {
		margin-right: 10px;
		margin-top: 8px;
	}
	.row-order .posun {
		margin-top: 20px;
	}
	.row-order .btn-order {
		font-family: 'Open Sans',sans-serif;
		font-weight: 700;
		color: #FFF;
		text-transform: uppercase;
		font-size: 20px;
		background-color: #36c2b2;
		padding: 15px 20px;
		display: -webkit-inline-box;
		cursor: pointer;
	}

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

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

	.row-order .under-button {
		font-family: 'Open Sans',sans-serif;
		font-weight: 400;
		color: #5e5e5e;
		font-size: 16px;
		width: 60%;
		margin-top: 5px;
		text-align: center;
		display: -webkit-inline-box;
	}@media (min-width: 1030px) AND (max-width: 1366px){

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

	}


	.row-trash .anime img {
		position: absolute;
	}
	.row-trash .trash {
		left: 100px;
		top: 205px;
	}

	.row-trash .close_top {
		display: none;
		left: 100px;
		top: 0;
	}
	.row-trash .glasses	{
		top: 0px;
		left: 156px;
	}
	.row-trash .open_top {
		top: 64px;
		left: 260px;
		-webkit-transition: all .85s ease-in-out;
		-moz-transition: all .85s ease-in-out;
		-ms-transition: all .85s ease-in-out;
		-o-transition: all .85s ease-in-out;
		transition: all .85s ease-in-out;
	}

	.row-trash .open_top.plus {
		-ms-transform: rotate(132deg);
		-webkit-transform: rotate(-132deg);
		transform: rotate(-132deg);
		top: 166px;
		left: 220px;
		transform-origin: 0;
		-webkit-transform-origin: 0;
		-ms-transform-origin: 0;
	}@media (max-width: 768px){

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

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

		}
		.row-laser {
			height: auto;
		}

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

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

		.row-order {
			height: auto;
		}

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

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

		.row-laser table {
			margin-top: 20px;
		}

		.row-after p {
			max-width: 70%;
		}

		.row-order .col-md-6 {
			width: 100%;
		}

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

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

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

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

		}
		.row-laser {
			height: auto;
		}

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

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

		.row-order {
			height: auto;
		}

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

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

		.row-laser table {
			margin-top: 20px;
		}

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

		.row-after p {
			max-width: 50%;
		}

		.row-order .col-md-6 {
			width: 100%;
		}

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

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

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

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

		}

		.posunto {
			padding-left: 0px;
		}
		.row-laser {
			height: auto;
		}

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

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

		.row-order {
			height: auto;
		}

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

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

		.row-laser table {
			margin-top: 20px;
		}

		.row-after p {
			max-width: 70%;
		}

		.row-order .col-md-6 {
			width: 100%;
		}

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

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

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

		.row-trash .posunut {
			margin-top: 120px;
		}

		.row-trash .revolucna-novinka {
			top: -90px;
			display: none;
		}
		.row-laser {
			height: auto;
		}

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

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

		.row-order {
			height: auto;
		}

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

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

		.row-laser table {
			margin-top: 20px;
		}

		.row-after p {
			max-width: 70%;
		}

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

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

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

		.row-banner h1 {
			font-size: 36px;
		}
		.row-laser {
			height: auto;
		}

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

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

		.row-order {
			height: auto;
		}

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

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

		.row-laser table {
			margin-top: 20px;
		}

		.row-after p {
			max-width: 70%;
		}

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

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

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


		.row-trash h2 {
			font-size: 26px;
		}

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

		.row-banner h1 {
			font-size: 36px;
		}
		.row-laser {
			height: auto;
		}

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

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

		.row-order {
			height: auto;
		}

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

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

		.row-laser table {
			margin-top: 20px;
		}

		.row-after p {
			max-width: 80%;
		}

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

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

		.row-banner h1 {
			font-size: 36px;
		}
		.row-laser {
			height: auto;
		}

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

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

		.row-order {
			height: auto;
		}

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

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

		.row-laser table td{
			width: 100%;
			clear: both;
			display: block;
			text-align: center;
			height: auto;
		}

		.row-laser table td.lave {
			text-align: center;
		}
		.row-laser table td.prave {
			text-align: center;
		}
		.row-order .ceny {
			width: inherit;
			float: inherit;
			text-align: center;
		}

		.row-order .symbol-euro {
			width: inherit;
			float: inherit;
			display: none;
		}
		.row-after {
			background-position: 53% top;
		}


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

		.row-banner {
			height: 370px;
		}

		.row-banner {
			height: 370px;
		}

		.row-banner h1 {
			font-size: 36px;
		}
		.row-laser {
			height: auto;
		}

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

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

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

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

		.row-laser table td{
			width: 100%;
			clear: both;
			display: block;
			text-align: center;
			height: auto;
		}

		.row-laser table td.lave {
			text-align: center;
		}
		.row-laser table td.prave {
			text-align: center;
		}


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

		.row-banner {
			height: 370px;
		}

		.row-banner h1 {
			font-size: 30px;
		}
		.row-laser {
			height: auto;
		}

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

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

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

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

		.row-laser table td{
			width: 100%;
			clear: both;
			display: block;
			text-align: center;
			height: auto;
		}

		.row-laser table td.lave {
			text-align: center;
		}
		.row-laser table td.prave {
			text-align: center;
		}


	}

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

/* Previously had class="col-sm-2" (tier-shifted from bootstrap's own real column class would
   have been "col-md-2") - removed and replaced with an explicit flex-basis here instead.
   Bootstrap's real .col-md-2 sets flex:0 0 16.666667% (flex-shrink:0, can't shrink), which
   matches production's likely INTENT for exactly 6 categories (100% total, no shrink needed)
   but this page's own menu has 7 categories - production's old float-based grid.css .col-sm-2
   (no explicit flex-shrink) happens to shrink via the flex-item "auto basis from width" rule
   once wrapped in this .cattegory{display:flex} container, letting all 7 fit on one line.
   Bootstrap's rigid col-md-2 doesn't shrink, causing the 7th item to overflow ~185px past the
   container edge - found via bounding-box comparison against production, 2026-09-08. flex:1 1
   16.6667% (shrink:1, the default) reproduces the same shrink-to-fit behavior regardless of
   how many categories a given page's menu happens to have. */
.row-trash .cattegory a {
    flex: 1 1 16.6667%;
    padding: 0 15px;
    border-right: 1px solid #eee;
    line-height: 20px;
    font-family: 'Open Sans',sans-serif;
    color: #5e5e5e;
    font-size: 14px;
    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: #36c2b2;
    font-weight: 700
}

.row-trash .cattegory a:hover {
    color: #36c2b2
}

.row-trash .select {
    height: 103px;
    padding: 0 18px;
    border: 2px solid #c1c3c2;
	background: #fff;
    width: 100%;
    font-family: 'Open Sans',sans-serif;
    font-size: 20px;
    color: #5e5e5e;
	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: #fff;
    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 #36c2b2;
}@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;
	}
}