/* ---------------------------------------
	Responsive design code
-----------------------------------------*/
@media screen and (max-width: 1360px) { 

#mainbanner { 
display: block;
width: 90%;
}
#nav2 {
width: 80%; }
#mod-custom111, #mod-custom118, #mod-custom110, #mod-custom117, .onaswrap, #center, #mod-custom114, #mod-custom120, #mod-custom115, #mod-custom121, #mod-custom126  {

width: 90%;
}
.pol a {
 
  padding: 3px 3px;
 
}
  .banerpopis h1 {
  font-size: 3.5rem;
}
}
@media screen and (max-width: 1290px) { 
 
}

@media screen and (max-width: 1170px) { 
 
.baner {

  height: 580px;

}
.banerpopis h1 {
  font-size: 3.5rem;
}

}
@media screen and (max-width: 1100px) {
.slu1 {
 
margin-bottom: 20px;
  padding: 1%;
}
.slu2 { 
margin-bottom: 20px;
 
}
#mod-custom111, #mod-custom118 {

  flex-wrap: wrap;
  
}
  .banerobr {
  position: absolute;
  width: 70%;
  z-index: 0;
  right: 0px;
}
}
@media screen and (max-width: 1024px) {
.o1 .sip, .o2 .sip, .o3 .sip, .o4 .sip, .o5 .sip, .o6 .sip {

  display: none;

}

#mod-custom123, #mod-custom124 {
float: left;
position: absolute;

margin-top: 20px;
top: 0px;
right: 150px;

}
.mobilemenu.openx	span:nth-child(1) {
  top: 8px;
  width: 0;
  opacity: 0;
  right: 50%;
  
}
.mobilemenu.openx span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  
	}
	
.mobilemenu.openx	span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  
}
.mobilemenu.openx span:nth-child(4) {
  top: 8px;
  width: 0;
  opacity: 0;
  right: 50%;
 
}
.mobilemenu.openx {
	  cursor: pointer;

width: 31px;
height: 24px;
}
.mobilemenu.close {
width: 31px;
  cursor: pointer;

height: 28px;
}

.mobilemenu.openx span {
  position: absolute;
  right: 0;
  width: 30px;
  height: 3px;
  border-right: 5px;
  background-color: #000;
}
.mobilemenu.close span {
  position: absolute;
  right: 0;
  width: 30px;
  height: 3px;
  border-right: 5px;
  background-color: #000;
}
.mobilemenu.openx span:nth-child(2) {
  top: 10px;
 
}
.mobilemenu.openx span:nth-child(3) {
  top: 10px;
 
}
.mobilemenu.close span:nth-child(1) {
  top: 0;
  
}
.mobilemenu.close span:nth-child(2) {
  top: 8px;
 
}
.mobilemenu.close span:nth-child(3) {
  top: 16px;
  
}
.mobilemenu.close span:nth-child(4) {
  top: 24px;
  
}

#mod-custom113, #mod-custom122 {
	margin-top: 0px;
	position: fixed;
	top: 101px;
	width: 100%;
	background: #01849f;
display: none;	
width: 180px;
right: 0px;
padding: 50px;
}
.pol a {
  display: block;
  padding: 3px 10px;
  margin-right: 10px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  color: #fff;
  float: left;
}

.mod-languages {
width: 100px;
float: right; 
 margin-top: 10px;
}
#nav2 {

position: relative;	
display: block;
width: 400px;
float: right;}

#mod-custom113 .pol, #mod-custom122 .pol  { 

width: 100%;
}
.mobilemenu.openx {
  cursor: pointer;
  width: 31px;
  height: 24px;
}
.pol {
  float: left;
  margin-right: 5px;
}	
img {
	max-width: 100% !important;
        height: auto !important;
}



.hidemobile4 {
	display: none !important;
}



}

@media screen and (max-width: 950px) {
.metal3 {
  display: grid;
  grid-gap: 50px;
  grid-template-columns: repeat(auto-fill,minmax(45%,1fr));
  width: 100%;
  margin-top: 20px;
}	
	.metal {
  display: grid;
  grid-gap: 50px;
  grid-template-columns: repeat(auto-fill,minmax(45%,1fr));
  width: 100%;
  margin-top: 20px;
  margin-bottom: 50px;
}
  #mod-custom111, #mod-custom118 {
  height: auto;
}
	#module1 {
  margin-top: 80px;
  text-align: left;
  float: left;
  width: 100%;
  margin-bottom: 50px; 
}
.banerobr {
  position: absolute;
  width: 100%;
  z-index: 0;
  right: 0px;
}
.baner {
  height: 650px;
}
.hidemobile3 {
	display: none !important;
}

.banerpopis {
  width: 100%;
  position: absolute;
  z-index: 1;
  left: 0px;
  height: 100%;
  display: flex;
align-items: flex-end;
}

}

@media screen and (max-width: 758px) {

  .plozkaobrx {
  display: block;
  align-items: center;
  float: left;
  width: 100%;
}
  .plozkapopis {
  align-items: flex-start;
  display: flex;
  width: 100%;
  flex-direction: column;
  justify-content: center;
}
.obal3swnove {
  padding: 4%;
  background: #f6fbec;
  width: 92%;
  float: left;
  margin-bottom: 80px;
  display: block;
  align-items: stretch;
  margin-top: 60px;
}
.plozkaobrlogo {
 
  align-items: center;
  width: 100%;
  background: #92C83E;
  height: auto%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  align-content: stretch;
}
.onas1b ul {
  --icon-space: 1.3em;
  list-style: none;
  padding: 0;
  margin-top: 30px;
  columns: 1;
  -webkit-columns: 1;
  -moz-columns: 1;
}
.baner {
  height: 550px;
}
.dva {
	
	order: 2;
	
}
.jedna {
	
	order: 1;
	
}
.hidemobile2 {
	display: none !important;
}

/*.flexiblemodule {
	width: 50% !important;
}

.flexiblemodule > div.inner {
	margin: 5px !important;
}

.column .moduletable, .column .moduletable_menu {
	float: left;
	width: 45% !important;
	margin: 10px 0 0 0 !important;
	padding: 2% !important;
}

.column div.moduletable:first-child, .column div.moduletable_menu:first-child {
	margin-right: 2% !important;
}*/
.plozkapopis {
width: 100%;
margin-bottom: 50px;
}

.plozkaobr {
width: 100%;
margin-top: 20px;
}
.onas1, .onas2 {
  width: 100%;
  margin-bottom: 30px;
}
#nav2 {
  position: relative;
  display: block;
  width: 200px;
  float: right;
}
.stlp1 {
  width: 100%;
}
.stlp2 {
  width: 100%;
}
#mod-custom115, #mod-custom121 {
  
  display: block;

}
.stlp2 iframe {
  width: 100%;
  height: 300px;
}
.ref1 {
  width: 30%;
  
}
}
@media screen and (max-width: 650px) {
.baner {
  height: 530px;
}} 
@media screen and (max-width: 524px) {
	#mod-custom111, #mod-custom118 {
  height: auto;
}
  .polozkysw {
  width: 100%;
  margin-bottom: 50px;
  display: grid;
  grid-gap: 50px;
  grid-template-columns: repeat(auto-fill,minmax(300px,1fr));
}
.baner {
  height: 400px;
}
.plozkapopis {
height: 100%;
}

.hidemobile1 {
	display: none !important;
}
.slu1 {
  width: 80%;
margin-bottom: 20px;
  padding: 10%;
}
.slu2 { 
margin-bottom: 20px;
 width: 100%;
}
.banerpopis h1 {
  font-size: 2.5rem;
}
#logo img {
  width: 120px;
  height: auto;
  text-align: left;
}
#nav2 {
  position: relative;
  display: block;
  width: 150px;
  float: right;
}
#mod-custom123, #mod-custom124 {
  float: left;
  position: absolute;
  margin-top: 0px;
  top: 0px;
  right: 120px;
}

#mod-custom113, #mod-custom122 {
 
  top: 88px;

}
  .swpodrobne {
  width: 100%;
  margin-bottom: 50px;
  display: grid;
  grid-gap: 80px;
  grid-template-columns: repeat(auto-fill,minmax(300px,1fr));
}
#center h2 {
  font-size: 2rem;
}
  .mod-languages__pretext {


    display: none;
  }
    .mod-languages {
  
    margin-top: 0px;
  }
}
@media screen and (max-width: 400px) { 
  .baner {
  height: 350px;
}
  }