@media screen and (min-width: 1300px) {

:root {
  --mW: 1300px;
  --sideL: 785px;
  --sideR: 468px;
  --sideM: 45px;
  --red: #C42B0C;
  --yella: #FFB600;
}


@keyframes fadeIn {
    from 	{ opacity: 0; }
    to 		{ opacity: 1; }
}

@keyframes flyInR {
    from 	{ opacity: 0; transform: translateX(600px);}
    to 		{ opacity: 1; transform: translateX(0);}
}

@keyframes flyInL {
    from 	{ opacity: 0; transform: translateX(-600px);}
    to 		{ opacity: 1; transform: translateX(0);}
}

@keyframes buyButton {
    from {
        transform: scale(0.6);
    }
    to {
        transform: scale(1);
    }
}


.fadeIn {
    animation: fadeIn linear;
    animation-timeline: view();
    animation-range-start: cover;
    animation-range-end: 600px;
}

.flyFromRight {
    animation: flyInR linear;
    animation-timeline: view();
    animation-range-start: cover;
    animation-range-end: 600px;
}

.flyFromLeft {
    animation: flyInL linear;
    animation-timeline: view();
    animation-range-start: cover;
    animation-range-end: 600px;
}

.bButton {
    animation: buyButton linear;
    animation-timeline: view();
    animation-range-start: cover;
    animation-range-end: 220px;
}



body, div, td, p, a, h1, h2, h3 {
	 font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
	}
	
	
	
	
.l							{float:left}
.cls						{clear:both; overflow:hidden; width:1px; height:1px; }
.mobileOnly 		{display:none !important;}

body							{background:white; margin:0; padding:0; overflow-x:hidden; }
#topRow  					{background-image:url('images/topBg.png'); background-size:100% 100%; height:100px; box-shadow:0px -8px 20px black; position:relative; z-index:100}
#topRow .inner 		{width: var(--mW); position:relative; margin:0 auto}
#topRow #logo 		{float:left; width:49%; height:100px; background:#F0F0F0}
#topRow #logo a 	{position:absolute; top:10px; left:20px; display:block; width:137px; height:72px; background-image:url('images/logo.png'); background-size:137px 72px; text-decoration:none}
#topRow #mainMenu {float:left; background-image:url('images/header-divider.png'); background-size: 145px 100px; background-repeat:no-repeat; background-position:top left; height:100px; padding-left:160px}
#topRow #mainMenu a {line-height:100px; font-size:20px; color:black; text-decoration:none; display:inline-block; padding:0px 18px}
#topRow #mainMenu a:hover {text-decoration:underline}
#hugr1 				{}

.divider {background:url('images/divider.png') 50% 50%; background-size:1285px 5px; width: var(--mW); height:5px; position:absolute; }

.section {position:relative; background:white }
.section .inner {margin: 0 auto; width: var(--mW); }

.section h2 						{color: var( --red); font-size:75px; margin:0; padding-top:90px; font-weight:700}
.section h2 span 				{font-size:45px; display:block; color:black; font-weight:400}
.section p 		{font-weight:300; font-size:25px; line-height:35px} 
 

.sideL {float:left; width:var(--sideL); position:relative }
.sideR {float:left; width:var(--sideR); margin-left:var(--sideM); position:relative}


/* icons*/
.iconL {width:105px; height:105px; display:block; border-radius:26px; background-size:105px 105px; text-decoration:none}
.iconS {width:65px; height:65px; display:block; border-radius:16px; background-size:65px 65px; text-decoration:none}
.iconL.shadow {box-shadow:0px 0px 10px rgba(0,0,0,0.5);}
.iconS.shadow {box-shadow:0px 0px 8px rgba(0,0,0,0.5);}

.icon-1.active 	{background-image:url('images/perspective-on.png') }
.icon-1 				{background-image:url('images/perspective-off.png') }
.icon-2.active 	{background-image:url('images/shake-on.png') }
.icon-2 				{background-image:url('images/shake-off.png') }
.icon-3.active 	{background-image:url('images/sharpness-on.png') }
.icon-3 				{background-image:url('images/sharpness-off.png') }
.icon-4.active 	{background-image:url('images/guides-on.png') }
.icon-4 				{background-image:url('images/guides-off.png') }
.icon-5.active 	{background-image:url('images/mirror-on.png') }
.icon-5 				{background-image:url('images/mirror-off.png') }
.icon-6.active 	{background-image:url('images/liveview-on.png') }
.icon-6 				{background-image:url('images/liveview-off.png') }

#section-1 { height:558px; background-color:white; background-image:url('images/az-bg.jpg'); background-position:60% 50%; background-repeat:no-repeat; background-size:1547px 578px; }
#section-1 .inner {height:558px;}
#section-1 .divider {top:556px; z-index:100}
#section-1 h1 {font-size:86px; font-weight:bold; color:var(--red); text-shadow:0px 0px 20px rgba(0,0,0,0.15); margin:0px; text-align:right}
#section-1 h2 {font-size:39px; font-weight:400; color:black; text-shadow:0px 0px 10px rgba(0,0,0,0.15); margin:0; padding: 0 0 0 0; text-align:right}
#section-1 .sideL {padding-top:170px}
#section-1 .sideR #outerFrame {position:absolute; top:100px; left:0; background:url('images/magnifier-frame.png') no-repeat top left; background-size:465px 336px; width:465px; height:336px;}
#section-1 .sideR #innerFrame {width:435px; height: 308px; margin:14px 0px 0 16px; background:url('images/screenBg.jpg') no-repeat 50% 50%; background-size: 484px 358px; border-radius:12px}

#section-2 { height:793px; background-color:white; background-image:url('images/accent-bg.jpg'); background-position:50% 50%; background-repeat:no-repeat; background-size:1191px 793px; }
#section-2 .inner {height:793px;}
#section-2 .divider {top:791px; z-index:100}
#section-2 .sideL {height:793px;}
#section-2 .sideR {height:793px;}
#section-2 #functionFrame {width:772px; height:622px; border-radius:40px; box-shadow:0px 0px 40px rgba(0,0,0,0.3); margin:80px 0 0 15px; background-color:white}
#section-2 .function {position:relative}
#section-2 h2 {padding-top:110px;} 
#section-2 .function h3 {margin:0; color:black; font-size:35px; font-weight:400; padding:40px 0 16px 49px}
#section-2 .function p {font-weight:300; font-size:25px;  margin:25px 49px 0 49px; line-height:35px}
#section-2 .function p strong {font-weight:700}
#section-2 .function img {width:674px; height:201px; margin:0 49px 0 49px}
#functionFrame .iconS {position:absolute; top:240px; left:40px;}
#functionFrame .iconS.active {position:absolute; top:240px; left:667px;}

#section-2 #function-1 {display:block;}
#section-2 #function-2 {display:none;}
#section-2 #function-3 {display:none;}
#section-2 #function-4 {display:none;}
#section-2 #function-5 {display:none;}
#section-2 #function-6 {display:none;}
#section-2 .sideR .iconL {display:inline-block; margin:10px}

#section-3 .inner { height:886px; background-color:white; background-image:url('images/properties-bg.jpg'); background-position:top right; background-repeat:no-repeat; background-size:764px 886px; }
#section-3 .divider {top:886px; z-index:100}
#section-3 h3 {font-size:25px; font-weight:700; margin:0; padding:0 0 5px 0}
#section-3 p {font-size:25px; font-weight:300; padding:0;  margin:0 0 15px 0}
#section-3 h2 {margin-bottom:50px; }
#section-4 .inner {height:720px; position:relative}
#section-4 .photoDivider {top:632px; z-index:100; background-image:url('images/divider-photo.png'); height:201px; background-size:1285px 201px; width: var(--mW); position:absolute; }
#section-4 .flyIm { position:absolute; top:190px; left:-110px;  height:532px; width:1215px; background-color:white; background-image:url('images/excellence-bg.jpg'); 	background-position:bottom left; background-repeat:no-repeat; 	background-size:1215px 532px; }
#section-5 {height:1120px;}
#section-5 .inner {height:1120px; position:relative}
#section-5 .divider {top:1116px; z-index:100}
#section-5 .flyIm { position:absolute; top:0px; left:480px;  height:1120px; width:1129px; background-color:white; background-image:url('images/hw-bg.jpg'); 	background-position:bottom left; background-repeat:no-repeat; 	background-size:1120px 1129px; }

#section-6  { height:638px; background-color:white; background-image:url('images/adaptech-bg.jpg'); background-position:50% 50%; background-repeat:no-repeat; background-size:1233px 638px; }
#section-6 .orderButton {display:block; background-color:var(--yella); width:750px; height:75px; padding-top:8px; margin-top:60px; text-decoration:none; color:black; text-align:center; font-size:35px; font-weight:700; border-radius:15px; box-shadow:0px 0px 20px rgba(0,0,0,0.2)}
#section-6 .orderButton span {display:block; font-size:20px; font-weight:400}

#hwTable { width:760px; margin-top:60px; }
#hwTable div {font-size:25px; line-height:50px; font-weight:300}
#hwTable .row {border-bottom:2.5px solid #DCDCDC; height:49px;}
#hwTable .row.headline { height:80px; padding-top:10px}
#hwTable .row:nth-child(even) { background: linear-gradient(90deg, rgba(249,249,249,1) 0%, rgba(242,242,242,1) 38%, rgba(240,240,240,1) 66%, rgba(248,248,248,1) 100%)}
#hwTable .row:nth-child(odd)  { background:white; }
#hwTable .row .label {width:500px; float:left; height:48px}
#hwTable .row .value {width:260px; float:left; height:48px}
#hwTable .wideValueColumn .row .label {width:350px; float:left; height:48px}
#hwTable .wideValueColumn .row .value {width:410px; float:left; height:48px}
 
#footer {background: #6D6D6D; color:white; padding-top:20px; height:400px; line-height:25px; font-size:18px}
}


@media screen and (max-width:1299px) {
	
:root {

  --red: #C42B0C;
  --yella: #FFB600;
}

@keyframes fadeIn {
    from 	{ opacity: 0; }
    to 		{ opacity: 1; }
}

@keyframes flyInR {
    from 	{ opacity: 0; transform: translateX(600px);}
    to 		{ opacity: 1; transform: translateX(0);}
}

@keyframes flyInL {
    from 	{ opacity: 0; transform: translateX(-600px);}
    to 		{ opacity: 1; transform: translateX(0);}
}

@keyframes buyButton {
    from {
        transform: scale(0.6);
    }
    to {
        transform: scale(1);
    }
}


body, div, td, p, a, h1, h2, h3 {
	 font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
	}
	
	
.l							{float:left}
.cls						{clear:both; overflow:hidden; width:1px; height:1px; }
.desktopOnly 		{display:none !important;}

body						{background:white; margin:0; padding:0;/* overflow-x:hidden;*/ width:100%; /*overflow:hidden*/}
/*
body {-webkit-filter: invert(100%);}
.iconL, .iconS, .bButton, h2, h2 span, #section-1 .sideL  {-webkit-filter: invert(100%)}
*/


#topRow  				{ width:100vw; height: 13vw; background:#f0f0f0; z-index:105; top:0; left:0; box-shadow:0px -2vw 4vw black;}
#topRow .inner 		{ margin:0 auto; width:50vw; margin: 0 auto; }
#topRow #logo 		{height:15vw; }
#topRow #logo a {
		display:block; 
		height:13vw; 
		width:50vw; 
		margin:0vw 0 0 0;
		background-image:url('images/logo.png'); 
		background-repeat:no-repeat; 
		background-size:14vw auto; 
		background-position:center center; 
		text-decoration:none
		}

#hugr1 					{}
.section 				{position:relative; width:100vw; background:white}
.section .inner {margin: 0 auto;  }




/* SEKCE MOBILNI cca 1.4x*/

#section-1 .inner {display:flex; flex-flow: column; height:93vw;}
#section-1 {background-color:white; background-image:url('images/az-bg.jpg'); background-position:50% 50%; background-repeat:no-repeat; background-size:310vw 125vw; }
#section-1 .sideR {order:1; width:100vw; height:67vw; }
#section-1 .sideR #outerFrame { position: absolute; top: 7vw; left: 17.5vw; background: url('images/magnifier-frame.png') no-repeat top left; background-size: 65.1vw 47.04vw; width: 65.1vw; height: 47.04vw; }
#section-1 .sideR #innerFrame { width: 60.9vw; height: 43.12vw; margin: 1.96vw 0px 0 2.24vw; background: url('images/screenBg.jpg') no-repeat 50% 50%; background-size: 67.76vw 50.12vw; border-radius: 1.68vw; }
#section-1 .sideL {order:2; width:100vw; height:35vw; padding-top:0vw}
#section-1 h1 { font-size: 12.04vw; font-weight: bold; color: var(--red); text-shadow: 0vw 0vw 2.8vw rgba(0, 0, 0, 0.15); margin: 0vw; text-align: center; }
#section-1 h2 { font-size: 5.46vw; font-weight: 400; color: black; text-shadow: 0vw 0vw 1.4vw rgba(0, 0, 0, 0.15); margin: 0; padding: 0 0 0 0; text-align: center; }
#section-1 .divider {order:3; width:100vw; height:1vw}
.divider {background:url('images/divider.png') 50% 50%; background-size:100vw 1vw; width: 100vw; height:1vw; position:relative; top:0.5vw}

.section h2 						{color: var( --red); font-size:12vw; margin:0;  font-weight:700; text-align:center}
.section h2 span 				{font-size:8vw; display:block; color:black; font-weight:400}
.section p 		{font-weight:300; font-size:4vw; line-height:5vw;  text-align:center} 




#section-2 { height:159vw; background-color:white; background-image:url('images/accent-bg.jpg'); background-position:50% 50%; background-repeat:no-repeat; background-size:236.55vw 160.56vw; position:relative}
#section-2 .inner {height:97.56vw;}
#section-2 .divider {top:158.5vw; z-index:100}
#section-2 .sideL {}
#section-2 .sideR {}
#section-2 #functionFrame {width:94.96vw; height:82.48vw; border-radius:4.92vw; box-shadow:0vw 0vw 4.92vw rgba(0,0,0,0.3); background-color:white; position:absolute; left:2.5vw; top:34vw}

#section-2 .function {position:relative}
#section-2 h2 {position:absolute; top:7vw; width:100%} 
#section-2 #s2buttons {position:absolute; top:121vw; left:2vw} 
#section-2 .sideR p {position:absolute; top:134vw; width:100%} 

#section-2 .function h3 {margin:0; color:black; font-size:4.3vw; font-weight:400; padding:4.92vw 0 1.97vw 6.03vw}
#section-2 .function p {font-weight:300; font-size:3.7vw; margin:3.07vw 6.03vw 0 6.03vw; line-height:4.5vw}
#section-2 .function p strong {font-weight:700}
#section-2 .function img {width:82.91vw; height:24.73vw; margin:0 6.03vw 0 6.03vw}
#functionFrame .iconS {position:absolute; top:29.53vw; left:4.92vw;}
#functionFrame .iconS.active {position:absolute; top:29.53vw; left:82.05vw;}

#section-2 #function-1 {display:block;}
#section-2 #function-2 {display:none;}
#section-2 #function-3 {display:none;}
#section-2 #function-4 {display:none;}
#section-2 #function-5 {display:none;}
#section-2 #function-6 {display:none;}
#section-2 .sideR .iconL {display:inline-block; margin:1vw}

.iconL {width:12.92vw; height:12.92vw; display:block; border-radius:3.2vw; background-size:12.92vw 12.92vw; text-decoration:none}
.iconS {width:7.99vw; height:7.99vw; display:block; border-radius:1.97vw; background-size:7.99vw 7.99vw; text-decoration:none}
.iconL.shadow {box-shadow:0vw 0vw 1.23vw rgba(0,0,0,0.5);}
.iconS.shadow {box-shadow:0vw 0vw 0.98vw rgba(0,0,0,0.5);}

.icon-1.active 	{background-image:url('images/perspective-on.png') }
.icon-1 				{background-image:url('images/perspective-off.png') }
.icon-2.active 	{background-image:url('images/shake-on.png') }
.icon-2 				{background-image:url('images/shake-off.png') }
.icon-3.active 	{background-image:url('images/sharpness-on.png') }
.icon-3 				{background-image:url('images/sharpness-off.png') }
.icon-4.active 	{background-image:url('images/guides-on.png') }
.icon-4 				{background-image:url('images/guides-off.png') }
.icon-5.active 	{background-image:url('images/mirror-on.png') }
.icon-5 				{background-image:url('images/mirror-off.png') }
.icon-6.active 	{background-image:url('images/liveview-on.png') }
.icon-6 				{background-image:url('images/liveview-off.png') }


#section-3 .inner { height:155vw; background-color:white; background-image:url('images/properties-bg.jpg'); background-position:-40vw 0vw; background-repeat:no-repeat; background-size:auto 160vw; }
#section-3 .divider {top:154.5vw; z-index:100}
#section-3 h3 { padding:5vw 15vw 1vw 15vw; margin:0; text-align:center}
#section-3 p {padding:0 5vw 0 5vw ; margin:0; }
#section-3 h2 {padding-top:6vw}


#section-4 .inner {height:144vw; position:relative}
#section-4 p {padding:0 5vw}
#section-4 .flyIm { position:absolute; top:75vw; left:0vw;  height:150vw; width:100vw; background-color:white; background-image:url('images/excellence-bg.jpg'); 	background-position:-40vw 0; background-repeat:no-repeat; 	background-size:auto 90vw; }
#section-4 .photoDivider {
		top:138vw; 
		z-index:100; 
		background-image:url('images/divider-photo.png'); height:16vw; background-repeat:no-repeat; background-size:100vw auto; width: 100vw; position:absolute; }



#section-5 .sideR {position:absolute; top:12vw; left:0; width:100vw;}
#section-5 .inner {height:225vw; width:100%; position:relative; background-color:white; background-image:url('images/hw-bg.jpg'); 	background-position:-70vw -40vw; background-repeat:no-repeat; 	background-size:auto 300vw;}
#section-5 .divider {top:225vw; z-index:100}
#section-5 .flyIm { position:absolute; top:0px; left:0px;  }

#hwTable { width:92vw; margin-top:30vw; margin-left:4vw }
#hwTable div {font-size:4vw; line-height:6vw; font-weight:300}
#hwTable .row {border-bottom:0.4vw solid #DCDCDC; height:9vw; overflow:hidden}

#hwTable .row.headline { height:16vw; padding-top:1.5vw}
#hwTable .row .label {width:52vw; float:left; height:9vw; padding-top:1.5vw}
#hwTable .row .value {width:40vw; float:left; height:9vw; padding-top:1.5vw}

#hwTable .row:nth-child(even) { background: linear-gradient(90deg, rgba(249,249,249,0.7) 0%, rgba(242,242,242,0.7) 38%, rgba(240,240,240,0.7) 66%, rgba(248,248,248,0.7) 100%)}
#hwTable .row:nth-child(odd)  { background:rgba(255,255,255,0.7); }

#hwTable .wideValueColumn .row .label {width:25vw;}
#hwTable .wideValueColumn .row .value {width:67vw;}

#section-6  { height:100vw; background-color:white; background-image:url('images/adaptech-bg.jpg'); background-position:50% 50%; background-repeat:no-repeat; background-size:auto 100vw; }
#section-6 .orderButton {display:block; background-color:var(--yella); width:90vw; height:15vw; padding:3vw 0 3vw 0; margin:6vw 0 0 5vw; text-decoration:none; color:black; text-align:center; font-size:7vw; font-weight:700; border-radius:3vw; box-shadow:0px 0px 4vw rgba(0,0,0,0.2)}
#section-6 .orderButton span {display:block; font-size:5vw; font-weight:400}
#section-6 .sideL {padding-top:6vw}
#section-6 .sideL p {padding:0 3vw 0 3vw}

#footer {background: #6D6D6D; color:white; padding:4vw;  font-size:3.5vw}

#mainMenu {position:absolute; top:4vw; left: 77vw; margin-right:5vw}
#mainMenu a {float:left; }
#mainMenu a span {display:none;}

#mainMenu a.contact { width:8.25vw; height:5.25vw; background: url('images/post.png') center center no-repeat; background-size:4.875vw 3.75vw; }
#mainMenu a.cssTog { width:5.25vw; height:5.25vw; background: url('images/invert.png') center center no-repeat; background-size:3.75vw 3.75vw; }
		
		
		
		
		
		







	
	
	
	
	}