/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;

}
html,body {
  margin:0;
  padding:0;
  font-family: 'DM Sans';
  font-size: 16px;
  line-height: 21px;
  letter-spacing: 0.02em;
  background-color:#FCFCFC;
  color:#000;
  -webkit-text-size-adjust:100%;
  overflow:hidden;
  
}

body { -webkit-transition:background 1s;-moz-transition:background 1s;-o-transition:background 1s;transition:background 1s }



h1, h2, h3, h4, h5, h6 { font-weight: normal; }
a           { color:#000; text-decoration: none;}
a:focus		{ outline: none; }
a:hover     { color:#000;}
.clearboth  { clear: both; }
.floatleft  { float: left; }
.uppercase  { text-transform: uppercase; }
.capitalize { text-transform: capitalize; }
.black		{ color:#000 }
img         { border: none; }
p           { clear:both; }
ul          { margin:0; }
b           { font-weight:500; font-family: 'Libre Franklin'; }
strong      { font-weight:500; font-family: 'Libre Franklin'; }
hr          { height:1px; border:0; background-color: #000; }
.tisic      { margin-left: 0.3em;	}
.nonselectable { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;}
.nopadding  { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
input,textarea { border:none; outline:none; resize:none; padding:10px 2% 10px 2%; margin-top:5px; font-family: 'Libre Franklin'; font-size:20px; border:solid 1px #404040;
                -webkit-appearance: none; -webkit-border-radius:0px;  }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
   -webkit-box-shadow: 0 0 0 1000px white inset !important;
}
.ramecek5   { -webkit-border-radius:5x; -moz-border-radius:5px; border-radius:5px; }
.ramecek10  { -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
.ramecek-kulaty { -webkit-border-radius:100%; -moz-border-radius:100%; border-radius:100%;}

.table-cell	{ display: table-cell; vertical-align: middle;  }

li { list-style-position:inside; }

hr 			{ padding:0; margin:0; background-color:#404040; }

.DMSans32	{ font-family: 'DM Sans'; font-size:32px; line-height:36px }
.DMSans18	{ font-family: 'DM Sans'; font-size:18px; line-height:24px }
.DMSans16	{ font-family: 'DM Sans'; font-size:16px; line-height:24px }

  
/*
.all-small-caps { text-transform:uppercase; font-size:22px; line-height:26px; font-variant-caps: all-small-caps; -moz-font-feature-settings: 'c2sc', 'smcp'; 
				  -webkit-font-feature-settings: 'c2sc', 'smcp'; font-feature-settings: 'c2sc' on, 'smcp' on; }
*/

.HattonUltralight110	{ font-family:'Hatton-Ultralight'; font-size:calc(6.3vw - 14px); line-height:calc(6.34vw - 14px); text-transform: uppercase;  }

main        { position:relative; float:left; display:block; width:100%; height:100vh; overflow:hidden; overflow-y:scroll }
nav         { position: relative; width:100%; padding-top:70px; } 

h1			{ line-height:18px }



.mdb-lightbox-ui	{ z-index:10000!important }

.uvod 			{ position:relative; float:left; margin-top:30px; width:100%; min-height:calc(100vh - 55px); }
.uvod-kontakt	{ position:relative; float:left; width:calc(50% - 190px); margin-left:30px; position:relative; z-index:100  }
/*
.uvod-img		{ display:none; position:absolute; bottom:0; width:40%; max-height:calc(100vh - 150px); margin-left:30px; overflow:hidden; z-index:10;}
.uvod-img img	{ float:left; width:100%; height:auto; }
*/
.uvod-img		{ display:none; position:absolute; top:90px; width:40%; max-height:calc(100vh - 150px); margin-left:30px; overflow:hidden; z-index:10;}
.uvod-img img	{ float:left; width:auto; max-width:100%; height:auto; max-height:calc(100vh - 150px); object-fit:cover }

.overlay 		{ position: absolute; left:0; width:100%; height:100vh; overflow:hidden; background-color:#FCFCFC; transition:0.25s ease; z-index:1000;}
.overlay.active { width:0; }


.menu			{ position:relative; float:right; width:calc(50% - 60px); margin-right:60px; z-index:100; }
.menu-polozka	{ float:left; position:relative; cursor:pointer; overflow:hidden; padding-top:5px; clear:both; -webkit-tap-highlight-color: transparent; }
.polozka			{ position:relative;  }
.polozka.active	{  z-index:100 }

.menu-polozka-mobile	{ display:none; }

.trans1		{ transition: all 2s cubic-bezier(.24,0,0,1.11) }
.trans2		{ transition: all 1s cubic-bezier(0.68, 0.01, 0.44, 1.01)}



.puntik 	{ position:absolute; top:27px; left:calc(100vw - 70px); background-color: transparent; width: 28px; height: 28px; cursor:pointer; outline:none;
			-webkit-tap-highlight-color: transparent; }
.puntik-inner { position: relative; width: 100%; height: 100%; text-align: center; border:0; transition: transform .5s; transform-style: preserve-3d; }
.puntik.active .puntik-inner { transform: rotateY(180deg); }
.puntik-back { position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; /* Safari */ backface-visibility: hidden; }

.puntik-back { position:relative; background-color:#FCFCFC; transform: rotateY(180deg); z-index:100 }


.pun { position:absolute; top:27px; left:calc(100vw - 70px); background-color:black; width: 28px; height:28px; cursor:pointer; outline:none; z-index:100;
		-webkit-tap-highlight-color: transparent; }


/*#ajax-index		{ margin-left:100vw;  }*/

#ajax-homepage	{ position:relative; min-height:100vh;}


.index-prostor		{ position:absolute; top:0; width:100vw; height:100vh; overflow:hidden; z-index:100;  }

.index			{ display:none; position:absolute; cursor:pointer; top:0; width:100%; height:100vh; color:white; overflow-y:auto; color:#BEBEBE; z-index:1000; }
.index-mirror	{ position:fixed; top:0; left:0; width:calc(100% + 1px); height:100%; -webkit-transform: scaleX(-1); transform: scaleX(-1); }
.index-pozadi	{ position:fixed; top:0; left:0; width:0; height:100%; background: #000; }
.index.active-width	{ position:fixed; width:100%; height:100vh;  cursor:default; }
.index.active-height	{ position:fixed; width:100%; height:100vh; cursor:default; }
.index2			{ z-index:1000 }
.index-kontakt	{ position:relative; float:left; width:calc(50% - 190px); margin:10px 0 0 10px;  }
.index-kontakt a	{ color:#bebebe; }

.logo2,
.logo3			{ cursor:pointer; }

.index-inner	{ position:relative; padding:20px; }
.index-text		{ float:left; width:calc(50% - 60px); max-width:610px; margin-left:190px; margin-top:10px; margin-bottom:40vh  }
.index hr		{ background:#BEBEBE; margin-top:20px }
.index-kolekce	{ margin:10px 0 0 0; text-transform:uppercase;  }
.index-cislo		{ font-size:20px; line-height:40px; }
.index-foto-prostor	{ float:left; max-width:calc(100% + 20px); overflow-x:hidden; overflow-y:hidden; margin:20px 0 }
.index-foto-prostor a	{ cursor:pointer!important }
.scroll				{ position:relative; width:2000px; padding-left:140px;}
.index figure		{ float:left; width:300px; text-align:center; margin:0 15px 0 15px!important; }
.index figure a 		{ float:left; width:300px;  text-align:center; margin-bottom:20px; }
.index figure img	{ max-width:100%; max-height:100%; }





.pointer			{ cursor:pointer; }
.grab,
.grab a				{ cursor:grab; cursor:-o-grab; cursor:-moz-grab; cursor:-webkit-grab; }
.grabbing,
.grabbing a			{ cursor:grabbing; cursor:-o-grabbing; cursor:-moz-grabbing; cursor:-webkit-grabbing; }



.pswp__button--close { background-image:url(../images/x.svg)!important; width:35px; height:35px; background-size:35px 35px; text-indent: -9999px;
  line-height: 0; right:20px; top:22px; }

.index-foto-prostorB	{ float:left; max-width:100%; overflow-x:hidden; overflow-y:hidden; margin:20px 0 }
.index-foto-prostorB a	{ cursor:pointer!important }



.kolekce-inner	{ position:absolute; margin-top:calc(40vh - 110px); width:calc(100% - 40px); z-index:100;}

.menu-kolekce	{ margin-top:30px; }
.menu-kolekce .menu-polozka	{ cursor:default; }
.sipka			{ position:absolute; left:-80px; cursor:pointer; display:none;-webkit-tap-highlight-color: transparent;  }
.sipka img		{ width:100%; }



.sipka-blok		{ position:absolute; width:92px; height:40px; margin:auto; margin-top:-10px; left:0; right:0; background:#FCFCFC;}


.kolekce-nadpis	{ text-align: center; overflow:hidden; cursor:default; padding-top:5px }

.kolekce-pozadi	{ width:50%; text-align:center; float:right;  }



.hlavni-posun	{ opacity:0}

.kolekce-hlavni  	{ width:100%;}

figure 	{ position:relative; z-index:100 }

.kolekce-hlavni a	{ position:relative; margin:auto; z-index:100; width:60%; display:block; }

.kolekce-hlavni img	{ float:left; width:100%; }

.kolekce-popis { float:left; width:80%; max-width:610px; padding:25px; text-align:left; margin-top:30vh; margin-bottom:100px }

.kolekce-prostor { margin-top:10vh; }

.kolekce-text	{ width:50%; margin:auto; text-align:center; margin-top:20px; }


.kolekce-text-hide	{ display:none; float:left; width:100%; text-align:center; padding:20px 0 }


.kolekce-kontakt	{ position:relative; z-index:100; margin:30px 0 0 30px; }
.kolekce-kontakt a	{ color:#000; }


figure.kolekce-left  	{ clear:both; width:50%; text-align:center; }
figure.kolekce-left img 	{ width:50%; float:none }

figure.kolekce-right  	{ clear:both; width:50%; text-align:center;  }
figure.kolekce-right img 	{ width:50%; float:none }

figure.kolekce-big	{ clear:both; width:50%;  text-align:center; padding-top:100px; margin:0 auto 250px auto;  }
figure.kolekce-big img 	{ width:100%; float:none }


.kolekce-random1 figure.kolekce-left { float:left!important; }
.kolekce-random1 figure.kolekce-right { float:right!important;  }
.kolekce-random2 figure.kolekce-left { float:right!important; }
.kolekce-random2 figure.kolekce-right { float:left!important; }

.kolekce-random1 figure.kolekce-big,
.kolekce-random2 figure.kolekce-big  	{ float:none!important;  }

.kolekce-info	{ margin-top:20px; text-align:center;}



footer 			{ position:relative; float:left; margin-top:-50px; text-align:center; width:calc(100% - 40px); margin-left:20px; z-index:100;}
footer a:hover 	{ color:#000; border-bottom:1px solid #000}
.footer-mobile	{ display:none; }


.footer-white a,
.footer-white a:hover	{ color:#BEBEBE }


.pswp__preloader	{ display:none}







.splitting .char {
  animation: slide-in 2s ease;
  animation-delay: calc(5ms * var(--char-index));
  animation-fill-mode: forwards;
  opacity:0;
}


@keyframes slide-in {
  0% {
    transform: translateY(1em);

  }
  20%,
  100% { 
    transform: translateY(0);
    
  }

  0%,
  100% {
    opacity:1;  
  }
}




.splitting2 .char {
  animation: slide2-in 2s ease;
  animation-delay: calc(5ms * var(--char-index));
  animation-fill-mode: backwards;  
  opacity:0;
}




@keyframes slide2-in {
  0% { 
    transform: translateY(0);
  }
  20%,
  100% { 
    transform: translateY(1em);
  }
  0%,
  100% {
    opacity:1;  
  }
}