@media only screen and (max-width: 1479px) {
.wrapper { width: 96%}
html { font-size:112.5%;}
footer {font-size:.778rem;}
.logo img {width:auto; max-width: 100px;}
header {min-height: 150px;}
.nav ul li { width:	280px; font-size: .833rem;}  
}

@media only screen and (max-width: 1479px) {
.nav ul li { width:	270px; font-size: .833rem;} 
}

@media only screen and (max-width: 1280px) {
.home_text { padding: 1.5rem 2.5rem;}
.slider_text {  padding: 1.5rem 1.5rem 1.5rem 12rem;}   
}

@media only screen and (max-width: 1240px) {
.nav ul li { width:	240px; font-size: .733rem;} 
}

@media screen and (max-width: 1151px) {
.logo {position: relative; margin:0; float: left; width: auto;}
.menu-link { display: inline-block; width: auto; float: right; text-align: right; background: #00aeef; color: #ffffff; text-decoration: none; padding: .5rem 1rem; font-family: 'Roboto Condensed', sans-serif; font-weight: 700; font-size: .818rem; text-transform: uppercase; margin-top: 2rem;}
.menu-link:hover,   .menu-link:active {color: #ffffff; text-decoration: none;}
.nav {  clear: both; min-width: inherit; float: none; overflow: hidden;  max-height: 0; position: absolute; top:4rem; width: 100%; max-width: 300px; right: 0; z-index: 10}
.nav.active { max-height:400px; }
.nav ul {  display: inline; }
.nav ul { list-style: none; position: relative; top: 50%; transform: translateY(-50%); width: 100%; padding: 0; margin: 0}
.nav ul li { display: block; width: 100%; max-width: 300px; }
.nav ul li a {  display: block;  border-bottom: 1px solid #ffffff; position: relative; margin: 0  }

.slider_text { position: relative;  width: 100%; height: auto; background:none; color: #5f5f5f; padding: 1.5rem;}
.lng {right:0;}
.lng a {padding: .3rem 1.1rem;}  
}


@media only screen and (max-width: 1024px) {
html { font-size:100%;}
footer {font-size:.875rem;}
.home_text a.more { font-size: .913rem;}

.left_nav {width: 230px;}
.left_nav ul li {font-size:1.125rem;}
.left_nav + .page { width: calc(100% - 230px);}  
.page .list-events p  {font-size: 1rem}
#vacation{ 
   display:none;
    margin-top:50px;
    width: 340px;
    height: 380px;
    padding: 15px;
}
#vacation img {width: 320px;    height: 360px; }
}

@media only screen and (max-width: 920px) {
 ul.tabs { padding: 0; margin: 0; list-style: none; text-align: center; width: 100%; float: left; overflow-x: auto; white-space: nowrap} 
}

@media only screen and (max-width: 800px) {
.content {padding: 3rem 0;}
.block  {padding: 0 0 3rem 0;}
.home_text { width:100%; float: left !important;}
.block_image { width:100%; padding: 2rem 2rem 0}  

.left_nav {width:100%; margin-bottom: 1.5rem;}
.page, .left_nav + .page { width:100%; padding-left: 0;}

.left_nav ul { display: none;}
.left_nav select { display: block; padding: 0; margin: 0;  width: 100%; height: 2rem; font-size: 1.125rem; font-family: 'Roboto Condensed', sans-serif; font-weight: 700; color: #303030; background: #b6b6b6; border: none;}

.page .inner_slider .item img { max-width: 800px;}

#map_div { width: 100%;}
.contacts_info {width: 100%;}
.banner { width:99%; transform:translateX(-50%)}
.banner img { width:100%;padding:0;margin:0;position:relative;transform:0%}
}

@media only screen and (max-width: 599px) {
.section_title, h1 { font-size: 1.875rem;}
.logo img {width:auto; max-width: 80px;}
header {min-height: 100px;}
 .page img {width:100%}
.inner_slider .owl-prev, .inner_slider .owl-next  { width: 30px; height: 58px; background-size: 30px auto;}
}

@media only screen and (max-width: 530px) {
.page img { max-width:100%; width: 100%; float: left; margin-top: 1rem; margin-left: 0}
.page .contacts_info div img { max-width:100%; width:auto !important; float: none; margin-top:0; margin-left: 0}
	
.page .contacts_info div {

  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;

}
.banner { width:99%;  transform:translateX(-50%)}
.banner img { width:100%;padding:0;margin:0;}
}
