﻿@media (max-width:999px), (orientation: portrait) {
	
	header {height:100vh; flex-flow:row wrap; left:auto; right:-100vw; top:0; -webkit-transform:translateZ(0); background-color:#fff !important; overflow-y:auto; overflow-x:hidden; transition:.5s;}
	#mm_cbx:checked + header {right:0;}
	/*header.act {display:flex;}*/
	header > .h_menu {order:2; width:100%; height:55vh;}
	header > .h_menu > a {float:left; width:100%; text-align:center; margin:1rem 0; font-size:1.2rem;}
	header > .h_logo {order:1; width:100%; text-align:center; margin:20vh 0 10vh;}
	header > .h_lang {position:absolute; width:100%; left:0; display:flex; flex-flow:row wrap; justify-content:center; top:12vh;}
	header > .h_call {position:absolute; top:3vh; left:5vw;}
	
	#mm_lb {display:block;}
	
	header, #crumbs, #ann, #fltr, main, footer {}
	
	#slider {/*width:100%; height:40vw;*/ display:none;}
	
	/*header > *:not(.h_logo) {display:none;}
	header > .h_logo {margin:0 auto;}*/
	main {margin-top:0 !important;}
	main > .bx:not(.n2) {padding:0 !important;}
	
	main > .bx > .b1 {margin:2rem 0 1rem; width:100% !important; text-align:center !important; position:relative !important;}
	main > .bx > .b1 .spr {width:100%; background-position:center !important;}
	main > .bx > .b1 > .txt {position:relative !important;}
	
	main > .bx.n1 > .gr {width:100% !important; text-align:center !important; margin:1rem 0;}
	main > .bx.n1 > .gr.c > img {width:100%;}
	main > .bx.n2 {background-size:auto 200%; background-position-x:35%; padding:5rem 0;}
	main > .bx.n2 > .play_vid {width:10rem; height:10rem;}
	main > .bx.n3 > .gr > .it {width:60vw; height:calc(60vw * 1.498233215547703); margin:0 0 0 10vw;}
	main > .bx.n3 > .gr > .it > img {width:inherit; height:inherit;}
	main > .bx.n3 > .gr > .txt {text-align:center; margin:4rem 0 2rem;}
	main > .bx.n4 > .gr {width:100%;}
	main > .bx.n4 > .gr > .it {width:60%; margin:2rem 20%;}
	main > .bx.n5 {width:100%; margin:0 !important; border-bottom:1px solid #ddd;}
	main > .bx.n5 > .m {width:100% !important;}
	main > .bx.n5 > .m > .dot {width:5vw; height:5vw;}
	
	main > .bx.n5 > .m > .dot.d1 > .inf {bottom:0; right:0; top:unset; left:unset;} main > .bx.n5 > .m > .dot.d1 .ln {bottom:100%; left:60%; transform:rotateZ(-77deg);} main > .bx.n5 > .m > .dot.d1 .txt {bottom:0; right:0; top:unset; left:unset;} 
	main > .bx.n5 > .m > .dot.d1:hover .ln {width:533%;} main > .bx.n5 > .m > .dot.d1:hover .txt {bottom:520%; right:-83%; top:unset; left:unset;}
	main > .bx.n5 > .m > .dot.d2:hover .ln {width:100%;} main > .bx.n5 > .m > .dot.d2:hover .txt {bottom:130%; left:180%;}
	main > .bx.n5 > .m > .dot.d3:hover .ln {width:190%;} main > .bx.n5 > .m > .dot.d3:hover .txt {top:250%; left:220%;}
	main > .bx.n5 > .m > .dot.d4:hover .ln {width:580%;} main > .bx.n5 > .m > .dot.d4:hover .txt {top:580%; left:130%;}
	main > .bx.n5 > .m > .dot.d5:hover .ln {width:305%;} main > .bx.n5 > .m > .dot.d5:hover .txt {bottom:400%; right:132%;}
	main > .bx.n5 > .m > .dot.d6:hover .ln {width:320%;} main > .bx.n5 > .m > .dot.d6:hover .txt {top:410%; right:110%;}
	main > .bx.n5 > .m > .dot.d7:hover .ln {width:400%;} main > .bx.n5 > .m > .dot.d7:hover .txt {top:103%; right:500%;}
	main > .bx.n5 > .m > .dot.d8 .ln {top:60%; left:0; transform:rotateZ(170deg);}
	main > .bx.n5 > .m > .dot.d8:hover .ln {width:190%;} main > .bx.n5 > .m > .dot.d8:hover .txt {top:90%; right:290%;}
	main > .bx.n5 > .m > .dot.d10:hover .ln {width:550%;} main > .bx.n5 > .m > .dot.d10:hover .txt {bottom:470%; right:510%;}
	main > .bx.n5 > .m > .dot.d11:hover .ln {width:420%;} main > .bx.n5 > .m > .dot.d11:hover .txt {top:333%; right:450%;}
	
	main > .bx.n5 > .s {width:90%; margin:0 auto; float:none;}
	main > .bx.n5 > .s > input[type="radio"]:checked + .it {position:relative;}
	main > .bx.n5 > .s > .it {border:none;}
	main > .bx.n6 {padding:0 0 2rem 0 !important;}
	main > .bx.n6 img {width:100% !important;}
	
	main > .app .z_it .img_gr, main > .app .z_it .img.mlf {width:100%; height:auto; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start;}
	main > .app .z_it > .dtl, main > .app .z_it > .inf {width:100%; margin:1rem 0 0;}
	main > .app .btn {width:70%; margin:.5rem 15%;}
	
	main > .app > .gr {max-height:3000vh; background:none; padding:.5rem;}
	main > .app > .gr.act {overflow-x:scroll;}
	
	main > .app .body {padding:1rem; justify-content:center;}
	
	main > .app .body > .gr_it {width:100%; margin:0 auto;}
	/*main > .app .dcr_it > img, main > .app .dcr_it > .trigger {left:0 !important;}*/
	main > .app .head > .menu {margin:4rem 0;}
	main > .app .menu > .sel, main > .app .menu > .txt, #ovrl .sel {width:100%; margin:.25rem 0;}
	main > .app .menu > .sel.hide, main > .app .menu > .txt.hide {display:none;}
	main > .app .menu .os_bck {width:100%; text-align:center; margin:2rem 0 0; padding:.5rem;}
	main > .app .it > .img {width:9rem; height:12rem;}
	
	main .app .inf .ln {width:100%; /*display:flex; flex-flow:column wrap; align-items:center;*/ margin:.25rem 0; line-height:1.2rem;}
	
	main > .about > .img {width:100%;}
	main > .about > .txt {width:100%; padding:0;}
	main > .about > .txt > p {padding:1rem 0 1rem 1rem; margin-left:0;}
	
	main > .app * {transition:none !important;}
	
	#products > .group > .its > .it {width:100%;}
	#crumbs.z1 {left:5%;}
	#products > .ctlg {width:90%;}
	#products > .ctlg > .fltr {width:100%;}
	#products > .ctlg > .its {width:100%; margin:5rem 0 !important;}
	#products > .ctlg > .its > .cnt .it_wrap {width:100%;}
	#products > .ctlg > .its > .top > .ttl {text-align:center;}
	#products > .ctlg > .its > .top > .sort {position:relative; transform:none; margin:3rem auto 0; display:block;}
	#products .its_not_found {position:relative; transform:none; margin-top:5rem;}
	#products > .info > .toggle.bg1:checked + .bg {height:94vh;}
	#products > .info > .bg > .txt {left:0; width:100%; text-align:center;}
	#products > .info > .bg > .txt > .gr {margin:0; font-size:.8rem;}
	#products > .info > .bg > .txt > .nm {font-size:2rem; line-height:2rem;}
	#products > .info > .bg > .txt > .art {font-size:1rem;}
	
	#products > .info > .c {width:90%;}
	#products > .info > .c > .img_wrap {width:100%; height:50vh;}
	#products > .info > .c > .dtl {width:100%;}
	#products > .info > .c > .dtl > .bx > .spec {margin:1rem auto 0;}
	#products > .info > .c > .prc {padding:0; width:100%; text-align:right;}
	
	#products .set_its .it_wrap {width:100%;}
	
	#ovrl .bx {max-width:97vw;}
	#ovrl.act > .bx > .it {width:100%;}
	#ovrl.act > .bx > .it > .img {height:56vh;}
	#ovrl.act > .bx > .menu {width:100% !important; padding:1rem !important;}
	#ovrl.act > .bx > .menu label {width:50%;}
	
	#ovrl .add_files > .prv > .it {max-width:45%;}
	
	#ovrl .menu.x > .dcr .it {margin:.5rem auto; width:9rem; min-height:6rem;}
	
	#ovrl > .bx > .zm_img {max-width:80vw; max-height:80vh;}
	#ovrl > .bx > .zm_clr {width:80vw; height:50vh;}
	
	#cnt > .bx > .gr.cnt > .its {width:100%; margin:1rem 0;}
	#cnt > .bx > .gr.mlmp > .ml {width:100%;}
	#cnt > .bx > .gr.mlmp > .mp {width:100%;}
	
	#ovrl > .bx > .note {width:90vw;}
	
	#ovrl .add_files > .prv .it {max-width:47%;}
	#ovrl .add_files > .dd_plc > .f {height:10vh;}
	#ovrl.act > .bx .btns > .btn.finalize {width:100%; margin:1rem 0;}
	
	.mag {width:90vw !important;}
	.mag > .cnt > .pgs > .gr {box-shadow:none !important;}
	
	#broskoweb_container {min-height:75vh;}
	
	footer {min-height:100vh;}
	footer > .gr {width:100%; margin:2% 0;}
	footer > .gr > .fmn {width:fit-content;}
	footer > .gr > .fmn > a {width:auto; text-align:center; margin:1rem 0;}
	footer > .gr > .fmn > div.sc {width:100%; display:flex; justify-content:center;}
	footer > .gr > .fmn > div.sc > a {width:2rem; height:2rem;}
}

@media (max-width:1280px) and (orientation: landscape) {
	main > .bx.n1 > .gr.c > img {width:60%;}
	main > .bx.n2 {padding:7rem 0;}
	main > .bx.n3 > .gr > .it {width:25vw; height:calc(25vw * 1.498233215547703); margin:0 0 0 10vw;}
	main > .bx.n3 > .gr > .txt {text-align:center; margin:4rem 0 2rem;}
	main > .bx.n4 > .gr > .it {width:27%; margin:0 3% 3rem;}
	main > .bx.n5 > .s > .it {float:left;}
	main > .bx.n5 > .s > .it > .txt.nm {padding:0 0 1rem;}
	main > .bx.n5 > .s > .it > .txt.inf {float:right; width:45%; padding:0; margin:0;}
	main > .bx.n5 > .s > .it > img {width:50%; float:left;}
	main > .bx.n6 {padding:0 0 2rem 0 !important;}
	main > .bx.n6 img {width:48% !important;}
}

@media (min-width:999px) and (max-width:1280px) and (orientation: landscape) {
	main > .bx.n5 > .s > .it > .txt.inf {width:100%;}
	main > .bx.n5 > .s > .it > img {width:100%;}
}

@media (max-width:900px) and (orientation: landscape) {
	
}


@media (min-width:1000px) and (max-width:1299px) {	
	
}

@media (min-width:2000px) {	
	
}