
/*-----------------
FIXED BOX
Resten av CSS finns i page_header.php
------------------*/
#fixedbox {
	z-index:6;
	position:fixed;
	top: 0;
	left: -199px;
	height:100%;
	transition:.25s;
}
#fixedbox.open-fixedbox {
	left:0px;
}
#fixedbox .fixedboxwrapper, #fixedbox .fixedboxwrapperoffline {
	background-color:white;
	border-right:3px solid #000000;
	width: 199px;
	height: 100%;
}
#fixedbox .fixedboxwrapperoffline {
	border-right-color: #000000;
}
#fixedbox label.tabbutton {
	display:inline-block;
	vertical-align:bottom;
	padding:8px 10px;
	font-size:0.9rem;
	color:#888;
	text-align:center;
	border-radius:6px 6px 0 0px;
	box-shadow:1px 0px 5px 0 rgba(0,0,0,.26);
	background:#fafafa;
	transition:.2s;
	margin:0;
	cursor:pointer;
}
#fixedbox label.tabbutton.ui-state-hover {
	padding:1.1em;
}
#fixedbox input[type="radio"]:checked + label {
	background:#ff0099;
	color:white;
	text-transform:capitalize;
}
#fixedbox .lbtaboffline input[type="radio"]:checked + label {
	background:#000000;
	color:white;
}
#fixedbox label.tabbutton:hover {
	background:white;
	color:#000000;
}
/* #fixedbox .fixedlightbox, #fixedbox .fixedimagebank, #fixedbox .fixedpackage, #fixedbox .fixedsubscriptions { */
#fixedbox .fixedboxcontent {
	padding:6px;
	display: flex;
    flex-direction: column;
	width:100%;
	position:relative;
	height:100%;
}
#fixedbox #subscriptionsdisplay {
	height:100%;
	overflow:auto;
}
#fixedbox .fixedlightbox {
	display:none;
}
#fixedbox .fixedimagebank {
	display:none;
}
#fixedbox .fixedpackage {
	display:none;
}
#fixedbox .fixedpackage .imgslot {
	width: 100%;
    text-align: center;
    background: #fafafa;
    color: #aaa;
    padding: 1.5em 1em;
    margin-bottom: 3px;
    font-size: 2em;
    font-family:OpenSansLight;
    box-shadow: inset 0 1px 5px 0 rgba(0,0,0,.26);
}
#fixedbox .fixedpackage .imgslot:hover {
	background:#f5f5f5;
}
#fixedbox .fixedpackage .imgslot.ui-state-hover {
	background:#ff0099 ;
	color:white;
}
.imagebox.ui-draggable-dragging {
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
}
#fixedbox .picContainer, #fixedbox #imagebankdisplay {
	height:calc(100% - 80px);
	overflow:auto;
}

#fixedbox .lbonepic {
	width:100%;
	float:left;
	height:auto;
	position:relative;
	margin-bottom:3px;
}
.topiconopt i {
	font-size:1.5em;
}
.topiconbtn:hover {
	color:#ff0099;
}
#fixedbox .fbtitle {
	color:black;
	padding:2px;
}
#fixedbox select {
	width:100%;
	background-color:#fff;
	color:#333;
	font-size:0.8em;
}
#fixedbox div.minibuttons {
	display:flex;
	justify-content: center;
	column-gap:0.25rem;
}
#fixedbox .minibuttons a {
	display:inline-block;
	margin:6px 0;
	padding: 0.4rem;
    flex: 1;
    text-align: center;
	font-size:1.3rem;
}
#fixedbox .minibuttons a:hover {
	
}
#fixedbox .lbtab {
	position: absolute;
    bottom: 50%;
    left:214px;
    width:0;
    color: white;
    border-radius: 0 0.5em 0.5em 0;
    border-left: 0;
    padding: 12% 0%;
    cursor:pointer;
    text-decoration:none;
    z-index:-1;
    margin-bottom:50%;
}
#fixedbox #prendisplay {
	overflow: scroll;
}
.verticaltext {
	transform:rotate(90deg);
	-ms-transform:rotate(90deg);
	-moz-transform:rotate(90deg);  
	-webkit-transform:rotate(90deg);  
	-o-transform:rotate(90deg);  
	-ms-transform:rotate(90deg);  
	display:inline-block;
	white-space:nowrap;
	width:0;
}
#fixedbox .verticaltext {
	
}
#fixedbox img.icon {
	height:20px;
	width:auto;
}

#fixedbox table, #fixedbox td {
	vertical-align:top;
	height:100%;
	width:100%;
}
#fixedbox .lbsketchpic {
	display:inline-block;
	width:100%;
}
#fixedbox .lbsketchpic img {
	width:100%;
	height:auto;
	vertical-align:top;
}
.lbicons {
	position:absolute;
	bottom:-1px;
	left:0;
	width:100%;
    text-align: center;
    font-size:0.8em;
}
.lbonepic:hover .lbicons i.material-icons {
	transform:scale(1);
	opacity:1;
}
.lbonepic:hover .lbicons span.smallpicname {
	opacity:1;
}
.lbicons i.material-icons {
	cursor:pointer;
	color:black;
	background-color:white;
	padding:0.5rem;
	border-radius:50%;
	font-size:1.5rem;
	transition:.1s;
	opacity:0;
	transform:scale(0.6);
	margin:1rem 0.5rem;
	box-shadow:0px 2px 3px 0 rgba(0,0,0,.5);
}
.lbicons i.material-icons:hover {
	color:white;
	background-color:#ff0099;
}
.lbicons span.smallpicname {
	opacity:0;
	width: 100%;
    display: block;
    background: rgba(0, 0, 0, 0.5);
    padding: 0.5rem;
    color: white;
}
.fixedboxcard {
	padding:1rem;
	font-size:1rem;
	border-radius:1rem; 
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	color:#777;
}