/* styling for vm category modul podle vyberu */

div#myPodleVyberu {
  margin-bottom: 60px;
}
div#myPodleVyberu div.myModule div.myTitle {
  text-align: center;
  font-weight: 600;
  color: #009de2;
  font-size: 28px;
}
div#myPodleVyberu div.myModule div.myContent {
  margin-top: 35px;
}
div#myPodleVyberu div.myModule div.myContent div.mySelectModule {
  display: flex;
  flex-direction: row;
  /*flex-wrap: wrap;*/
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  /*justify-content: space-around;*/
}
/* coloms */
div#myPodleVyberu div.myVmCatColoms {
  width: calc(100% - 164px - 14px);
  display: flex;
  flex-direction: row;
  /*flex-wrap: wrap;*/
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  /*justify-content: space-around;*/
}
div#myPodleVyberu div.myVmCatColoms > div {
  width: calc(33.33% - 9px);
  /*padding-left: 94px;*/
  position: relative;
  border: 1px solid #cfcfcf;
  border-radius: 22px;
  /*cursor: pointer;*/
  background-color: white;
  z-index: 99;
}
/* coloms - title */
div#myPodleVyberu div.myVmCatColoms > div > span.myTitle {
  color: white;
  font-size: 16px;
  font-weight: bold;
  border-radius: 21px;
  line-height: 20px;
  padding: 11px;
  background-color: #009de0;
  width: 94px;
  text-align: center;
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  /*flex-wrap: wrap;*/
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  /*justify-content: space-around;*/
}
div#myPodleVyberu div.myVmCatColoms > div > span.myTitle > span {
  display: block;
  width: 100%;
}
/* coloms - title */
div#myPodleVyberu div.myVmCatColoms > div > span.mySelect {
  /*display: table;*/
  /*width: calc(100% - 22px);*/
  /*height: 42px;*/
  min-height: 42px;
  display: flex;
  flex-direction: row;
  /* flex-wrap: wrap; */
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  /* justify-content: space-around; */
  /*border-radius: 21px;*/
  border-top-right-radius: 21px;
  border-bottom-right-radius: 21px;
  overflow: hidden;
  background-color: white;
}
div#myPodleVyberu div.myVmCatColoms > div > span.mySelect > span {
  /*display: table-cell;*/
  /*vertical-align: middle;*/
  display: block;
  font-size: 16px;
  line-height: 18px;
  padding: 3px 0px;
  /*width: 100%;*/
  overflow: hidden;
  margin-left: 108px;
  margin-right: 49px;
}
/* coloms - arrow */
div#myPodleVyberu div.myVmCatColoms > div > span.myArrow {
  width: 21px;
  height: 14px;
  display: block;
  position: absolute;
  top: 0px;
  bottom: 0px;
  margin: auto;
  right: 14px;
  /*background-color: red;*/
  background-image: url(arrow.jpg);
}
/* coloms - button */
div#myPodleVyberu div.myVmCatColoms > div > span.myButton {
  position: absolute;
  display: block;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  border-radius: 22px;
  /*background-color: red;*/
  cursor: pointer;
}
/* coloms - values */
div#myPodleVyberu div.myVmCatColoms > div > div.myValues {
  display: none;
  position: absolute;
  top: calc(100% + 0px);
  left: 18px;
  right: 18px;
  background-color: white;
  z-index: -1;
  /*box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.30);*/
  border: 1px solid #cfcfcf;
}
div#myPodleVyberu div.myVmCatColoms > div.myOpen > div.myValues {
  display: block;
}
div#myPodleVyberu div.myVmCatColoms > div > div.myValues > div {
  padding: 9px 14px;
  font-size: 16px;
  line-height: 16px;
  cursor: pointer;
  transition: all 0.2s linear 0s;
  background-color: white;
  color: #4a4a4a;
}
div#myPodleVyberu div.myVmCatColoms > div > div.myValues > div:hover {
  background-color: #009de0;
  color: white;
}
/* button */
div#myPodleVyberu a.myButton {
  width: 164px;
  display: block;
  text-align: center;
  color: white;
  font-size: 16px;
  font-weight: bold;
  border-radius: 22px;
  line-height: 20px;
  padding: 12px;
  text-decoration: none;
  cursor: pointer;
  background-color: #b2c800;
}
div#myPodleVyberu a.myButton:hover {
  background-color: #009de0;
}


/* ADD AFTER 09.04.2021 */
div#myPodleVyberu.inVmCat {
  margin-bottom: 32px;
}
div#myPodleVyberu.inVmCat div.myModule div.myContent {
  margin-top: 7px;
}
/* repair max height roll values */
div#myPodleVyberu div.myVmCatColoms > div.myOpen > div.myValues {
  max-height: 690px;
  overflow: auto;
}