/* -----------------------------------
 * SB Hubyx
 * Version 0.4
 * Jul. 2018
 *
 * Written by Arturo Rojas Hernández.
 * http://www.elcubogris.com/
 *
 *
 */

html, body, #sb_hubyx_site, .sb_hubyx {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html, body {
	width: 100%;
}

html {
	height: 100%;
}

body {
	min-height: 100%;
	position: relative;
}

/*SIDEBAR*/

.sb_hubyx{
	width:250px;
	position:fixed;
	top:0px;
	left:-250px;
	height:100%;	
	z-index:9999;
	
	-webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
	
	transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -webkit-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);	
	
	overflow-y:auto;
	border-right:solid 1px rgba(255,255,255,1.00);
	box-sizing:border-box;	
	
}

.sb_hubyx_site{
	margin-left:0px;	
    
    /*
	-webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    */
	
	transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -webkit-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
	}

.sb_hubyx .sb_hubyx_menu{
	display:inline-block;	
	}
	
.sb_hubyx .sb_hubyx_menu{
	display:inline-block;	
	}
	
.sb_hubyx_scroll{
	overflow-y:scroll;	
	}

/*BOTONES*/

.sb_hubyx_btn{
	cursor:pointer;	
	}

.sb_hubyx a{
	display:inline-block;
	width:100%;
	padding:8px 15px;
	text-align:left;
	box-sizing:border-box;
	color:#FFFFFF;
	text-decoration:none;
	float:left;
	border-bottom:solid rgba(199,183,131,0.1) 1px;
	font-size:.7em;
	background:rgba(255,255,255,0);
	
	transition: all 0.3s; 
    -moz-transition: all 0.3s; 
    -webkit-transition: all 0.3s; 
    -o-transition: all 0.3s; 
    -ms-transition: all 0.3s; 
		
	}	
	
.sb_hubyx a:hover, .sb_hubyx .activo{
	background:rgba(255,255,255,.1)
}


.sb_hubyx a .subIcon{
    float: right;
    padding-top: 2px;
}

.sb_hubyx .submenu{
    float: left;
}
	
/*THEME*/

.sb_hubyx{
	background:rgba(0,0,0,.1); /*NEGRO TRANSPARENCIA*/
	}
	
.sb_hubyx a, .sb_hubyx .submenu a{
	color:#333;
	font-size:.85em;
	text-transform:uppercase;	
    border: 0px ;
    
	/*border-bottom:solid rgba(255,255,255,.5) 1px;
	border-top:solid rgba(0,0,0,.5) 1px;*/
	}
	
.sb_hubyx a:hover{
	background:rgba(0,0,0,.1);
	/*border-top:solid rgba(255,255,255,0) 1px;*/
	}

.sb_hubyx .submenu{
	display:inline-block;
	box-sizing:border-box;
	width:100%;
    display: none;
    background: rgba(255,255,255,0.3);
}

    
.sb_hubyx .submenu a{
    color:#707070;	
    padding-left: 25px;
	}
    
.sb_hubyx .activo{
	background:rgba(179,137,27,1.00);
    color: #FFFFFF;
}

.sb_hubyx .activo:hover{
    background:rgba(179,137,27,.8);
    color: #FFFFFF;
}

.sb_hubyx .submenu .activo{
    background:rgba(255,255,255,.4);
	color: rgba(179,137,27,1.00);
}

/*THEME DASHBOARD*/

.sb_hubyx.dashboard{
    background:rgba(31,72,142,1.00);
}


.sb_hubyx.dashboard .mpBlock, .menuBar .mpSub{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
}

.sb_hubyx.dashboard .mpSub{
    display: none;
    background: rgba(255,255,255,0.1);
}

.sb_hubyx.dashboard .mpSub .mpItem{
    padding-left: 25px;
}


.sb_hubyx.dashboard .mpItem{
	display:inline-block;
	width:100%;
	padding:15px 10px;
	box-sizing:border-box;
	color:#CDCDCD;
	text-decoration:none;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-ms-transition: all 0.3s;
    cursor: pointer;
	}
	
.sb_hubyx.dashboard .mpItem span{
	margin-right:8px;
	line-height: inherit;
	}
    
.sb_hubyx.dashboard .mpItem span.subIcon{
	margin-right:0px;
    float: right;
	}
	
.sb_hubyx.dashboard .mbItem:hover, .sb_hubyx.dashboard .activo{
	background:rgba(0, 0, 0, .5);
	color:#FFFFFF;
	text-decoration:none;
	}
	
.sb_hubyx.dashboard .mbParent{
	padding-left:10px;
	color:rgb(255, 255, 255);
	cursor:pointer;
	text-transform:uppercase;
	}
	
.sb_hubyx.dashboard .mbParent:hover, .sb_hubyx.dashboard .mbParent.activo{
	background:rgba(0, 0, 0, .3);
	color:rgb(255, 255, 255);
	}

	
/*MEDIA*/

@media (max-width: 820px) {
    .sb_hubyx {
		left:-250px;
    }
	
	.sb_hubyx_site{
		margin-left:0px;	
	}		
	
	.sb_hubyx_open{
		left:0px;
	}
		
	.sb_hubyx_site_open{
		margin-left:250px;	
	}
}

