/*
HEIGHT 
*/
@media only screen and (min-height: 768px) and (max-height: 881px) { 
	#header {
		margin: 40px 0 30px;
	}
	.cverticalmenu {
   
    position: absolute;
    top: 25%;
}
	.ccontactinfo {
		bottom: 0%;
	}
}
@media only screen and (min-height: 701px) and (max-height: 767px) { 

	.side_block {
		padding: 100px 0 40px;
	}
	.ccontactinfo {
		display:none !important;
	}
	.h2_holder{display:none !important;}
	.cverticalmenu {
		position:absolute;
		top:25%;
		padding: 0;
		margin: 37px 0px 5px 35px !important;
	}
	.send_kons{
		bottom: 15%;
		position:absolute;
	}
	.schetchik{
		display:none;
	}
}
@media only screen and (min-height: 601px) and (max-height: 700px) { 
.cverticalmenu .module_title{display:none}
	.side_block {
		padding: 100px 0 40px;
	}
	.ccontactinfo {
		display:none !important;
	}
	.cverticalmenu {
		position:absolute !important;
		top:25% !important;
		margin:12px 0 5px 35px !important;
	}
	.send_kons{
		bottom: 5%;
		position:absolute;
	}
	.schetchik{
		display:none !important;
	}
}
@media only screen and (min-height: 501px) and (max-height: 600px) { 
	/*#header {
		display:none !important;
	}*/
	#header {
		margin: 20px 0 30px !important;
	}
	.cverticalmenu .module_title{display:none}
	.side_block {
		padding: 0px 0 40px;
	}
	.ccontactinfo {
		display:none !important;
	}
	.cverticalmenu {
		position:absolute !important;
		top:50% !important;
		margin: -150px 0px 0px 35px !important;
	}
	.send_kons{
		display:none !important;
	}
	.schetchik{
		display:none !important;
	}
}
@media only screen and (min-height: 426px) and (max-height: 500px) { 
	#header {
		margin: 10px 0 30px !important;
	}
	.cverticalmenu .module_title{display:none}
	.side_block {
		padding: 0px 0 40px;
	}
	.ccontactinfo {
		display:none !important;
	}
	.cverticalmenu {
		position:absolute !important;
		top:50% !important;
	
		margin: -110px 0px 0px 35px !important;
	}
	.send_kons{
		display:none !important;
	}
	.schetchik{
		display:none !important;
	}
}
@media only screen and (min-height: 220px) and (max-height: 425px) { 
	#header {
		display:none;
	}
	.side_block {
		padding: 0px 0 40px;
	}
	.ccontactinfo {
		display:none !important;
	}
	.cverticalmenu {
		position:absolute !important;
		top:50% !important;

		margin: -152px 0px 0px 35px !important;
	}
	.send_kons{
		display:none !important;
	}
	.schetchik{
		display:none !important;
	}
	.h2_holder{display:none !important;}
}
/*

WIDTH 

*/
@media (max-width: 853px) { 
	.mobile-logo #header {
		display: block;
		height: 110px !important;
		margin: 0 0 0 0 !important;
		padding: 10px 0;
	}
	#side_block_out .side_block #header {
	display: none;margin: 0 0 0 0 !important;}
	#header.dropped {
		height:110px !important;
	}
	#logo {
		overflow:visible !important;
		visibility: visible !important;
		position:absolute !important;
		left:50% !important;
		margin-left:-143px !important;
		width:285px !important;
	}
	#logo.lfloat{
		position:absolute !important;
		left:50% !important;
		margin-left:-143px !important;
		width:285px !important;
	}
	.yjsg_grid {
		padding:20px 0px;
	}
	.side_block_out_right{
		display:none;
	}
	#holder, #holder2, #holder3 {
		padding: 20px 20px 0;
	}
	#topmenu_holder {
		display: block;
		margin: 0 auto;
		padding: 0;
		position: relative;
		z-index: 8888;
	}
	#mmenu_holder {
		background: none repeat scroll 0 0 #212528;
		display: block;
		height: 46px;
		margin: 0 auto;
		overflow: visible;
		padding: 0;
		position: relative;
		text-align: center;
		width: 100%;
	}
}

@media (min-width: 854px) and (max-width: 1024px) {
	body, html {
		overflow-x:hidden;
    }
	
	#centertop {
		margin: 0px !important;
		padding: 0px;
	}	
	#holder, #holder2, #holder3 {
		padding: 20px 20px 10px 50px;
	}
	#header {
		width: 283px;
		max-width: 283px!important;
		margin:25px 0px 70px 0px;
		position: relative;
		top: 0;
		left: 0;
		z-index: 5212528;
		padding:0px 5px 0px 2px;
	}
	#side_block_out {
		display: block !important;
		overflow: visible !important;
		position: absolute;
		padding:0px 0px;
		top: 0;
		left: 0;
		width: 250px;
		z-index:999;
	}
	.side_block {
		display: block !important;
		position:fixed !important;
		height: 100%;
		width: 290px;
		z-index: 1212528;
		padding: 0px 0px;
	}
	#side_block_out_right {
		display: block;
		overflow: hidden!important;
		position: fixed !important;
		background:#fff;
		top: 0;
		right: 0;
		padding:0px 0px;
		width: 100px;
		height: 100%;
	}
	.main-content {
        width: 100%;
        height: 100%;
        padding: 10px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        position: relative;
    }
	.side_block_right {
		display: block;
		width: 100px;
		z-index: 1212528;
		padding: 20px 0 20px 0;
	}
	.side_block_right .logo_right{
		top:50%;
		width:86px;
		height:96px !important;
		position:absolute;
		margin-top:-40px;
	}
	#centertop {
		display: block;
		position: relative;
		margin: 0;
		height:100%;
		padding-left: 0px !important;
		padding-right: 70px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.container {
		position: relative;
		height: 100%;  
		left: 0;
		-webkit-transition:  left 0.4s ease-in-out;
		-moz-transition:  left 0.4s ease-in-out;
		-ms-transition:  left 0.4s ease-in-out;
		-o-transition:  left 0.4s ease-in-out;
		transition:  left 0.4s ease-in-out;
	}
    .container.open-sidebar {
        left: 290px !important;
    }
	/*
    .container.open-sidebar #holder{
        left: 290px !important;
		padding-right:0px!important;
    }*/
    .sidebar {
        position: absolute !important;
        left: -290px !important;
        width: 290px !important;
        height: 100% !important;
        box-sizing: border-box !important;
		display: block !important;
		overflow:visible !important;
		visibility:visible !;
    }
	.sidebar-toggle-bar{
		position: absolute;
		width: 50px;
		left: 0;
		top: 0;
		height: 100%;
		z-index:888;
	}
	.hamburger{
		background: #fff;
		border:1px solid #212528;
		display: block;
		position: relative;
		padding: 10px 10px;
		float: left;
		z-index:8888;
		position: fixed!important;
		top: 50% !important;
		width:50px;
		margin-top:-25px;
		height:50px;
	}
	.hamburger:hover {
		background: #212528;
		border:1px solid #212528;
		display: block;
		position: relative;
		padding: 10px 10px;
		float: left;
		z-index:8888;
		position: fixed!important;
		top: 50% !important;
		width:50px;
		height:50px;
	}
	.hamburger .bar{
		display: block;
		width: 24px;
		margin:0px 2px 5px;
		height: 3px;
		background-color: #212528;
		border-radius: 2px;   
    }
	.hamburger:hover .bar{
		background-color: #fff;
	}
	.hamburger.is-open .bar{
		display: none;
	}
	.hamburger.is-open:after{
		display: block;
		content: "";
		position: absolute;
		width: 22px;
		height: 22px;
		left: 50%;
		top: 50%;
		margin: -12px 0 0 -12px;
		-moz-transform:rotate(0deg);
		-ms-transform:rotate(0deg);
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
		-moz-transition:all,.5s;
		-o-transition:all,.5s;
		-webkit-transition:all,.5s;
		transition:all,.5s;
		background:#fff url("../images/mobile-ico.png") bottom no-repeat ;
    }
	.hamburger.is-open:hover{
		background:#fff;
    }
	.hamburger.is-open:hover:after{
		-moz-transform:rotate(180deg);
		-ms-transform:rotate(180deg);
		-webkit-transform:rotate(180deg);
		transform:rotate(180deg)
    }
	.hamburger .bar:last-child{
		margin-bottom: 0;   
	}
	
	.cverticalmenu {
		margin-left: 20px ;
		padding: 0;
			position: absolute;
    top: 25%;
	}
	.side_block .yjsquare {
		clear: both;
		display: block;
		margin: -12px 0 5px;
		overflow: hidden;
		padding: 0px 20px;
	}
	.side_block_right .yjsquare {
		clear: both;
		display: block;
		overflow: hidden;
		padding: 0px 7px;
	}
	.ccontactinfo {
		padding: 0 20px;
	}
	
	
	
	
	
	#wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled {
    padding-left: 290px;
}

#sidebar-wrapper {
    z-index: 1000;
    left: 290px;
    width: 0;
    height: 100%;
    margin-left: -290px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #1a1a1a;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#sidebar-wrapper::-webkit-scrollbar {
  display: none;
}

#wrapper.toggled #sidebar-wrapper {
    width: 290px;
}

#page-content-wrapper {
    width: 100%;
    padding-top: 70px;
}

#wrapper.toggled #page-content-wrapper {
    position: absolute;
    margin-right: -290px;
}

/*-------------------------------*/
/*     Sidebar nav styles        */
/*-------------------------------*/

.sidebar-nav {
    position: absolute;
    top: 0;
    width: 290px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-nav li {
    position: relative; 
    line-height: 20px;
    display: inline-block;
    width: 100%;
}

.sidebar-nav li:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    height: 100%;
    width: 3px;
    background-color: #1c1c1c;
    -webkit-transition: width .2s ease-in;
      -moz-transition:  width .2s ease-in;
       -ms-transition:  width .2s ease-in;
            transition: width .2s ease-in;

}
.sidebar-nav li:first-child a {
    color: #fff;
    background-color: #1a1a1a;
}
.sidebar-nav li:nth-child(2):before {
    background-color: #ec1b5a;   
}
.sidebar-nav li:nth-child(3):before {
    background-color: #79aefe;   
}
.sidebar-nav li:nth-child(4):before {
    background-color: #314190;   
}
.sidebar-nav li:nth-child(5):before {
    background-color: #279636;   
}
.sidebar-nav li:nth-child(6):before {
    background-color: #7d5d81;   
}
.sidebar-nav li:nth-child(7):before {
    background-color: #ead24c;   
}
.sidebar-nav li:nth-child(8):before {
    background-color: #2d2366;   
}
.sidebar-nav li:nth-child(9):before {
    background-color: #35acdf;   
}
.sidebar-nav li:hover:before,
.sidebar-nav li.open:hover:before {
    width: 100%;
    -webkit-transition: width .2s ease-in;
      -moz-transition:  width .2s ease-in;
       -ms-transition:  width .2s ease-in;
            transition: width .2s ease-in;

}

.sidebar-nav li a {
    display: block;
    color: #ddd;
    text-decoration: none;
    padding: 10px 15px 10px 30px;    
}

.sidebar-nav li a:hover,
.sidebar-nav li a:active,
.sidebar-nav li a:focus,
.sidebar-nav li.open a:hover,
.sidebar-nav li.open a:active,
.sidebar-nav li.open a:focus{
    color: #fff;
    text-decoration: none;
    background-color: transparent;
}

.sidebar-nav > .sidebar-brand {
    height: 65px;
    font-size: 20px;
    line-height: 44px;
}
.sidebar-nav .dropdown-menu {
    position: relative;
    width: 100%;
    padding: 0;
    margin: 0;
    border-radius: 0;
    border: none;
    background-color: #222;
    box-shadow: none;
}

/*-------------------------------*/
/*       Hamburger-Cross         */
/*-------------------------------*/

.hamburger.is-closed:before {
  content: '';
  display: block;
  width: 100px;
  font-size: 14px;
  color: #fff;
  line-height: 32px;
  text-align: center;
  opacity: 0;
  -webkit-transform: translate3d(0,0,0);
  -webkit-transition: all .35s ease-in-out;
}
.hamburger.is-closed:hover:before {
  opacity: 1;
  display: block;
  -webkit-transform: translate3d(-100px,0,0);
  -webkit-transition: all .35s ease-in-out;
}

.hamburger.is-open:before {
  content: '';
  display: block;
  width: 100px;
  font-size: 14px;
  color: #fff;
  line-height: 32px;
  text-align: center;
  opacity: 0;
  -webkit-transform: translate3d(0,0,0);
  -webkit-transition: all .35s ease-in-out;
}
.hamburger.is-open:hover:before {
  opacity: 1;
  display: block;
  -webkit-transform: translate3d(-100px,0,0);
  -webkit-transition: all .35s ease-in-out;
}

/*-------------------------------*/
/*            Overlay            */
/*-------------------------------*/

.overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(250,250,250,.8);
    z-index: 1;
}
}
@media (min-width: 120px) and (max-width: 853px) {
	.mobile-logo{display:block;margin: 0 0 0 0 !important;}
	.mobile-logo #header {
		display:block !important;
		margin: 0 0 0 0 !important;
	}
	.mobile-logo #header .logo {
    text-align: center;
}
	.mobile-logo .logo > a {
		display: inline-block;
	}
	#side_block_out .side_block #header {
	display: none;margin: 0 0 0 0 !important;;}
	#topmenu_holder.response {
		padding-top: 0px;
		background:#212528;
	}
	
	
	.sidebar-toggle-bar{display:none;}
	
	div.itemHeader {
		margin-bottom: 15px;
		margin-top: 15px;
	}
	
	
	.zagolovki-h1 {
		clear: both;
		float: none;
		font-weight: normal;
		line-height: normal;
		margin: 0;
		padding: 0;
		text-align: center;
	}
	.zagolovki-h1 span {
    font-size: 20px !important;
	line-height: 1.4em; !important;
	}
	
	.zagolovki-h1 span::after, .zagolovki-h1 .itemTitle::after{display:none}
	
	
	
	.pg-categories-view .itemHeader1 {
		padding: 0 0px 10px;
	}
	.itemHeader1 {
		margin-bottom: 15px;
		margin-top: 15px;
	}
	
	
	div.mod-languages li {
		padding: 10px 6px;
		margin:0 10px;
	}


	.yjsquare {
		clear: both;
		display: block;
		margin: 0px 0px 0px 0px;
		overflow: hidden;
		padding: 0px 0px 0px 0px;
	}
	.mobile-lang{
		display:block;
		background:#fff;
	}
	.mobile-lang .lang-inline{
		width:100%;
		margin:0 auto;
		display:flex;
		justify-content:center;
	}
	.mobile-lang .lang-inline li a{
		font-size:14px;
	}
	span#yjmm_selectid {
		width: 97%;
	}
	.send_request:before {
		background: none;
		content: "";
		display: block;
		height: 32px;
		left: 50%;
		margin: auto auto auto -16px;
		position: absolute;
		top: 13px;
		width: 32px;
		z-index: 999;
	}
	.button-zayavka{
		background:#212528;
		border: 3px solid #212528;
		color: #fff;
		display: inline-block;
		font-size: 14px;
		height:auto;
		line-height: 20px;
		outline: 0;
		padding: 15px 48px;
		position: relative;
		text-transform: uppercase;
		z-index: 99;
	}
	.button-zayavka:hover{
		background: #fff;
		color: #212528;
	}
	
	#phocagallery .pg-center, #phocagallery-upload .pg-center, #phocagallery-subcategory-creating .pg-center {display:none;}
}

@media (min-width: 854px) {
	.mobile-logo{display:none !important;} .mobile-logo #header {
		display:none !important;
	}	
	
}

@media (min-width: 1025px) {
.sidebar-toggle-bar {
    display: none;
}
}