@font-face {
	font-family: 'gothic';
	src: local('gothic'), url('gothic.woff') format('woff');}
@font-face {	font-family: 'gothicb';
	src: local('gothicb'), url('gothicb.woff') format('woff');
}
/* use this class to attach this font to any element i.e. <p class="fontsforweb_fontid_9785">Text with this font applied</p> */
.fontsforweb_fontid_9785 {
	font-family: 'gothic' !important;
}

/* Font downloaded from FontsForWeb.com */



html {font-size:100%; background-repeat:no-repeat; background-position: center top;
     font-family:'gothic', sans-serif;text-align:justify; font-weight:lighter; -webkit-animation-direction: alternate;
     -moz-animation-direction: alternate;
     -o-animation-direction: alternate;
     animation-direction: alternate;overflow-x: hidden; max-width:100% !important }
body {
	margin:0; color: #606062; max-width:100% !important ;
	padding:0; 
	font-size:16px;
	font-family: 'gothic', sans-serif;text-align:justify;
}
a { color: #333; text-decoration:none
}
strong {font-family: 'gothicb', sans-serif;text-align:justify;}
a:link { color:#993300}
a:visited { color: #993300}
a:hover { color: #993300}
a:active { color:#993300}
img {border:0; padding:0; margin:0}
h1 {margin:0; padding:0; padding-left:5%; padding-right:5%;color:#000; padding-top:10px; font-size: 36px; padding-bottom:10px; text-transform:uppercase}
h2 { margin:0; color:white; border-left:2px solid white; padding:15px; font-size:1.8em; margin-left:50px; margin-left:5%; margin-bottom:15px; }
h3 {margin:0; padding:0; padding-bottom:10px; font-size:14px; color:#000; text-align:left }
table tr th {text-align:left; vertical-align:top; color: #000}
table tr td {text-align:left; vertical-align:top; color: #000}
#page { margin-left:auto; width:100%; margin-right:auto;  clear:both  ; }
#header { padding-left:5%;}
#logoimg { width:125px; margin-top:0px; padding-top:0px; float:left;margin-bottom:15px }
#logoimg img { width:100%}
ul { padding-left:15px}
ul li { padding:0; margin:0; }
#menu { padding-right:5%; background-color: rgb(255, 255, 255);
    /* RGBa with 0.6 opacity */
    background-color: rgba(255, 255, 255, 0.95);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
 text-align:right; margin-right:0%;  float:right; display:block;  }
#menu a { width:auto; font-size:  16px; display:block; float:left; text-transform:lowercase; text-align:center; padding-top:48px;  text-decoration:none; padding-left:25px; padding-right:25px; padding-bottom:15px; margin-top:8px; font-weight:bold; color:#333}
#menu a:hover { border-top:#962929 8px solid; margin-top:0; color:#333}
#menu a.active { border-top:#962929 8px solid; margin-top:0; color:#333}
#menu a.visited { border-top:#962929 8px solid; margin-top:0; color:#333}
#main {background-color:#22282a}
section { clear:both; margin:0; padding:0; background-color:#22282a; padding-top:50px;  }
section  h3,  #sluzbytxt, #onastxt { padding-left:calc(5% - 30px); padding-right:calc(5% - 30px)} 
#uvod { padding-top:0;}
#uvod img { width:100%; padding:0}
#sluzby { background-color:white; padding-top:0 !important; padding-left:0  }
#sss { display:none;}
#h2sl { padding-top:50px; }
#sluzby h2 {color:black;border-left:2px solid black;}
#sluzbyimgaaa { width:calc(50% - 10px); padding-left:0px; padding-right:10px;  overflow: hidden; 
  
  }
#sluzbytxt  { max-width:90% !important }
#onas p { padding-left:25px; color:white; padding-right:25px }
#onasimg  { width:33%; float:right; padding-right:0px; padding-left:50px}
#sluzbyimg  { width:calc(50% - 50px); float:right; padding-right:0px; padding-left:50px;  min-height: 890px;
    object-fit: cover;}
#onasimg2  { display:none}
#sluzbyimg2  { display:none}
.azoom {             transition: transform 0.8s ease, box-shadow 0.3s ease;
}
.azoom:hover {          transform: translateY(-20px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}
.zoom {  /* [1.2] Hide the overflowing of child elements */ 
 /* [1.1] Set it as per your need */
  overflow: hidden;
}

/* [2] Transition property for smooth transformation of images */
.zoom img { transition: transform .5s ease; width:100%
  
}

/* [3] Finally, transforming the image when container gets hovered */
.zoom:hover img {transform: scale(1.5);
  
}
.zoom3 {  /* [1.2] Hide the overflowing of child elements */ 
 /* [1.1] Set it as per your need */
  overflow: hidden;
}

/* [2] Transition property for smooth transformation of images */
.zoom3 img { transition: transform 2.5s ease; width:100%; overflow: hidden;
  
}

/* [3] Finally, transforming the image when container gets hovered */
.zoom3:hover img {transform: scale(1.5); overflow: hidden;
  
}
.zoom1 {  /* [1.2] Hide the overflowing of child elements */ 
 /* [1.1] Set it as per your need */
  overflow: hidden;
}

/* [2] Transition property for smooth transformation of images */
.zoom1 img { transition: transform 2.5s ease; width:100%
  
}

/* [3] Finally, transforming the image when container gets hovered */
.zoom1:hover img {transform: scale(1.5);
  
}
.arfotopopis { position:absolute;  background-color:rgba(0,0,0,0.40); color:#fff; z-index:1; padding-top:0px; bottom:0px; width:100%;display:block; margin-bottom:0px; font-weight:bold; font-size: 18px}
.arfoto0d { width:calc(33.3% - 4px);float:left;border:2px solid #000; border-bottom:0; position:relative;  text-align:left; display:inline-table; }
.arfoto0d img {
   }
.arfoto0d img:hover {    }
.arfoto0d:hover .arfotopopisaaaa {transition: transform .5s ease;transform: translateY( 20px);
  
}

.arfoto0dg { width:calc(33% - 4px);border:2px solid #000;border-bottom:0; overflow:hidden;    text-align:left; display:inline-table; }
.arfoto0dg img {width:calc(100%);overflow:hidden; cursor:pointer   
   }
.arfoto0dg img:hover { overflow:hidden;      }
.arfoto0dg:hover .arfotopopisaaaa {transition: transform .5s ease;transform: translateY( 20px);overflow:hidden;   
  
}
#galerie{ clear:both; text-align:center; background-color:black  }
#galerie h2 { text-align:left}
#reference { background-image:url(images/ref.jpg);  background-repeat:no-repeat !important; background-size:cover}
#kontaktdiva { background-image:url(images/4.jpg); background-repeat:no-repeat; background-size:cover; padding-top:0; }
#kontaktdiv { background-image:url(images/4.jpg); background-repeat:no-repeat; background-size: cover; background-position:center center;  padding-bottom:10px; padding-top:0; }
#kontaktdiv h2 { margin-top:50px}
#kontaktdiv p {  padding-top:50px;color:white; text-align:left; padding-left:0; font-family:'gothic' }
.sociali {float:left;  border-radius: 15px; text-align:center; width: 30px; height:28px; line-height:30px;padding-top:2px;border:1px solid white;   vertical-align: middle}
#kontaktdiv i { color:white; font-size: 18px;  }
#k { padding-right:25px; padding-top:55px; float:right;}
#k1, #k2, #k3 { margin-left:45px; color:white}
#k1 p { padding:0 !important; margin:0 !important}
#k2, #k3 {  padding-top:5px}
#k4 {text-align:center; padding-top:35px; clear:both; width:150px; margin-left:auto; margin-right:auto}
#k4 .sociali {margin-left:10px;}
#galleria { background-color:black; color:white; text-align:center}
#galleria h2 {  margin-bottom:0; text-align:left}
#galleria h2:focus {transition: transform .5s ease;transform: translateY( 20px)}
#bottimg {z-index:10 !important; position:absolute; width:100%; border:0px solid red;}
.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 40px;
  right: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: #962929 url(images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: visible;
  opacity: 1; z-index:1000;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}

.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity 1 0s, visibility 0s 0s;
  -moz-transition: opacity 1 0s, visibility 0s 0s;
  transition: opacity 1 0s, visibility 0s 0s;
}
.cd-top:hover { background-color:#000; background-image:url(images/cd-top-arrowh.svg) }
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}

.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  /*opacity: .5;*/
}

.no-touch .cd-top:hover {
  background-color: #a6ce39;
  opacity: 1;
}
.brcle {clear:both}



.brand-carousel {
background: inherit;
margin-top: 0%;
}
.single-logo { min-width:600px; padding:10px; max-width:40%; margin-left:auto; margin-right:auto;  padding-top:2em; background-image:url(images/quot.png); background-repeat:no-repeat; background-position:top left; background-size:2em}

	.hamburger { display:none; color:black; font-size:25px}
	#menuh {display:none}
	#administrace { position:fixed; top:0; background:#000000}
/*.detail { text-align:left; padding-left:5%; padding-right:5%; padding-top:10px; padding-bottom:25px; width:100%;}
.detail{}.detail .pars{margin-left:0;margin-right:0;width:90%;}

.detail{display:flex;flex-flow:row wrap}.detail .pars{display:flex;flex:0 0 auto;flex-flow:row wrap;margin-left:0;margin-right:0;width:100%;}


@media print,screen and (min-width:44.5em){.detail .par0s{flex:0 0 auto;margin-left:0;margin-right:0;width:90%}
.detail { text-align:left; padding-left:5%; padding-right:5%; padding-top:10px; padding-bottom:25px; width:50%; float:left}
} 
.detail .pars .detail-par{flex:0 0 auto;margin-left:.625rem;margin-right:.625rem;min-height:0;min-width:0;width:calc(100% - 1.25rem); border-bottom:1px solid white; padding-bottom:5px; padding-top:5px; line-height:1.5em}
@media print,screen and (min-width:44.5em){.detail .pars .detail-pa0r{flex:0 0 auto;margin-left:0;margin-right:0;width:100%}
#galleria .popis{ }
} 


@media print,screen and (min-width:42.5em){.detail .pars{flex:0 0 auto;margin-left:0;margin-right:0;width:50%}} .detail .pars .detail-par{flex:0 0 auto;margin-left:.625rem;margin-right:.625rem;min-height:0;min-width:0;width:calc(100% - 1.25rem); border-bottom:1px solid white; padding-bottom:5px; padding-top:5px; line-height:1.5em}@media print,screen and (min-width:42.5em){.detail .pars .detail-par{flex:0 0 auto;margin-left:0;margin-right:0;width:50%}}.detail .popis{flex:0 0 auto;margin-left:.625rem;margin-right:.625rem;min-height:0;min-width:0;width:calc(100% - 1.25rem)}@media print,screen and (min-width:42.5em){.detail .popis{flex:0 0 auto;margin-left:.9375rem;margin-right:.9375rem;width:calc(50% - 1.875rem)}}

*/
.detail { font-size:0.9em; text-align:left; padding-left:5%; padding-right:5%; padding-top:10px; padding-bottom:25px}
.detail{display:flex;flex-flow:row wrap;}


.detail .pars{display:flex;flex:0 0 auto;flex-flow:row wrap;margin-left:0;margin-right:0;width:100%;}@media print,screen and (min-width:42.5em){.detail .pars{flex:0 0 auto;margin-left:0;margin-right:0;width:100%}} .detail .pars .detail-par{flex:0 0 auto;margin-left:.625rem;margin-right:.625rem;min-height:0;min-width:0;width:calc(100% - 1.25rem); border-bottom:1px solid white; padding-bottom:5px; padding-top:5px; line-height:1.5em}@media print,screen and (min-width:42.5em){.detail .pars .detail-par{flex:0 0 auto;margin-left:0;margin-right:0;width:33%}} @media print,screen and (min-width:850000em){.detail .pars .detail-par{flex:0 0 auto;margin-left:0;margin-right:0;width:100%}.detail .pars{flex:0 0 auto;margin-left:0;margin-right:0;width:33%}} .detail .popisaa{flex:0 0 auto;margin-left:.625rem;margin-right:.625rem;min-height:0;min-width:0;width:calc(100% - 1.25rem);border:red 1px solid}@media print,screen and (min-width:42.5em){.detail .popisaa{flex:0 0 auto;margin-left:.9375rem;margin-right:.9375rem;width:calc(50% - 1.875rem); }}
.detail .popis  { padding-left:10px; padding-right:10px; max-width:90%;}

#galleria  .popis0{;min-height:0;min-width:0;width:calc(100% - 1.25rem)}@media print,screen and (min-width:44.5em){#galleria  .popis0{flex:0 0 auto;margin-left:.9375rem;margin-right:.9375rem;width:calc(50% - 1.875rem)}}
#galleria  .popis { text-align:left; margin-left:5%; margin-right:5%; font-size:0.9em;  text-align:justify}
#galleria .popis p { padding-left:0px; padding-right:10px}
#galleria .back { max-width:48px; padding-top:5px}
#galleria .back:hover {opacity:0.5}

@media only screen and (max-width: 1200px) {
.single-logo { min-width:300px; padding:10px; max-width:calc(49% - 20px); margin-left:auto; margin-right:auto; border:0px solid rgba(207,207,207,1.00)}

}
@media only screen and (max-width: 800px) {
.single-logo { min-width:90%;padding:5%; max-width:calc(90% - 10px); margin-left:auto; margin-right:auto; border:0px solid rgba(207,207,207,1.00); margin-right:10px}
.ccc { float:none}
.cccc {display:block; width:90%}
.cccc p { font-size:0.8em}
}
@media only screen and (max-width: 1200px) {
    .arfoto0d { width:calc(50% - 8px);  }
    .arfoto0dg { width:calc(50% - 8px);  }
#kontaktdiv { background-image:url(images/4-1.jpg)}

}

@media only screen and (max-width: 980px) {
#sluzby { background-image:none   }
#sluzbytxtaaa { width:90%; float:none}
#sss { width:100%; padding-left:0px; padding-right:0px;  overflow: hidden; display:block}
#onasimg  { display:none}
#onasimg2  { display:block; width:100%; float:none; padding-right:0px; padding-left:0px}
#sluzbyimg  { display:none}
#sluzbyimg2  { display:block; width:100%; float:none; padding-right:0px; padding-left:0px}
#sluzbydiv--- {  width:100%}
#menu { padding-right:2%;}
#menu a { width:auto; font-size:  11px; display:block; float:left; text-transform:lowercase; text-align:center; padding-top:60px;  text-decoration:none; padding-left:20px; padding-right:20px; padding-bottom:15px; margin-top:8px; font-weight:bold; color:#333}
#bottimg {
    min-height: 500px;
    object-fit: cover;
  }

}
@media only screen and (max-width: 800px) {
html {font-size:100%;text-align:justify;}
	h2 { font-size:1.3em; padding-top:10px; padding-bottom:10px}
ul li { text-align:justify}
#menu { display:none}
	.hamburger { display: block; float:right; padding-right:10px; padding-top:10px; color:black; font-size:36px}
	#menuh {display:none; width:100%; z-index:1; top:-50px; position:relative; right:15px; background-color:white; padding-left:5px; padding-right:5px}
		
	#menuh a { display:block; z-index:1; text-align:right; color:#000; padding-right:5px; text-transform:lowercase; border-right:#fff 2px solid; padding-bottom:3px; padding-top:2px}
#menuh a:link { color:#000; border-right:#fff 2px solid;}
#menuh a:hover { border-right:#962929 2px solid; margin-top:0; color:#333}
#menuh a.active { border-right:#962929 2px solid; margin-top:0; color:#333}
#menuh a.visited {  color:#000}
 section img {
    min-height: 290px;
    object-fit: cover;
  }
  #uvod img {
    min-height: 180px;
   ---object-fit: inherit;
  }
#kontaktdiv { background-image:url(images/4-2.jpg)}
}



@media only screen and (max-width: 600px) {
  html {font-size:70%;text-align:justify;}
  .arfoto0d { width:calc(100% - 4px);  }
    .arfoto0dg{ width:calc(100% - 4px);  }
p { text-align:justify }	


}
@media only screen and (max-width: 400px) {


}
.animate {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

.one {
  -webkit-animation-delay: 0.5s;
  -moz-animation-delay: 0.5s;
  animation-delay: 0.5s;
}