@import "print.css";

:root {  
	--trans-color-in:all .2s ease-in-out;
	--trans-color-out:all .2s ease-in-out;

	--fontfamily:  'Montserrat',Arial,Helvetica,"Nimbus Sans L",sans-serif;
	--fontfamily2: 'Marcellus', 'Montserrat',Arial,Helvetica,"Nimbus Sans L",sans-serif;

	--basictext: 18px;
	--perextext: 20px;

	--button: 16px;

	--menusize: 14px;
	--h1: clamp(140px, 10.26vw, 187px);
	--h2: 48px;
	--h3: 30px;
	--h4: 25px;
	--h3product: 20px;


	--tablehead:18px;
	--tabletext:16px;

	--center: 1600px;
	--center2: 1200px;
	--centernorrow: 900px;

	--centerpadding: 50px;
	--centerpaddingminus: -50px;
	--gap: 80px;
	--gapminus: -80px;
	--gapsmall: 40px;
	--gapsmallminus: -40px;
	--gapsmaller: 20px;
	--gapsmallerminus: -20px;

	--blanc: #fff;
	--white: #fff;
	--textcolor: #020100;
	--black:#020100;
	--link: #020100;
	--linkhhover: #512564;
	--bgLightPurple: #F3EDED;
	--border:#e6e6e6;
	--border2:#dadace;

	--red:#ff0000;
 

}

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

:root{

	--h1: 50px;
	--h2: 40px;
	--h3: 30px;
	--h4: 20px;

	--h3product: 18px;


	--tablehead:16px;
	--tabletext:16px;

	--basictext: 16px;
	--perextext: 18px;

	--menusize: 16px;
	--button: 14px;


	--gap: 50px;
	--gapminus: -50px;
	--gapsmall: 25px;
	--gapsmallminus: -25px;
	--gapsmaller: 12.5px;
	--gapsmallerminus: -12.5px;

	--centerpadding: 20px;
	--centerpaddingminus: -20px;

}

} 

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(--bgLightPurple);
min-width:1200px;
scroll-behavior: smooth;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}


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

body{
min-width:0px;
}

}


.layout-container{
padding:0px 0px var(--gapsmall);
color: var(--black);
background: var(--white);
    margin: 0;
  position: relative;
}




/*==================================================================================================================================
		admin
==================================================================================================================================*/

.role-authenticated .header-around{
padding-top:0px;
}


.role-authenticated #header{
position:relative;
}

#header .contextual-region,
#block-drualas-theme-main-menu-menu.contextual-region {
position:static !important;
} 

.role-authenticated .rmm-toggled-controls,
.role-authenticated .rmm-fixed.oblibene{
    position: absolute;
}



.role-authenticated .for-anonym-only {
display: none;
}

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

#toolbar-administration{
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
width:100%;
}

}

/*==============================================================================================================
	login form 
==============================================================================================================*/

.path-user form{
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  background: var(--graybg);
  padding: var(--centerpadding);
}


.path-user form[id*='user-pass'],
.path-user form[id*='user-login-form']{
max-width:600px;margin:auto;
}


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


.margintop{
margin-top:var(--gap);
}

.marginbottom{
margin-bottom:var(--gap);
}

.margin_top_minus{
margin-top:var(--gapminus);position:relative;z-index:1;
}

.margin_bottom_minus{
margin-bottom:var(--gapminus);position:relative;z-index:1;
}


.padding_top{
padding-top:var(--gap);
}

.padding_bottom {
padding-bottom:var(--gap);
}

.padding_bottom_small {
padding-bottom:var(--gapsmall);
}

.padding_top_small {
padding-top:var(--gapsmall);
}

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


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

.body-center{width: 100%;
max-width:var(--centernorrow);margin:0px auto var(--gap);padding:0px  var(--centerpadding);
  position: relative;
}

.narrow-1{
max-width:var(--centernorrow);margin-right:auto;margin-left:auto;
}

.center .center{
padding-right:0px;padding-left:0px;
}

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

#header{
background:var(--bgLightPurple);
  text-align: center;
padding:15px 0px;
}


.site-logo{
  line-height: 1px;
display:inline-block;margin-bottom:15px;
}

.site-logo img{
width:140px;
}

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

.site-logo{
margin-bottom:0px;
}

}

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

.region-footer{
padding:var(--gapsmall) 0px;
}

.region-footer .center{
  display: flex;
  justify-content: space-between;
  align-items: center;

}

.region-footer .center > nav,
.region-footer .center > div{
max-width:33.333%;
}

.region-footer p{
font-size:0.9em;
line-height:1.3em;
}

.region-footer ul{
list-style:none;padding:0px;  font-family: var(--fontfamily2);
}

.extlink-nobreak .ext,
.extlink-nobreak .mailto{
display:none;
}

.region-footer ul a{
text-decoration:none;
}

.region-footer img{
width:280px;
}


.menu--footer li{
margin-bottom:20px;
}

.menu--footer a{
font-size:var(--h4);
}


.region-totalbottom{
padding:20px 0px;
border-top:2px solid var(--border2);
}

#block-drualas-theme-paticka .field--name-body{
font-size:0.9em;
line-height:1.3em;

  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}

/*** socky ***/

#block-drualas-theme-socialnisite h2{
  font-size: 0.9em;
  line-height: 1.3em;
font-family: var(--fontfamily);

}

#block-drualas-theme-socialnisite ul{
  display:flex;gap:10px;
}

#block-drualas-theme-socialnisite ul li{
  
}

#block-drualas-theme-socialnisite ul a{
  border: 2px solid var(--border2);

-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%; 

  display:block;width:40px;height:40px;line-height:100em;overflow:hidden;
background-position:center center;
background-repeat:no-repeat;
background-size:20px auto;
}

#block-drualas-theme-socialnisite ul a[href*='facebook']{
background-image:url(../images/icon-facebook.svg);
}


#block-drualas-theme-socialnisite ul a[href*='instagram']{
background-image:url(../images/instagram.svg);
}

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

.region-footer .center {
flex-wrap:wrap;
}

.region-footer .center > nav, .region-footer .center > div {
  max-width: unset;
}


.bottom.right-footer{
width:100%;    text-align: center;
margin-top:10px;}

.bottom.left-footer{
width:100%;    text-align: center;
}

.menu--footer li{
margin-bottom:10px;
}


}


/*==================================================================================================================================
		flags
==================================================================================================================================*/


body .flag {position:relative;}

body .flag a {
    background: url(../images/hearta.svg) no-repeat center center var(--white);
    background-size: 20px auto;
    -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;


    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;

    padding: 0px;
    border: 2px solid var(--red);
    display: block;
    width: 40px;
    height: 40px;
    line-height: 100em;
    overflow: hidden;
}


body .flag .ajax-progress{position:absolute;top:50%;left:50%;}
body .js-flag-message{
display:none;
}

body .action-unflag a{
    background-image: url(../images/heart3.svg);
    background-size: 20px auto;
    background-color: white;
    border-color: var(--black);
}


body .flag a:focus,body .flag a:hover {
    border-color: var(--red);
    background-image: url(../images/hearta-a.svg);
    background-color: var(--red);
}

body .action-unflag a:focus,body  .action-unflag a:hover {
    background-image: url(../images/heart3-a.svg);
    background-color: var(--black);
    border-color: var(--black);
}


/*==================================================================================================================================
		srdce
==================================================================================================================================*/

.oblibene a{
  background: url(../images/hearta.svg) no-repeat center center;
  background-size: 20px auto;
  -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;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  padding: 0px;
  border: 1px solid rgba(0,0,0,0);
  display: block;
  width: 40px;
  height: 40px;
  line-height: 100em;
  overflow: hidden;
}

.oblibene a:focus,
.oblibene a:hover{
background-image: url(../images/hearta-a.svg);
background-color:var(--black);
  border-color: var(--black);
}
 
/*==================================================================================================================================
		osoby vzdělávání
==================================================================================================================================*/

.paragraph-img-txt h2 + p strong,
.paragraph-img-txt h3 + p strong{
font-size:var(--perextext);font-weight:400;
}
 
.skoleni{
max-width:var(--centernorrow);
margin:auto;
  border-bottom: 2px solid var(--border2);
padding:0px 0px var(--gapsmall);
margin-bottom:var(--gapsmall);
}

.skoleni:last-child{

}

.technolog{
margin-left:auto;margin-right:auto;max-width:var(--center2);
}


.skoleni.paragraph--position--left .paragraph-img-txt-image{
width:20%;
}

.skoleni.paragraph--position--left div.paragraph-img-txt-body{
text-align:left;width:80%;
}


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

.skoleni.paragraph--position--left .paragraph-img-txt-image{
max-width:150px;width:60%;
}

.skoleni.paragraph--position--left div.paragraph-img-txt-body{
width:100%;text-align:center;
}

 

}

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

.page-header{
background-repeat:no-repeat;background-position:right center;

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.page-header .center{
padding:var(--gap) var(--centerpadding);

}


.page-header:not([style=""]){
color:white;
}

.page-header:not([style=""]) .center{
display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;
}

.page-header:not([style=""]) h1{
  text-align: left;
  margin: 0px 0px;
padding-right:var(--gap);width:65%;
}

.page-header .field--name-field-maly-obrazek {
  max-width: 400px;  flex-shrink: 0;width:35%;
}


.page-header .field--name-field-maly-obrazek img{
width:100%;
} 

.field--name-field-maly-obrazek {
line-height:1px;
}

.kategoriesekce .view-content{
width:100%;margin-top:var(--gapsmall);
  display: flex;flex-wrap:wrap;
  justify-content: start;
  align-items: start;
  gap: 20px 20px;
}


.field--name-field-odkazy{
width:100%;margin-top:var(--gapsmall);
  display: flex;
  justify-content: center;
  align-items: start;
  gap: 10px 20px;
}

.field--name-field-odkazy .field__item{
 
}
 
.kategoriesekce .view-content a,
.field--name-field-odkazy a{
-webkit-border-radius: 60px;
-moz-border-radius: 60px;
border-radius: 60px;
border:1px solid white;
display:block;text-decoration:none;
--link:#fff;
font-size:var(--button);
padding:15px 25px;text-transform:uppercase;
}

.kategoriesekce .view-content .active a,
.kategoriesekce .view-content a:focus,
.kategoriesekce .view-content a:hover,
.field--name-field-odkazy a:focus,
.field--name-field-odkazy a:hover{
background-color:white;  color: var(--linkhover);
}

.page-header.velky .center{
min-height:500px;max-height: 800px;
}


.paragraph--type--text-content  .field--name-field-odkazy{


a{
  --link: #512564;
border-color:#512564;
}

a:focus,
a:hover{

  color:white;
background-color: #512564;
border-color:#512564;
}


}

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

.kategoriesekce .view-content,
.field--name-field-odkazy{
flex-wrap:wrap;  gap: 10px 10px;
}

.kategoriesekce .view-content a,
.field--name-field-odkazy a{
  padding: 5px 20px;
}


.page-header.velky .center{
min-height:240px;  
}

.page-header:not([style=""]) h1{
  text-align: center;
  padding-right: 0;
  width: 100%;
}

.page-header.velky h1{
width:60%;    text-align: left;
}


.page-header .field--name-field-maly-obrazek {
  width: 60%;max-width:200px;
  margin: 20px auto 0px;
}


}


/*==================================================================================================================================
	nový výpis obsahu
==================================================================================================================================*/


.cat-desc{
  max-width: var(--centernorrow);
  margin-right: auto;
  margin-left: auto;
}


.category-container{
--morelink:#512564;
display:none;
}

.category-container.active{
display:block;
}

.category-container .vypisproduktu {
margin-top:var(--gap);
}

/*==================================================================================================================================
	show more 
==================================================================================================================================*/

.showmorelink{
  text-align: center;
}

.showmorelink a{
  color: var(--morelink);border:1px solid var(--morelink); background:transparent;
}

.showmorelink a:focus,
.showmorelink a:hover{
color: #fff;border:1px solid var(--morelink); background:var(--morelink);
}


.button .showless{display:none;}
.show .button .showless{display:inline-block;}
.show .button .showmore{display:none;}

.longtext{
position:relative;
  overflow: hidden;
  max-height: 19em;
}

.longtext:after {
  content: "";
  display: block;
  width: 100%;
  height: 50px;
  position: absolute;
  left: 0px;
  bottom: 0px;
  z-index: 1;
  background: -moz-linear-gradient(top,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
  background: -webkit-linear-gradient(top,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
  background: linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff',endColorstr='#ffffff',GradientType=0);
}

.show .longtext{
  max-height: unset;
  min-height: 0;
}

.show .longtext:after{
display:none;
}



/*==================================================================================================================================
	front category
==================================================================================================================================*/



.frontcategoryview .view-content {
  display: flex;
  justify-content: inherit;
  align-items: inherit;
  flex-wrap: wrap;
}


.frontcategoryview .view-content .views-row {
width:33.333%;  display: flex; 

}


.node-teaser-page{
color:white;text-align:center;
  display: flex;  text-decoration: none;position:relative;
overflow:hidden;  flex-wrap: wrap;
padding:var(--gapsmall);  align-items: end;overflow:hidden;
}

.node-teaser-page:hover,
.node-teaser-page:focus{
color:#fff;
}

.more-link{
text-decoration:underline;
}

.node-teaser-page:hover .more-link,
.node-teaser-page:focus .more-link{
text-decoration:none;
}



.page-view-image{
background-repeat:no-repeat;background-position:center top;
  -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%;
}

.page-view-text{
position:relative;
}

.node-teaser-page .field--name-field-maly-obrazek {
max-width:70%;margin:0px auto var(--gapsmaller);
}

.node-teaser-product  .field--name-field-galerie img,
.node-teaser-page .page-view-image,
.node-teaser-page  .field--name-field-maly-obrazek {
  -webkit-transition: .5s all ease-in-out;
  -moz-transition: .5s all ease-in-out;
  -o-transition: .5s all ease-in-out;
  -ms-transition: .5s all ease-in-out;
  transition: .5s all ease-in-out;
}

.node-teaser-product  .field--name-field-galerie .field__item img{
  filter: brightness(1.1) ;
}


.node-teaser-product:hover   .field--name-field-galerie img,
.node-teaser-product:focus  .field--name-field-galerie img,
.node-teaser-page:hover  .page-view-image ,
.node-teaser-page:hover   .field--name-field-maly-obrazek,
.node-teaser-page:focus .page-view-image,
.node-teaser-page:focus  .field--name-field-maly-obrazek{
  -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;
  filter: brightness(1) ;

}

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


.frontcategoryview .view-content .views-row {
width:50%; 
}

.page-view-text h2{
font-size:var(--h3);
}

}

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

.page-view-image + .page-view-text{
padding-top:100%;
}

.node-teaser-page .field--name-field-maly-obrazek {
  max-width: 60%;
}

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

}


/*==================================================================================================================================
	vypis produkt
==================================================================================================================================*/

.node-teaser-product {
display:block;text-decoration:none;text-align:center;
}

.node-teaser-product  .field--name-field-galerie{
margin-bottom:20px;overflow:hidden;  line-height: 1px;position:relative;
}

.node-teaser-product h3{
font-size:var(--h3product);  margin: 0px;
}

.node-teaser-product  .field--name-field-kategorie{
font-size:0.9em;
}



.vypisproduktu .view-content {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: start;
margin:0px -15px;
}

.vypisproduktu .view-content .views-row{
width:33.333%;padding:0px 15px;margin-bottom:var(--gap);
}

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

.vypisproduktu .view-content .views-row{
width:50%;
}


}

/*==================================================================================================================================
	výpis štítku
==================================================================================================================================*/

.path-taxonomy .layout-content{
padding:var(--gap) 0px 0px;
}

/*==================================================================================================================================
	detil produktu
==================================================================================================================================*/


.block-views-blockpodobne-clanky-block-1{width: 100%;
max-width:var(--center);margin:0px auto;padding:0px  var(--centerpadding);
  position: relative;
}

.block-views-blockpodobne-clanky-block-1 h2{
text-align:center;margin-bottom:var(--gapsmall);
}

.node-produkt .center{
  display:flex;align-items:start;margin:var(--gap) auto;
}

.node-produkt h1{
  font-size: var(--h2);
  text-align: left;
}

.node-produkt .galerie{
width:50%;flex-shrink: 0;
}

.node-produkt .detail{
width:50%;padding-left:var(--gap);
}


.field--label-inline {
display:flex;
}


.field--label-inline .field__label{
font-weight:500;margin-right:10px;
}

.field--label-inline .field__label:after{content:":";}

.node-produkt .field--name-field-perex{
margin-top:20px;
}

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


.node-produkt .center{
  flex-wrap: wrap;
}

.node-produkt .galerie {
  width: 100%;order:1;
}

.node-produkt .detail {
  width: 100%;
  padding-left: 0;order:0;
}


}


/*========================================================================================================================
			show more and less
========================================================================================================================*/

.body-more {
margin-top:20px;text-align:center;
}


.body-more a{
  display: inline-block;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  border-radius: 60px;
  border: 1px solid var(--black);
color:var(--black);
  text-decoration: none;
  font-size: var(--button);
  padding: 10px 25px;
  text-transform: uppercase;
}

.body-more a:focus,
.body-more a:hover{background-color:var(--black);color:white;
}


.body-more a.show_less {
display:none;
}


.smore .body-more a.show_more{
display:none;
}

.smore .body-more a.show_less{
display:inline-block;
}

.inner-body::after {
    content: "";
    display: block;
    width: 100%;
    height: 50px;
    position: absolute;
    left: 0px;
    bottom: 0px;
z-index:1;
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}


.smore .inner-body:after{
display:none;
}


.inner-body{
    overflow: hidden;
    max-height: 18em;
}

.smore .inner-body{
    max-height: unset;
    min-height: 0;
}

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

.body-more a{
  padding: 10px 20px;
}

}


/*========================================================================================================================
			skoleni ktera posouva
========================================================================================================================*/

#block-skolenikteraposouvajidal p + h2{
margin-top:0px;
}

#block-skolenikteraposouvajidal .field--name-body{
  border: 2px solid var(--border2);
padding:var(--gapsmall) var(--gapsmall) calc(var(--gapsmall) - 20px);
width:80%;
padding-left:calc(20% + var(--gapsmall));
margin:0px 0px 0px auto;
}

#block-skolenikteraposouvajidal{
  display: flex;
  align-items: center;
  justify-content: center;
max-width:1000px;margin:auto;
}

#block-skolenikteraposouvajidal .field--name-field-img{
width:40%;margin-right:-20%;
}


.field--name-field-img{line-height:1px;position:relative;z-index:1;}

.field--name-field-img img{
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}

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

#block-skolenikteraposouvajidal{
flex-wrap:wrap;
}

#block-skolenikteraposouvajidal .field--name-body{
width: 100%;
  padding-left: var(--gapsmall) ;    padding-top: calc(50px + var(--gapsmall));
}

#block-skolenikteraposouvajidal .field--name-field-img {
  width: 60%;
  margin-right: auto;
  max-width: 300px;
  margin-left: auto;
  margin-bottom: -50px;
}

}

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

img[src*='logo-inimitable-color.png'],
img[src*='group_79']{
width:330px;max-width:90%;
}


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

img[src*='logo-inimitable-color.png'],
img[src*='group_79']{
width:200px;max-width:90%;
}


}

.logowhite{
display:none;
}

.page-id-46 #header{
  background: #44525B;
  --link: #fff;
  --linkhhover: #F3EDED;


.logowhite{
display:block;
}

.logoblack{display:none;}


}


