@import "print.css";
@media all and (max-width: 720px) {}

:root {

	--fontFamily:  'Roboto',Arial,Helvetica,"Nimbus Sans L",sans-serif;
	--transitionAll:.3s all ease-in-out;
	--transitionTop:.3s top ease-in-out;

	--radius: 20px;

/* colors */

	--dark: #1C2D2B;
	--dark_48:#929b9a;

	--light:#F8FCFC;
	--primary:#60C2B6;
	--primary_48: #afe0db;

	--primarydark_48: #3d746e;
	--darklight_16: #3f4e4d;
	--lightBg:#f4fbfa /*#f9fdfd*/;

	--darkrgb: 28,45,43;
	--lightrgb:248,252,252;
	--primaryrgb:96,194,182;

	--white:#ffffff;


	--bgform: var(--light);
	--textColor: rgba(var(--darkrgb),0.8);
	--hColor: var(--dark);

	--hr:var(--dark_48);
	--border: rgba(var(--primaryrgb), 0.48);

	--link: var(--primary);
	--linkHover: var(--primarydark_48);



	--buttonColorText:var(--light);
	--buttonColor:var(--primary);
	--buttonColorBg:var(--primary);

	--buttonColorTextHover:var(--light);
	--buttonColorHover:var(--primarydark_48);
	--buttonColorBgHover:var(--primarydark_48);



/* gap */

	--mezera:clamp(80px, 6.25vw, 120px);

	--gapbig: var(--mezera);
	--gapbigminus: calc(var(--mezera) * -1);
	--gap: calc(var(--mezera) * 0.5);
	--gapminus: calc(var(--mezera) * -0.5);
	--gapsmall: calc(var(--mezera) * 0.25);
	--gapsmallminus:calc(var(--mezera) * -0.25);
	--gapsmaller:calc(var(--mezera) * 0.125);
	--gapsmallerminus:calc(var(--mezera) * -0.25);
	--gapsmallest:calc(var(--mezera) * 0.0625);
	--gapsmallestminus:calc(var(--mezera) * -0.0625);

	--center: 1720px;
	--centernorrow: 1000px;

	--centerpadding: var(--mezera);
	--centerpaddingminus:calc(var(--mezera) * -1);

/* font size */

	--h1:64px;
	--h2:48px;
	--h3:32px;
	--h4:24px;

	--basic:16px;
	--big:20px;
	--big2:20px;
	--smaller:14px;

	--small:12px;

/* formáty textu */

	--button: var(--basic);
	--buttonPadding: 15px 25px;

	--menusize: var(--basic);
	--menusize2: var(--basic);

	--label: var(--basic);
	--basictext: var(--basic);
	--tabletext: var(--basic);

/* view */

	--v4sirka:calc(25% - calc(var(--gapsmall) * 3 * 0.25) );
	--v3sirka:calc(33.33% - calc(var(--gapsmall) * 2 * 0.3333) );
	--v2sirka:calc(50% - calc(var(--gapsmall) * 1 * 0.5) );

 

}


@media all and (max-width: 1500px) {

:root{
--v4sirka: calc(33.333% - calc(var(--gapsmall) * 2 * 0.3333) );
}

}

@media all and (max-width: 720px) {

:root{

	--mezera:60px;


	--v4sirka: calc(50% - calc(var(--gapsmall) * 0.5) );
	--v3sirka:calc(50 - calc(var(--gapsmall) * 0.5) );

	--centerpadding: 30px;
	--centerpaddingminus:-30px;

 	--buttonPadding: 10px 20px;

	--h1:40px;
	--h2:32px;
	--h3:24px;
	--h4:20px;

	--basic:16px;
	--big:18px;
	--big2:16px;

	--small:12px;

	--menusize: var(--big);
	--menusize2: var(--basic);
	--menusize3: calc(var(--basic) *  0.9 );


}

}
 
@media all and (max-width: 500px) {
:root{
--v3sirka:100%;
--v4sirka: 100%;
}
}

#main{
overflow:hidden;
}

body{
margin:0px;
padding:0px;
font-weight: 400;
font-family: var(--fontFamily);
font-size: var(--basictext);
line-height: 1.5em;
color: var(--textColor);
background: var(--dark);
min-width:1200px;
scroll-behavior: smooth;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}


@media all and (max-width: 720px) {

body{
min-width:0px;
}

}
/*
[data-once="ajax-pager"] {
scroll-margin-top: 25rem;
}
*/
.layout-container{
   background: var(--lightBg);
}

.layout-content {
padding-bottom:var(--gapbig);
padding-top:var(--gapbig);
}

/*==================================================================================================================================
		bg
==================================================================================================================================*/

.darkbg {
  background: var(--primary);
  color: var(--textColor);
  --textColor: var(--white);
  --hColor: var(--white);
  --buttonColorText: var(--white);
  --buttonColor: var(--dark);
  --buttonColorBg: var(--dark);
  --buttonColorTextHover: var(--light);
  --buttonColorHover: var(--primarydark_48);
  --buttonColorBgHover: var(--primarydark_48);

strong{color:var(--white;);}

}

blockquote,
.darkbg {

h2{font-size:var(--h3);}

}



/*==================================================================================================================================
		center
==================================================================================================================================*/

.paragraph--position--center_narrow  > .paragraph-content,
.path-user .layout-content,
#block-drualas-theme-primary-local-tasks .inner-block,
.paragraph--position--centred > .paragraph-content,
.body-center,
.paragraph-form,
.center,
#cookies-docs{width: 100%;
max-width:var(--center);margin:0px auto;padding-left:var(--centerpadding);padding-right:var(--centerpadding);
  position: relative;
}

.center_narrow  ,
.paragraph--position--center_narrow  > .paragraph-content{
max-width:var(--centernorrow);width: 100%;
margin:0px auto;padding:0px  var(--centerpadding);
  position: relative;
}

.paragraph--position--center_narrow > .paragraph-content .paragraph--position--centred > .paragraph-content,
.paragraph--position--center_narrow  > .paragraph-content  .paragraph--position--center_narrow  > .paragraph-content, 
.center  .paragraph--position--center_narrow  > .paragraph-content, 
.center .paragraph--position--centred > .paragraph-content,
.center .center,
.paragraph--position--centred .paragraph--position--center_narrow  > .paragraph-content, 
.paragraph--position--centred > .paragraph-content .paragraph--position--centred > .paragraph-content{padding:0px;}

/*==================================================================================================================================
		odsazeni
==================================================================================================================================*/

.margin_top,
.odsazeni_zhora{margin-top:var(--gap);}

.margin_bottom,
.odsazeni_zespoda{margin-bottom:var(--gap);}

.margin_top_big{margin-top:var(--gapbig);}
.margin_bottom_big{margin-bottom:var(--gapbig);}

.margin_top_small{margin-top:var(--gapsmall);}
.margin_bottom_small{margin-bottom:var(--gapsmall);}


.padding_top_big{padding-top:var(--gapbig);}
.padding_bottom_big{padding-bottom:var(--gapbig);}
.padding_top{padding-top:var(--gap);}
.padding_bottom{padding-bottom:var(--gap);}
.padding_top_small{padding-top:var(--gapsmall);}
.padding_bottom_small{padding-bottom:var(--gapsmall);}

@media all and (max-width: 720px) {

.mobilepaddingtopzero{padding-top:0;}

.mobilepaddingbottomzero{padding-bottom:0;}

}


/*==================================================================================================================================
		header
==================================================================================================================================*/


#header{
width:100%;
position:fixed;
top:0px;left:0px;
	-webkit-transition: var(--transitionAll);
	-moz-transition:var(--transitionAll);
	-o-transition:var(--transitionAll);
	-ms-transition:var(--transitionAll);
	transition: var(--transitionAll);
-webkit-box-shadow: 0px 16px 96px 0px rgba(var(--darkrgb),0); 
box-shadow: 0px 16px 96px 0px rgba(var(--darkrgb),0);
background:var(--light);
  z-index: 10;
}

.scrolltop2 #header{
-webkit-box-shadow: 0px 16px 96px 0px rgba(var(--darkrgb),0.24); 
box-shadow: 0px 16px 96px 0px rgba(var(--darkrgb),0.24);
}

.region-header{
  gap: 0px 40px;
max-width: var(--center);
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
	-webkit-transition: var(--transitionAll);
	-moz-transition:var(--transitionAll);
	-o-transition:var(--transitionAll);
	-ms-transition:var(--transitionAll);
	transition: var(--transitionAll);
  padding:10px var(--centerpadding);
}

.user-logged-in #header{
top: 80px;
}


#block-drualas-theme-site-branding{
  flex-shrink: 0;
}

a.site-logo{
 line-height: 1px;
display:block;
}

a.site-logo img{
height:55px;
    -webkit-transition: .3s all ease-in-out;
    -moz-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    -ms-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
}


.scrolltop2 a.site-logo img{
height:46px;
}



@media all and (max-width: 720px) {
 
a.site-logo img,
.scrolltop2 a.site-logo img{
height:46px;
}

}

/*==================================================================================================================================
	header bg
==================================================================================================================================*/

.header-around{
  position: relative;
padding-top:70px;
}

.region-highlighted{
  display: flex;
  align-items: start;
  justify-content: center;
  flex-direction: column;

	position: relative;
	padding:   var(--gapbig) 0px;
	--textColor: var(--light);
	--hColor: var(--light);
	h1{margin:20px 0px;}
}

.header-around-bgaround {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.header-around-bg {
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  animation: showSlide 15000ms infinite ease;
  -webkit-transform-origin: right center 0;
  -moz-transform-origin: right center 0;
  -o-transform-origin: right center 0;
  -ms-transform-origin: right center 0;
  transform-origin: right center 0;
  -moz-transform: scale(1.05);
  -webkit-transform: scale(1.05);
  -o-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
}

.nema .header-around-bg {
  background-image: url(../images/default.webp);
}




.header-around-bg::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
background: linear-gradient(90deg,rgba(28, 45, 43, 0.8) 0%, rgba(28, 45, 43, 0) 75%);

}

.header-around-bg::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
background: linear-gradient(0deg,rgba(28, 45, 43, 0.8) 0%, rgba(28, 45, 43, 0) 75%, rgba(28, 45, 43, 0.09) 100%);
}

/*==================================================================================================================================
		second menu
==================================================================================================================================*/

.second-menu{
  display: flex;
  justify-content: end;
  align-items: center;
gap:20px;
}

.telefon{
text-align:left;
  flex-shrink: 0;
}

.telefon a{

text-decoration:none;
}

.popisek{
  font-size: var(--small);
  line-height: 1em;
  color: var(--textColor);
}

/*==================================================================================================================================
		footer
==================================================================================================================================*/

.region-bottom{
  --link: var(--light);
  --linkHover: var(--primary);
  --textColor: rgba(var(--lightrgb),0.8);
  --hColor: var(--light);

  color: var(--textColor);  

  padding:var(--gap) 0px;

  a{text-decoration:none;}
  p{margin:0px;}

}

.region-bottom .center{
 
}

/* paticka menu */

footer .menu{
border-top:1px solid rgba(var(--lightrgb),0.16);
  margin: var(--gap) 0px 0px;
  list-style: none;
  padding: var(--gap) 0px 0px;
  display: flex;
  gap: var(--gapsmall);
  justify-content: space-around;
  width: 100%;
}


footer .menu li{

}

footer .menu li a{
font-weight:700;
}


@media all and (max-width: 720px) {

.region-bottom .center {
  text-align: center;
}

footer .menu{
  justify-content: center;
  flex-wrap: wrap;
}
  
}


/*==================================================================================================================================
		total bottom
==================================================================================================================================*/

.region-totalbottom{
border-top:1px solid rgba(var(--lightrgb),0.16);
  --link: var(--light);
  --linkHover: var(--primary);
  --textColor: rgba(var(--lightrgb),0.8);
color: var(--textColor);  

a{text-decoration:none;}
p{margin:0px;}

}

.region-totalbottom .field--name-body{
padding:var(--gap) 0px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px 20px;
}

@media all and (max-width: 720px) {

.region-totalbottom .field--name-body{
  justify-content: center;  flex-wrap: wrap;    text-align: center;

}

.region-totalbottom .field--name-body p{width:100%;}

.region-totalbottom .field--name-body span{
display:block;
}


.region-totalbottom .field--name-body p:nth-child(2){order:99;}

}

.socs {
  gap:10px;
  display: flex;
}




.socs a{
background-position:center center;
background-repeat:no-repeat;
background-size:auto 20px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
border:1px solid var(--primary);
background-color:var(--primary);
  width: 48px;
  height: 48px;
  line-height: 100em;
  overflow: hidden;
  display: block;


  position: relative;
  z-index: 1;

&:focus,
&:hover{
border:1px solid var(--primarydark_48);
background-color:var(--primarydark_48);
}

}

.socs a[href*="facebook"]{background-image:url(../images/fb-a.svg);}
.socs a[href*="instagram"]{background-image:url(../images/insta-a.svg);}
.socs a[href*="x.com"],
.socs a[href*="twitter"]{background-image:url(../images/x-a.svg);}
.socs a[href*="linkedin"]{background-image:url(../images/linked-a.svg);}
.socs a[href*="youtube"]{background-image:url(../images/you-a.svg);}


/*==================================================================================================================================
	view clanky
==================================================================================================================================*/

.viewrows .view-content{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: inherit;
gap:var(--gapsmall);
}

.viewcol4 > .view-content .views-row{
  width: var(--v4sirka);
}

.viewcol3 > .view-content .views-row{
  width: var(--v4sirka);
}


.viewslider .view-content {
display:flex;  margin: 0px calc(-24px - var(--gapsmaller));
}

.node-aktualita .field--name-field-topimage{
margin-top:var(--gapbig);
line-height:1px;overflow:hidden;
  -webkit-border-radius: var(--radius);
  -moz-border-radius: var(--radius);
  border-radius: var(--radius);
}


.viewslider .view-content > .views-row{display:none;}

@media all and (min-width: 1500px){

.viewslider .view-content > .views-row:nth-child(4),
.viewslider .view-content > .views-row:nth-child(3),
.viewslider .view-content > .views-row:nth-child(2),
.viewslider .view-content > .views-row:nth-child(1){display:flex;}

}

@media all and (max-width: 1500px) and (min-width: 721px) {

.viewslider .view-content > .views-row:nth-child(3),
.viewslider .view-content > .views-row:nth-child(2),
.viewslider .view-content > .views-row:nth-child(1){display:flex;}


}


@media all and (max-width:720px) and (min-width: 581px) {

 
.viewslider .view-content > .views-row:nth-child(2),
.viewslider .view-content > .views-row:nth-child(1){display:flex;}

}


@media all and (max-width: 580px) {

 
 
.viewslider .view-content > .views-row:nth-child(1){display:flex;}

}


@media all and (max-width: 720px) {

.viewslider .view-content {
 margin: 0px calc(-10px - var(--gapsmaller));
}

}




/*==================================================================================================================================
	reference
==================================================================================================================================*/

.slickrecenze{
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

.slickrecenze > .view-content{
  margin: 0px calc(-24px - var(--gapsmaller));
}

.slickrecenze > .view-content > .views-row{display:none;}

.slickrecenze > .view-content > .views-row:nth-child(2),
.slickrecenze > .view-content > .views-row:nth-child(1){display:flex;}


.teaser-recenze{
width:100%;
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: var(--radius);
  -moz-border-radius: var(--radius);
  border-radius: var(--radius);
  overflow: hidden;
  text-decoration: none;
padding:var(--gap);
    text-align: center;
  flex-direction: column;

.field--name-body{font-style:italic;}

 h3{margin:0px;
    font-size: var(--big);
    line-height: 1.2em;
  }

.field--name-field-ikona{
    width: 200px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;margin-bottom:10px;
}

.field--name-field-ikona img{
    max-height: 100%;
}


}


.marquee-content { display: inline-flex; will-change: transform;   align-items: center;
}


.refline .view-content{ 
overflow: hidden; white-space: nowrap; cursor: grab; touch-action: pan-y; 
margin:0px 0px var(--gap);  display: flex;

}

.refline .view-content:active { cursor: grabbing; }


.view-reference.view-display-id-attachment_1{
}

.view-reference.view-display-id-attachment_1 .view-content {
  display: flex;
  flex-wrap: wrap;align-items:center;
  justify-content: center;
  gap: var(--gap);
margin:0px 0px var(--gap);

}

.refline .view-content .views-row{
  display: flex;align-items:center;justify-content:center;
margin:0px var(--gapbig);
height:100px;
}

.refline .views-row.navysku  {
}



.refline .views-row img{
filter:grayscale(100%);  height:100px;max-width:unset;
}

.refline .views-row.nasirku img {
height:60px;
}



.view-reference.view-display-id-attachment_1 .views-row{
    width: 200px;
    height: 100px;
  display: flex;
margin:0px 20px;
  justify-content: center;
  align-items: center;
}

.view-reference.view-display-id-attachment_1 .views-row img{
filter:grayscale(100%);    max-height: 100%;

}

.refline .views-row img:hover,
.view-reference.view-display-id-attachment_1 .views-row img:hover{
filter: grayscale(0%);
}


@media all and (max-width: 720px) {

.refline .view-content .views-row {
  margin: 0px var(--gap);
  height: 70px;
}


.refline .views-row img{
height:70px;
}

.refline .views-row.nasirku img {
height:40px;
}


}

 
/*==================================================================================================================================
	prostý výpis log
=================================================================================================================================*/


.refline2 .view-content{ 
overflow: hidden; white-space: nowrap;  
margin:0px 0px;  display: flex;
  flex-wrap: wrap;
  gap: var(--gap) var(--gapbig); 

  justify-content: center;
}

.refline2 .view-content .views-row{
  display: flex;align-items:center;justify-content:center;
margin:0px  ;
height:100px;
}

.refline2 .views-row img{
filter:grayscale(100%);  height:100px;max-width:unset;
}

.refline2 .views-row.nasirku img {
height:60px;
}
 

.refline2 .views-row img:hover{
filter: grayscale(0%);
}



/*==================================================================================================================================
	main reference
==================================================================================================================================*/

.mainrecenze .view-content{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: inherit;
  gap: var(--gap);

}

.mainrecenze .view-content .views-row{
width:calc(50% - (var(--gap) * 0.5));  display: flex;
}

@media all and (max-width: 650px) {

.mainrecenze .view-content .views-row {
  width: 100%;
}

}

/*==================================================================================================================================
	view proč my
==================================================================================================================================*/

.paragraph--type--view  .view-proc-my{
padding:var(--gap) var(--gapsmall);
  background: var(--white);
  display: flex;
  align-items: inherit;
  justify-content: space-between;
  -webkit-border-radius: var(--radius);
  -moz-border-radius: var(--radius);
  border-radius: var(--radius);
  overflow: hidden;
}

.view-proc-my .view-content {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: start;
gap:var(--gapsmall);
text-align:center;
}

.view-proc-my .view-content > div{
width:calc(25% - (var(--gapsmall) * 3 * 0.25 + 1px));
} 

#block-drualas-theme-oblasti  .view-proc-my .view-content > div,
#block-oblasti .view-proc-my .view-content > div{
width:calc(50% - (var(--gapsmall) * 1 * 0.5));
} 

.procmy{

.field--name-field-ikona img{
height:32px;
}

h3{
    margin: 10px auto;
font-size:var(--big);line-height:1.2em;
}

}


@media all and (max-width: 720px) {

.procmy{
h3{    font-size: var(--basic);}
}

.view-proc-my .view-content > div{
width:calc(50% - (var(--gapsmall) * 1 * 0.5));
} 



}


/*==================================================================================================================================
	share
==================================================================================================================================*/

.share-info{
  gap: var(--gapsmaller);
  padding: var(--gapsmall) var(--gap);
  background: var(--primary);
  color: var(--light);
  display: flex;
  justify-content: space-between;
  align-items: center;
  -webkit-border-radius: var(--radius);
  -moz-border-radius: var(--radius);
  border-radius: var(--radius);
  margin: var(--gapbig) auto;
 }

h3.share-title{
color:var(--light);margin:0px;
}

.share-box{
  display: flex;
  gap: var(--gapsmaller);
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

a.share {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: auto 20px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid var(--light);
  background-color: var(--primary);
  width: 48px;
  height: 48px;
  line-height: 100em;
  overflow: hidden;
  display: block;
  position: relative;
  z-index: 1;
}

a.share:hover,
a.share:focus {
background-color:var(--dark);
border-color:var(--dark);
}

a.share1{  background-image: url(../images/fb-a.svg);}
a.share2{  background-image: url(../images/insta-a.svg);}
a.share3{  background-image: url(../images/linked-a.svg);}
a.share4{ background-image: url(../images/mail-w.svg);background-size: 20px auto ;}
a.share5{ background-image: url(../images/icon-print.svg);background-size: 20px auto ;}



@media all and (max-width: 720px) {

.share-info{
  justify-content: center;  flex-wrap: wrap;
}

}




/*==================================================================================================================================
	další články
==================================================================================================================================*/

.region-content > .views-element-container > h2{
text-align:center;
}


/*==================================================================================================================================
	oblasti - blok
==================================================================================================================================*/

.region-content > .views-element-container,
#block-drualas-theme-oblasti{
  width: 100%;
  max-width: var(--center);
  margin: var(--gapbig) auto 0px auto;
  padding-left: var(--centerpadding);
  padding-right: var(--centerpadding);
  position: relative;
}

#block-drualas-theme-oblasti,
#block-oblasti{
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  align-items: center;
  gap: var(--gap);

>h2{width:100%;text-align:center;margin-bottom:0;
    max-width: 800px;
    margin-right: auto;
    margin-left: auto;
}

}

#block-drualas-theme-oblasti  > div,
#block-oblasti > div{
width:calc(50% - (var(--gap) * 0.5));
}

@media all and (max-width: 720px) {

#block-drualas-theme-oblasti  > div,
#block-oblasti > div{
width:100%;
}



}


/*==================================================================================================================================
	teaser
==================================================================================================================================*/

.token-service{
text-align:center;
}

.token-service,
.teaser-article{
  background: var(--white);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  color: var(--textColor);
  text-decoration: none;
overflow:hidden;

h3{
margin:0px 0px 10px;
font-size:var(--big);line-height:1.2em;
      -webkit-transition: .3s all ease-in-out;
      -moz-transition: .3s all ease-in-out;
      -o-transition: .3s all ease-in-out;
      -ms-transition: .3s all ease-in-out;
      transition: .3s all ease-in-out;
}

&:focus h3,
&:hover h3{
  color: var(--primary);
}

.field--name-field-ikona{
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
    margin: -32px auto 0px;
    position: relative;
    z-index: 1;
    background: var(--white);

img{max-height:40px;width:auto;}
}

.button{
  padding:0px var(--gapsmall) var(--gapsmall);
    margin: auto 0px 0px;width:100%;

}

.token-service-img,
.button span{width:100%;}
 

}

.teaser-article{
  justify-content: start;
}

.view-header h2{margin:0px;}

.view-footer{
  margin-bottom: 20px;
}

.view-content .views-row {
  display: flex;
}

.teaser-img{
  width: 100%;
  margin: 0px 0px 0px;
}

.token-service p{margin:0px;}

.token-service-inner,
.teaser-inner{padding:var(--gapsmall);  width: 100%;}

a{

.field--name-field-topimage,
.field--name-field-viewimage{
	line-height:1px;overflow:hidden;
img{
width:100%;  object-fit: cover;
  -webkit-transition: .3s all ease-in-out;
  -moz-transition: .3s all ease-in-out;
  -o-transition: .3s all ease-in-out;
  -ms-transition: .3s all ease-in-out;
  transition: .3s all ease-in-out;
}


}



}
 

a:hover,a:focus {

.field--name-field-topimage,
.field--name-field-viewimage{

img{
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -o-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
  -webkit-transform-origin: center center 0;
  -moz-transform-origin: center center 0;
  -o-transform-origin: center center 0;
  -ms-transform-origin: center center 0;
  transform-origin: center center 0;
}
}
}




/*==================================================================================================================================
	main view services
==================================================================================================================================*/

.servicemain {

}

.servicemain .view-content{
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

.servicemain .view-content .views-row{

}


a.teaser-service{
  background: var(--white);
  display: flex;
  align-items: inherit;
  justify-content: space-between;
-webkit-border-radius: var(--radius);
-moz-border-radius: var(--radius);
border-radius: var(--radius);
overflow:hidden;
text-decoration:none;
  color: rgba(var(--darkrgb),0.8);

}

.teaser-service-img{
width:45%;
line-height: 1px;
overflow:hidden;
position:relative;
  display: flex;
  justify-content: inherit;
  align-items: inherit;

}


 

.teaser-service-img2{
      -webkit-transition: .3s all ease-in-out;
      -moz-transition: .3s all ease-in-out;
      -o-transition: .3s all ease-in-out;
      -ms-transition: .3s all ease-in-out;
      transition: .3s all ease-in-out;
  background-repeat:no-repeat;
background-position: center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
width:100%;
}

a:focus .teaser-service-img2,
a:hover .teaser-service-img2{
      -webkit-transform: scale(1.05);
      -moz-transform: scale(1.05);
      -o-transform: scale(1.05);
      -ms-transform: scale(1.05);
      transform: scale(1.05);
      -webkit-transform-origin: center center 0;
      -moz-transform-origin: center center 0;
      -o-transform-origin: center center 0;
      -ms-transform-origin: center center 0;
      transform-origin: center center 0;
}

.teaser-service-inner{
padding:var(--gapbig);
width:55%;align-self: center;
}


 .views-row:nth-child(even){

.teaser-service-img{order:2;}
.teaser-service-inner{order:1;}

}


@media all and (max-width: 720px) {

a.teaser-service{  flex-direction: column;}

.teaser-service-img {
  width: 100%;
}

.teaser-service-inner {
  padding:0px var(--gapsmall) var(--gapsmall);
  width: 100%;
    text-align: center;

 & .field--name-field-ikona {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 64px;
    height: 64px;
    margin: -32px auto 0px;
    position: relative;
    z-index: 1;
    background: var(--white);

img {
      max-height: 40px;
      width: auto;
    }

  }

.button span {
    width: 100%;
  }

}

.views-row:nth-child(2n) {
  & .teaser-service-img {
    order: 0;
  }
}

}

 /*==================================================================================================================================
	filtry
==================================================================================================================================*/

.bef-exposed-form .form--inline > .form-item, .bef-exposed-form .form--inline .js-form-wrapper > .form-item {
  float: none;
  margin: 0px;
}

.region-content .bef-links  ul{
  margin: 0px auto var(--gap);
  display: flex;  max-width: var(--centernorrow);
  gap:10px ;  flex-wrap: wrap;justify-content:center;
}

.region-content .bef-links  ul li{
  margin-bottom: 0px;
  padding-left: 0px;
}

.region-content .bef-links  ul li:before{
display:none; 
}


.bef-links ul a {
   font-family: var(--fontFamily);
  border: 1px solid var(--buttonColor);
  background-color: transparent;
  color: var(--primary);
  font-weight: 700;
  min-height: 0px;
  font-size: var(--button);
  line-height: 1em;
  padding: var(--buttonPadding); 
  margin: 0px;  text-align: center;
  text-decoration: none;
  display: inline-block;
 -webkit-transition: var(--transitionAll);
	-moz-transition:var(--transitionAll);
	-o-transition:var(--transitionAll);
	-ms-transition:var(--transitionAll);
	transition: var(--transitionAll);
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
}

.bef-links ul a:hover,
.bef-links ul a:focus{
   border-color: var(--buttonColorHover);
  background-color: var(--buttonColorBgHover);
  color: var(--buttonColorTextHover);
}

.bef-links ul a.bef-link--selected{
   border-color: var(--primarydark_48);
  background-color: var(--primarydark_48); 
  color: var(--light);
}

@media all and (max-width: 720px) {

.region-content .bef-links ul li{
width:calc(33.33% - (10px * 2 * 0.3333));
    display: flex;

a{
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

}

}

@media all and (max-width: 500px) {

.region-content .bef-links ul li{
width:calc(50% - (10px * 1 * 0.5));
}



}


/*==================================================================================================================================
	cenik
==================================================================================================================================*/

.viewcenik .view-content{
  max-width: var(--centernorrow);
  margin: auto;
}

.viewcenik .view-content .views-row{
display:block;
}


.field--name-field-cenik table,
.viewcenik table{
  width: auto;
  margin: 0px auto 20px;
}


.viewcenik .views-field-title h2{

display:flex;align-items:center;gap:var(--gapsmall);
justify-content:center;

img{width:50px;}

}

/*==================================================================================================================================
	serviceicons 
==================================================================================================================================*/

.serviceicons {
  border-bottom: 1px solid var(--border);
  padding-bottom: var(--gap );
}

.serviceicons .view-content{
  display: flex;
  justify-content: center;
  gap: var(--gap) var(--gap);
flex-wrap:wrap;
}

.serviceicons .view-content .views-row{
  width: calc(25% - (var(--gap) * 3 * 0.25));
  text-align: center;
  justify-content: center;
}


a.icon-service{
  text-align: center;
  display: block;
  color: var(--dark);
  text-decoration: none;
  font-weight: 700;

.field--name-field-ikona {
display:flex;justify-content:center;align-items:center;height:40px;margin-bottom:10px;
}

.field--name-field-ikona img{
max-height:40px;width:auto;
}

&:focus,
&:hover{  color: var(--primary);}
}

@media all and (max-width: 480px) {

.serviceicons .view-content .views-row{
  width: calc(50% - (var(--gap) * 0.5));
}

}


/*==================================================================================================================================
	Footer block
==================================================================================================================================*/

.region-footer{
background:var(--white);
padding:var(--gap ) 0px var(--gapbig);
}


#block-drualas-theme-kontakt{

  margin-top: var(--gap);
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
  justify-content: center;
  align-items: start;
}

.views-element-container + #block-drualas-theme-kontakt{
  margin-top: var(--gapbig);

}


#block-drualas-theme-kontakt > div{
  width: calc(50% - (var(--gap)*0.5));
}



.tel,.mail{
margin-bottom:20px;
background-repeat:no-repeat;
background-position:left 6px;
background-size:30px auto;
padding-left:40px;
font-size:var(--h3);line-height:1.2em;

a{text-decoration:none;}

}


.tel{background-image:url(../images/phone.svg);}

.mail{background-image:url(../images/mail.svg);}


@media all and (max-width: 720px) {

#block-drualas-theme-kontakt > div {
  width: 100%;
}


}




/*==================================================================================================================================
	Footer form
==================================================================================================================================*/

.webform-submission-form > div.form-type-tel label,
.webform-submission-form > div.form-type-textarea label,
.webform-submission-form > div.form-type-email label, 
.webform-submission-form > div.form-type-textfield label{
  -webkit-transition: .3s all ease-in-out;
  -moz-transition: .3s all ease-in-out;
  -o-transition: .3s all ease-in-out;
  -ms-transition: .3s all ease-in-out;
  transition: .3s all ease-in-out;
  position: absolute;
left:calc(var(--gapsmall) + 10px) ;
top:21px;
}

.webform-submission-form > div.form-type-tel.focused label,
.webform-submission-form > div.form-type-textarea.focused label,
.webform-submission-form > div.form-type-email.focused label,
.webform-submission-form > div.form-type-textfield.focused label{
   top: 11px;   font-size: var(--small);   

}


/*** captcha ***/


.captcha{
margin:0px 0px 20px;
}

.captcha legend{
  position: absolute !important;
  height: 1px !important;
  width: 1px !important;
  overflow:hidden;
  clip: rect(1px,1px,1px,1px);
}

.captcha input{width:292px;min-width:292px;max-width:292px;border:1px solid var(--border);   flex-shrink: 0;}

.captcha label:after{content:" PROMAX";font-weight:700;display:inline;color:var(--primary);}

.captcha label{ 
  -webkit-transition: .3s all ease-in-out;
  -moz-transition: .3s all ease-in-out;
  -o-transition: .3s all ease-in-out;
  -ms-transition: .3s all ease-in-out;
  transition: .3s all ease-in-out;
  position: absolute;
  left: var(--gapsmall);
  top: 21px;
}

.captcha .focused  label{
   top: 11px;      color: rgba(var(--darkrgb),0.48);  font-size:var(--small);

}


.captcha .form-item {
margin-bottom:0px;
  display: flex;
  justify-content: start;
  align-items: start;
gap:10px;
}

.captcha .description{
  align-self: center;   text-align: left;  padding: 0px;
}

.captcha .captcha__description{
display:none;
} 


@media all and (max-width: 720px) {

.captcha .form-item {
flex-wrap:wrap;
}


}

/*** messages ***/

.form-item--error-message{display:none;}

/*** confirm ***/

.webform-confirmation{
  text-align: center;
}

.webform-confirmation__message{
  font-size: var(--h2);  margin: 0px 0px 20px !important;
  font-weight: 700;    color: var(--primary);
}
 

.region-content .webform-confirmation__message{
color:var(--dark);
}


/*** form ***/


.webform-submission-form {
display:flex;margin:0px -10px;
flex-wrap:wrap;
justify-content:start;align-items:start;

.form-submit{width:100%;}

}

.webform-submission-form > fieldset,
.webform-submission-form > div{
padding:0px 10px 0px;width:100%;position:relative;
}

.webform-submission-form > div.webform-type-tel,
.webform-submission-form > div.form-type-email,
.webform-submission-form > div.form-type-textfield{
width:50%;
}

.form-item--error-message{display:none;}
 
.webform-confirmation{
  text-align: center;
}

.webform-confirmation__message{
  font-size: var(--h2);  margin: 0px 0px 20px !important;
  font-weight: 700;    color: var(--pink);
}
 

@media all and (max-width: 500px) {

.webform-submission-form > div.webform-type-tel,
.webform-submission-form > div.form-type-email, .webform-submission-form > div.form-type-textfield {
  width: 100%;
}

}



 /*==================================================================================================================================
	kariera
==================================================================================================================================*/


.procunas .field--name-field-body{

display:flex;flex-wrap:wrap;justify-content:center;align-items:inherit;
gap:var(--gapsmall);

h2{width:100%;}

p{
text-align:center;
width:calc(33.33% - (var(--gapsmall) * 2 * 0.3333));
  background: var(--white);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: var(--gapsmall);
 margin:0px;    gap: 5px;

 
}

}


.vyhodyonas .field--name-field-body{

display:flex;flex-wrap:wrap;justify-content:center;align-items:inherit;
gap:var(--gapsmall);

h2{width:100%;}

p{
text-align:center;
width:calc(25% - (var(--gapsmall) * 3 * 0.25));
  background: var(--white);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: var(--gapsmall);
 margin:0px;

}

}


@media all and (max-width: 720px) {

.vyhodyonas .field--name-field-body p,
.procunas .field--name-field-body p{
width:calc(50% - (var(--gapsmall) * 0.5));
 
strong{display:block !important;}
br{display:none !important;}

}

}

@media all and (max-width: 450px) {


.vyhodyonas .field--name-field-body p,
.procunas .field--name-field-body p{
width:100%;
}


}

 /*==================================================================================================================================
	o nas
==================================================================================================================================*/

.certifikaty{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

.certifikat{
max-width:300px;
}


@media all and (max-width: 450px) {

.certifikaty{
  flex-wrap: wrap;
}

.item-par-764{display:none;}

}

/*==============================================================================================================
	down 
==============================================================================================================*/

#downl a{
  z-index: 1;  content: "";
  display: block;
  position: absolute;
  width: 40px;
  margin: auto; 
  height: 40px;
  background: url(../images/arrow-down.svg) center center no-repeat var(--primary);
background-size:19px auto;
  bottom: 50px;
	-webkit-transition: var(--transitionAll);
	-moz-transition:var(--transitionAll);
	-o-transition:var(--transitionAll);
	-ms-transition:var(--transitionAll);
	transition: var(--transitionAll);
left: 50%;
  margin-left: -20px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
}

#downl a:focus,
#downl a:hover{
  background-image: url(../images/arrow-down.svg);
background-color:var(--primarydark_48);
}


@media all and (max-width: 720px) {

#downl{   display:none;}

}


/*==============================================================================================================
	slovník pojmů 
==============================================================================================================*/

.view-slovnik-pojmu{
.view-content{    justify-content: start;}

form .form--inline{
  display: flex;
  justify-content: start;
  align-items: end;
  flex-wrap: wrap;
  gap: 10px;

input.form-text{
padding:var(--buttonPadding);
  font-size: var(--button);
  line-height: 1em;
}

}


}


.view-slovnik-pojmu.view-display-id-attachment_1{

  display: flex;
  flex-wrap: wrap;
margin:var(--gapsmall) 0px;


.view-header{font-weight:700;}

.views-summary{
  font-size: var(--smaller);

 a{font-weight:700;  font-size: var(--basic);}
}

.view-content{gap: 10px;}


}

/*==============================================================================================================
	ladění 
==============================================================================================================*/

.page-node-type-sluzby  
.pulka2 {

  align-items: inherit;

.field--name-field-text-right,
.field--name-field-body {
flex-wrap: wrap;    display: flex;
    align-items: inherit;

> *{width:100%;}

}

}