/*
    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;*/
}


/*
#sidebar {
   
    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;
	
}
*/


#sidebar {
  min-width: 257px;
  max-width:257px;
  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:90px;
  right:0px;
  border-left:thin #eee solid;
   
}




#sidebar.active {
    display:none;
    
}

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


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


#sidebarCollapse {
    width: 40px;
    height: 40px;
 
    cursor: pointer;
	position:absolute;
	right: 300px;
    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%;
	
}

#sidebarCollapse.active {
	right: 2px;  
    top: 110px;	

}
/* 

#sidebarCollapse 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;
	
}

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


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

@media (min-width: 1366px) {
	#sidebarCollapse{
   top: 120px;
   right: 280px;
}
#sidebarCollapse.active{
	right: 23px;  
    top: 120px;
	}
#sidebar {
  min-width: 274px;
  max-width: 274px;
 top:90px;
}

}
   
 
@media ( min-width:1400px) {
	#sidebarCollapse{
   top: 120px;
   right: 340px;
}
#sidebarCollapse.active{
	right: 23px;  
    top: 120px;
	}
#sidebar {
  min-width: 320px;
  max-width: 320px;
 
}

}


@media (min-width: 1920px) {
	#sidebarCollapse{
    top: 130px;
	right: 410px; 
   
	
}
#sidebarCollapse.active{
	right: 23px;  
    top: 130px;
	}
#sidebar {
  min-width: 385px;
  max-width: 385px;
  top:120px;
}


}



@media (max-width: 1200px) {
	#sidebarCollapse{
   top: 150px;
   right: 250px;
}
#sidebarCollapse.active{
	right: 23px;  
    top: 150px;
	}
#sidebar {
  min-width: 240px;
  max-width: 240px;
 top:120px;
}

}
@media (max-width: 1024px) {
      #sidebarCollapse  {
		 top: 130px;
	    right: 210px; 
		}
		#sidebarCollapse.active{
		right: 5px;  
		top: 130px;
	}
       #sidebar {
      min-width: 205px;
      max-width: 205px;
      right: 0px;
	  top:60px;
     }
}



 @media (max-width: 991px){
		 #sidebarCollapse , #sidebar {
		 display:none;
		}
		
}
@media (max-width: 768px) {
    #sidebarCollapse , #sidebar {
		 display:none;
		}
	
}
@media (max-width: 574px) {
	 #sidebarCollapse , #sidebar {
		 display:none;
		}
}