

@media (max-width: 1600px) {

  .main-frame {width: 1200px;}
}


@media (max-width: 1200px) {
  
  .main-frame {width: 100%; padding: 0 10px;}
  
  /*HEADER {background-color: #3cbcd4;}
  HEADER .inner {flex-wrap: wrap;}
  HEADER .inner .left {width: 100%; padding: 10px;}
  HEADER .inner .left .logo {text-align: center;}
  HEADER .inner .left .logo IMG {display: inline-block;}
  HEADER .inner .right {width: 100%; padding: 10px;}
  HEADER .inner .right .font {display: none;}
  HEADER .inner .right .phone {display: none;}
  
  NAV UL LI A {margin: 0 10px; font-weight: 400;}
  NAV UL LI A::before {right: -15px;}*/
  
  
}


@media (max-width: 1000px) {
  
  #dlazdice .inner .item {padding: 40px 30px 40px 120px; background-size: 60px auto; font-size: 16px;}
}


@media (max-width: 800px) {
  
  #dlazdice .inner .item {width: 48%; margin: 10px 4% 10px 0;}
  #dlazdice .inner .item:nth-child(2n) {margin-right: 0;}
}


@media (max-width: 680px) {
  
  .main-frame {padding: 0 5px;}

  header .inner {}
  header .inner .left {padding: 0 0 0 20px;}
  header .inner .left .logo {align-items: center; display: -webkit-flex; display: -webkit-box; display: -moz-flex; display: -moz-box; display: -ms-flexbox; display: flex;}
  header .inner .left .logo img {max-width: 250px;}
  header .inner .right {padding: 0 20px 0 0;}
  header.small .inner .left {padding: 0 0 0 20px;}

  #headerHeightByFixed {height: 139px;}

  #nsslider {display: none;}

  .menuFrame {position: relative; left: unset; top: unset; background-color: #257888; flex-direction: column;}

  NAV {display: none; width: 100%;}
  NAV UL {width: 100%; height: auto; flex-wrap: wrap;}
  NAV UL LI {width: 100%; border-top: 1px dotted #fff;}
  NAV UL LI A {margin: 0; padding: 10px 20px 10px 10px; border: 0; width: 100%; justify-content: flex-end; border-radius: 0;}
  NAV UL LI A::before {display: none;}

  #hamburger {display: -webkit-flex; display: -webkit-box; display: -moz-flex; display: -moz-box; display: -ms-flexbox; display: flex;}
  #hamburger {width: 100%; height: 46px; float: right; position: relative; padding: 0; margin: 0; line-height: 1; justify-content: space-between; align-items: center;}
  #hamburger .text {display: block; float: left; padding-left: 20px; font-size: 22px; font-weight: 400; text-transform: uppercase; color: #fff;}
  #hamburger .icon { width: 35px; position: absolute; top: calc(50% - 1px); right: 20px; transition: all .5s; }
  #hamburger.active .icon { width: 27px; background: transparent; }
  #hamburger .icon, .hamburger .icon:before, .hamburger .icon:after { height: 2px; background: #fff; }
  #hamburger .icon:before, .hamburger .icon:after { content: ""; width: 100%; position: absolute; left: 0; transition: all .5s; }
  #hamburger .icon:before { top: -10px; }
  #hamburger .icon:after { bottom: -10px; }
  #hamburger.active .icon:before { top: 0; transform: rotate(45deg); }
  #hamburger.active .icon:after { top: 0; transform: rotate(135deg); }
  
  #dlazdice .inner .item {width: 100%; margin-right: 0; margin-bottom: 2px; margin-left: 0;}
  
  #hpText {padding-top: 0;}
  
  #dlazdice {padding: 20px 0;}
  
  #hpTextOnas .inner {flex-wrap: wrap;}
  #hpTextOnas .inner .left {width: 100%;}
  #hpTextOnas .inner .left H1 {text-align: center;}
  #hpTextOnas .inner .right {width: 100%;}
  
  #news .inner .item {width: 49%; margin-right: 2%;}
  #news .inner .item:nth-child(3n) {margin-right: 2%;}
  #news .inner .item:nth-child(2n) {margin-right: 0;}
  
  #hpTextProKoho {padding: 10px 0; background-image: none;}
  #hpTextProKoho .inner {flex-wrap: wrap;}
  #hpTextProKoho .inner .left {width: 100%;}
  #hpTextProKoho .inner .left H2 {padding: 15px 0; color: inherit; text-align: center;}
  #hpTextProKoho .inner .right {width: 100%; padding: 0;}
  
  FOOTER .inner .bottom {flex-wrap: wrap;}
  FOOTER .inner .bottom A {width: 100%;}
}


@media (max-width: 550px) {
  header .inner .right .phone {display: none;}
  header .inner .right .font {margin-left: 20px;}
  header .inner .right .fb {margin-left: 20px;}
}


@media (max-width: 500px) {
  header .inner .left .logo img {width: 200px;}
  header .inner .right .phone SPAN {padding: 0; font-size: 28px;}
  header .inner .right .font {margin-left: 20px; font-size: 12px;}
}


@media (max-width: 400px) {
  header .inner .left .logo img {width: 160px;}
  header .inner .right .phone SPAN {display: none;}
  #news .inner .item {width: 100%; margin-right: 0;}
}
