﻿/* Super Panel: www.menucool.com/ui/super-panel */


/*---- panel ----*/
#panel1 {
    position:fixed;
    z-index:939597;
    top:0;bottom:0;
    left:auto;right:0;/*align to the right*/
    width:450px;height:100%;
    overflow:auto;
    padding:0;
    box-sizing:border-box;
    box-shadow:-4px 0 18px rgba(0,0,0,0.2);
    visibility:hidden;
}
#panel2 {
    position:fixed;
    z-index:939597;
    top:1.875em;bottom:0;
    left:3%;right:auto;/*align to the right*/
    width:450px;height: calc(100% - 2.275em);
    overflow:auto;
    padding:0; 
    box-sizing:border-box;
    box-shadow:-4px 0 18px rgba(0,0,0,0.8);
    visibility:hidden;
}

/*---- transparent layer ---- Available when the option transparentLayer is true in pane-panel.js */
.transparent-layer {
    position:fixed;
    top:0;left:0;right:0;bottom:0;
    width:100%;height:100%;
    background-color:rgba(0,0,0,0.4);
    display:none;
    -webkit-transition:opacity 0.3s;
    transition:opacity 0.3s;
}



/*---- panel button ----*/
.panel-button{
    -ms-user-select:none;
    -mos-user-select:none;
    -webkit-user-select:none;
    -o-user-select:none;
    user-select:none;
	cursor: pointer;
}

#panel2 .panel-button,#panel1 .panel-button{
	font-size:1.2em;
	width:90%;
	padding:0.5em 5%;
	display:inline-block;
	color:rgb(0,22,72);
	text-transform:uppercase;
	text-align:right;}
#panel1 .panel-button{color:rgb(255,255,255);}
