.draggable {
    position: fixed;
    top:100px;
    left:100px;
    border:0px none;
    border-radius:10px;
    background:rgba(255,255,255,0.5);
}

.draggable img{
    float:right;
}

.draggable > .header{
    width:100%;
    height:20px;
    /*background:#b6ff00;*/

}

.draggable iframe {
    border: 0;
    overflow: hidden !important;
}

.draggable > .content {
    width:calc((100%) - 20px);
    margin: auto;
    border: 4px solid rgba(128,128,128,0.5);
    border-radius: 8px;
    background:#EEE;
    height:calc((100%) - 34px);
}

.draggable > .header span {
    width:102px;
    margin: 2px 0 0 10px;
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
    cursor:move;
}

.draggable > .header > img{
    margin:5px 10px 0 0;
    cursor:pointer;
}

/*.draggable > .header img:nth-of-type(1) {
    margin: 4px 0 0;
    position: absolute;
    left: 163px;
    cursor:pointer;
}
.draggable > .header img:nth-of-type(2) {
    margin: 4px 10px 0 0;
    float: right;
    position: relative;
    cursor:pointer;
}*/

.noheader
{
    background: 0;
}

.noheader > .header
{
    visibility: hidden;
}

.noheader > .content
{
    background:0;
    border: 4px solid rgba(128,128,128,0);
}
    
.noheader:hover
{
    background: rgba(255,255,255,0.4);
}

.noheader:hover > .header
{
    visibility: visible;
}

.noheader:hover > .content
{
    background:rgba(255,255,255,0.1);
    border: 4px solid rgba(128,128,128,.5);
}