/*
    DEMO STYLE
*/
@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";







/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

.wrapper {
   /* display: flex;*/
    width: 100%;
    align-items: stretch;
    /*perspective: 1500px;*/
}


/*
#sidebarRight {
   
    max-width: 20%;	
    background: #fff;
    color: #fff;
    transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
    transform-origin: right;
	overflow-x: hidden;
	position:absolute;
	top:115px;
	right:0px;
	
}
*/
/*************side bar Right************/
#sidebarRight {
  min-width: 242px;
  max-width:242px;
  background: #fff;
  color: #fff;
  transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
  transform-origin: right;
  /*position:fixed;*/
  position:absolute;
  top:150px;
  right:0px;
  border-left:thin #eee solid;
   
}

.is-edge #sidebarRight{
  min-width:16%;
  max-width:16%;
  top:10%;
}
.is-chrome #sidebarRight{ 
    min-width: 17.5%;
    max-width: 17.5%;
  top:10%;
}

#sidebarRight.active {
    display:none;
    
}

#sidebarRight .sidebar-header {
    padding: 30px;
    background: #fff;
}

/*************side bar left************/

#sidebarLeft {
  min-width: 242px;
  max-width:242px;
  background: #fff;
  color: #fff;
  transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
  transform-origin: right;
  /*position:fixed;*/
  position:absolute;
  top:150px;
  left:0px;
  border-right:thin #eee solid;
   
}
.is-edge #sidebarLeft{
  min-width:16%;
  max-width:16%;
  top:10%;
}
#sidebarLeft.active {
    display:none;
    
}

#sidebarLeft .sidebar-header {
    padding: 30px;
    background: #fff;
}



/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */


#sidebarRightCollapse {
    width: 40px;
    height: 40px;
 
    cursor: pointer;
	position:absolute;
	right: 260px;
    z-index: 100;
    top: 110px;
	border:none;
	
}
.circle-right{
	background:url(../../img/info/slide/circle-right.png) no-repeat;
	width:100%;
}

.circle-left{
	background:url(../../img/info/slide/circle-left.png) no-repeat;
	width:100%;	
}

#sidebarRightCollapse.active {
	right: 50px;  
    top: 110px;	

}
/* 

#sidebarRightCollapse span {
    width: 80%;
    height: 2px;
    margin: 0 auto;
    display: block ;
    background: #fff;
    transition: all 0.8s cubic-bezier(0.810, -0.330, 0.345, 1.375);
    transition-delay: 0.2s;	
	border:none;
	
}

#sidebarRightCollapse span:first-of-type {
    transform: rotate(45deg) translate(2px, 2px);
	
}
#sidebarRightCollapse span:nth-of-type(2) {
    opacity: 0;
	
}
#sidebarRightCollapse span:last-of-type {
    transform: rotate(-45deg) translate(1px, -1px);
	
}


#sidebarRightCollapse.active span {
    transform: none;
    opacity: 0;
    margin: 5px auto;
	border:none;		
	display:none;
}
*/
button:focus {
    outline: 1px dotted;
    outline:none;
}




  
@media ( min-width:1400px) {
	#sidebarRightCollapse{
   top: 120px;
   right: 440px;
}
#sidebarRightCollapse.active{
	right: 23px;  
    top: 120px;
	}
#sidebarRight {
    min-width: 200px;
    max-width: 200px;
    top: 150px;
}
#sidebarLeft {
    min-width: 200px;
    max-width: 200px;
    top: 150px;
}
}

@media ( min-width:1600px) {
#sidebarRightCollapse{
   top: 120px;
   right: 340px;
}
#sidebarRightCollapse.active{
	right: 23px;  
    top: 120px;
}
#sidebarRight {
  min-width: 285px;
  max-width: 285px;
  top:150px;
}

  #sidebarLeft {
    min-width: 280px;
    max-width: 280px;
    top: 150px;
  }

}






@media (min-width: 1920px) {
	#sidebarRightCollapse{
	top: 170px;
	right: 380px
	}
	#sidebarRightCollapse.active{
		right: 23px;  
		top: 110px;
	}
	#sidebarRight {
	  min-width:340px;
	  max-width:340px;
	  top:150px;
	}
	.is-edge #sidebarRight{
	  min-width:16%;
	  max-width:16%;
	  top:150px;
	}
	.is-chrome #sidebarRight {
    min-width: 17.8%;
    max-width: 17.8%;
    top:150px;
	}
	#sidebarLeft {
	  min-width:340px;
	  max-width:340px;
	  top:150px;
	}
	.is-edge #sidebarLeft{
	  min-width:16%;
	  max-width:16%;
	  top:150px;
	}
	
}

@media (max-width: 1200px) {
	#sidebarRightCollapse{
   top: 140px;
   right: 260px;
}
#sidebarRightCollapse.active{
	right: 23px;  
    top: 140px;
	}
#sidebarRight {
  min-width: 215px;
  max-width: 215px;
  top:70px;
}
#sidebarLeft {
	min-width: 210px;
	max-width: 210px;
	top: 80px;
}
}
@media (max-width: 1024px) {
  #sidebarRightCollapse  {
	 top: 150px;
	 right: 210px; 
  }
  #sidebarRightCollapse.active{
	right: 5px;  
	top: 150px;
  }
  #sidebarRight {
  min-width: 183px;
  max-width: 183px;
  right: 0px;
  top:80px;
 }	
#sidebarLeft {
	min-width: 180px;
	max-width: 180px;
	top: 80px;
}

}



 @media (max-width: 991px){
		 #sidebarRightCollapse , #sidebarRight , #sidebarLeft{
		 display:none;
		}
		
}
@media (max-width: 768px) {
    #sidebarRightCollapse , #sidebarRight , #sidebarLeft{
		 display:none;
	}
	
}
@media (max-width: 574px) {
	 #sidebarRightCollapse , #sidebarRight , #sidebarLeft{
		 display:none;
		}
}