.mobile-application-preview{
    border: 1px solid #959595;
    width: 400px;
    height: 600px;
    overflow-y: scroll;
}

.html-preview-item{
    /*position: relative;*/
    border: 1px solid #959595;
    box-sizing: border-box;
    padding: 3px;
    background-color: #ffffff;
    margin-bottom: 3px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.html-preview-item:last-child{
    margin-bottom: 0;
}

.html-preview-item:hover,
.html-preview-item.active
{
    border: 1px solid #000000;
    background-color: #fff;
}

.html-preview-item:hover > .title-row,
.html-preview-item.active > .title-row
{
    /*transition: all 0.4s linear;*/
    display: block;
    /*opacity: 1;*/
    /*position: absolute;*/
    background-color: #acacac;
    color: #0f0f0f;
}

.title-row{
    /*display: none;*/
    /*opacity: 0;*/
    background-color: #cccccc;
    color: #0f0f0f;
    font-size: 10px;
    padding-left: 5px;
    margin: -3px -3px 3px -3px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.PageContentHtml > .title{
    border-bottom: 1px solid;
    font-size: 1.1em;
}

.page-content-row-double > .ItemButton{
    width: 49.5%;
    display: inline-block;
    margin-right: 1%;
    float: left;
}

.page-content-row-double > .ItemButton:last-child{
    margin-right: 0;
}

.page-content-row-triple > .ItemButton,
.page-content-row-flow > .ItemButton
{
    width: 32.66%;
    display: inline-block;
    margin-right: 1%;
    float: left;
}

.page-content-row-triple > .ItemButton:nth-child(3n),
.page-content-row-flow > .ItemButton:nth-child(3n)
{
    margin-right: 0;
}

.page-content-row-double:after,
.page-content-row-triple:after,
.page-content-row-flow:after
{
    content: " ";
    display: block;
    clear: both;
}

.button-image-preview{
    width: 65px;
    height: 65px;
    display: inline-block;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.mobile-application-preview .edit-button,
.mobile-application-preview .view-button,
.mobile-application-tree .edit-button,
.mobile-application-tree .view-button
{
    text-decoration: none;
    color: #000;
    background-color: #fff;
    padding: 0 5px;
    line-height: 13px;
    margin-right: 1px;
}

.navigation-bar .html-preview-item.NavigationItem{
    display: inline-block;
    float: left;
    box-sizing: border-box;
}

.navigation-container.nav-bar-bottom{
    width: 400px;
    height: auto;
}

.mobile-application-preview .child-count-2 > *{
    width: 49%;
    display: inline-block;
}

.mobile-application-preview .child-count-3 > *{
    width: 33%;
    display: inline-block;
}

.mobile-application-preview .child-count-4 > *{
    width: 24%;
    display: inline-block;
}

.mobile-application-preview .child-count-5 > *{
    width: 19%;
    display: inline-block;
}

.mobile-application-preview .child-count-6 > *{
    width: 16%;
    display: inline-block;
}

.mobile-application-preview .child-count-7 > *{
    width: 14%;
    display: inline-block;
}

.mobile-application-preview .child-count-8 > *{
    width: 12%;
    display: inline-block;
}

.mobile-application-tree .html-preview-tree-node > .html-preview-tree-node{
    margin-left: 5px;
    border-left: 1px solid #0a0a0a;
    padding: 5px 0 0 15px;
    box-sizing: border-box;
}

.mobile-application-tree .html-preview-tree-node-title{
    background-color: #cccccc;
    color: #0f0f0f;
    font-size: 10px;
    padding-left: 5px;
    margin: -3px -3px 3px -3px;
}

.mobile-application-tree .html-preview-tree-node:hover > .html-preview-tree-node-title,
.mobile-application-tree .html-preview-tree-node.active > .html-preview-tree-node-title
{
    background-color: #acacac;
    color: #0f0f0f;
}

.mobile-application-tree .no-tree-view,
.mobile-application-preview .no-preview{
    background-color: #ff2222;
}

.mobile-application-tree{
    border: 1px solid #959595;
    width: 100%;
    height: 600px;
    overflow-y: scroll;
    box-sizing: border-box;
    padding: 3px;
}