#phMain{padding:4px; position:relative; background-repeat:no-repeat; width:99.9%;}

#njs{position:relative; top:250px;}
#extmenu{position:absolute; left:-2px; top:-412px; width:237px; height:64px; background-image:linear-gradient(128deg, #283c75cc, transparent); opacity:0;}
#extmenu:hover{opacity:.8;}

.extjs{position: relative; color: snow; float: right; background: #001D49;
       border: solid 0px #777;
       font-size: 9px;
       text-align: right;
       height: 30%;
       width:33.34%;
       top: 83px;
       left: 2px;
       cursor: pointer;
}
.extjs:hover {border: 1px solid aqua;}
#l { display: block; color: white; opacity: .07; position: relative; top: -367px; width: 220px; height:16px; left: 430px; text-align:center; background:slateblue;}
#l:hover{opacity:1;}

.nk7{width:17px;}

.mt-3.clearfix{padding: 5px 3px 3px 5px; margin-top: .5rem !important; overflow:auto;}

.clearfix{padding: 1px 5px 1px 5px; width:99.9%; background-repeat: no-repeat;}
.clearfix img{position: relative; transform: scaleX(.8) scaleY(.8);}

.ramecek:nth-child(2) img{transform:unset;}

.emoji{top:2px; display: inline-grid;}
.emoji img::after{content: attr(title); visibility:visible; font-size:80%; float:right;}
.emoji img{visibility:collapse; top:-215px;}
.emoji::before{content: 'Reakce u svých děl: 'attr(title);}

.mt-2.pt-2.border-top {width:75%; position:relative; left:20%; font-size:85%; top:-10px; opacity:.5;}
.mt-2.pt-2.border-top:hover{opacity:1;}

.p-2{padding-left: 0.05rem !important; padding-right: 0.05rem !important; background-repeat:no-repeat;}

.mt-2.ramecek:nth-child(4) {position:absolute; top:calc(100% - 90px); width:23%; left:100%; margin-left:1%; opacity:0; color:transparent;}
.mt-2.ramecek:nth-child(4):hover{opacity:1;}

#fotopage{position:relative; padding:1%; background:#003; width:99%;}

.x {position: relative; width: 15px; left: 96%; top: -50px; text-align: center; cursor: pointer; opacity:.8;}
.x::after{content:"x"; color:snow;}

.xjsp{color:snow; margin: 15px 8px 10px 4px; padding:1%;}

.alert {padding: 2px;  margin-bottom: 2px;}

.imgnote {font-size:85%;}

.j { 
   width: 101%;
   margin-top: 15px;
   top: 58%;
   position: relative;
}

.j:hover{animation: 120s 1 delay-overflowa .2s;}

#cas{color:snow; position: relative; text-align: center; opacity:0; height:25px;}

#tlist{position:absolute; width:165px; top:25px; opacity:.03; height:20px; text-align:center; background:#001259; display:block;}
#tlist:hover{opacity:1;}

#skin{position:relative; left:81px; top:25px; font-size:90%; width:20px; opacity:0; color:snow; background:navy;}
#skin:hover{opacity:1;}
/* #skin option:{background-image:unset;} */
#dclr{display:none;}
.nkref{position:relative; width:20px;}
.refdila{left:4%; top:-70px;}
.refkom1{left:37%; top:-86px;}
.refkom2{left:70%; top:-102px;}

.xjs {font-size:85%; text-align:right; position: relative; left:-5px;}
.xjs button, .xjsm button { background:none; cursor:pointer; width:23px; position: relative;}
.xjsm button {border: 1px solid transparent;}

.xjsm {font-size: 60%; height:20px; width:20px; position:relative; background:inherit;}
.xjsmenu {font-size:130%; height:20px; width:64%; position:relative;}

@keyframes delay-overflowa {
  from { overflow: auto; }
}

@keyframes o1 {
  from {opacity:initial;}
  to {opacity:0;}
}
@keyframes o0 {
  from {opacity:inherit;}
  to {opacity:1;}
}