/*
* C U S T O M   C S S
* referenzenmanager.de
* (c) 2015 mondayVision UG (haftungsbeschr�nkt)
*
***********************************************************************************************************************/



/*
*
*  P A G E
***********************************************************************************************************************/
html, body {
    height: 100%;
}

body {
    padding-top: 50px;
    font-family: 'Source Sans Pro',sans-serif;
    background: #f5f5f5;
}
body.home {
    background: #ffffff;
}

.compositionContainer {
    position:fixed;
    z-index:10;
    top:0;
    left:0;
    width:350px;
    height:100%;
    background:#f5f5f5;
    padding: 50px 15px 0 15px;
}

.contentContainer {
    position:relative;
    z-index:15;
    background: #ffffff;
    min-height:100%;
    padding-top:20px;
    padding-bottom:40px;
}

.loginContainer {
    position:relative;
    max-width:500px;
    background: #ffffff;
    margin-top:50px;
    padding-top:20px;
    padding-bottom:40px;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}

.h1, h1 {
    font-size: 32px;
}
.h2, h2 {
    font-size: 28px;
}
.h3, h3 {
    font-size: 20px;
}

.page-header {
    margin:40px 0;
}

td {border: 1px solid #ddd;}

.label-xs {padding-left:0;padding-right:0}

/*
*
*  N A V I G A T I O N
***********************************************************************************************************************/
.btn-navbar, .btn-navbar:focus {
    background:none;
    border-color: #fff;
    color: #fff;
}

.btn-navbar:hover, .btn-navbar.active, .btn-navbar.active:focus {
    background:#fff;
    border-color: #fff;
    color: #000;
}

/*
*
*  P A G I N A T I O N
***********************************************************************************************************************/
.pagination {
    margin:5px 0 15px;
}
.pagination-container .btn {
    vertical-align: top;
    margin: 5px 5px 15px 0;
}


/*
*
*  E L E M E N T S
***********************************************************************************************************************/
#compositionFilterBox {
    margin-bottom:20px;
}

.allCompositionScroll {
    height: calc(100% - 128px);
    overflow-y:auto;
    overflow-x:hidden;
}

#allCompositionContainer {
    margin-bottom:20px;
}

#allCompositionContainer .list-group-item {padding:0;position:relative;border-radius: 0 !important;}
#allCompositionContainer .list-group-item:hover {background-color:#f0f0f0}
#allCompositionContainer .list-group-item.active:hover {background-color:#ffffff}
#allCompositionContainer .list-group-item a.composition-link {display:block;padding:10px 10px;margin-right:30px;text-decoration: none !important;position:relative;z-index:2;}
#allCompositionContainer .list-group-item .status-icons {position:absolute;top:10px; right:5px;}

.compositionDetailContainer {
    display:none;
    padding:10px;
}

.compositionDetailContainer .nav > li > a {padding:10px 5px;}

.badgeClose {
    position: absolute;
    right: 5px;
    top: 32px;
    width: 25px;
}
.badge-success {
    background-color: #85c744;
}
.badge-success[href]:hover,
.badge-success[href]:focus {
    background-color: #6ca632;
}

.lockContainer {
    position: absolute;
    left: 4px;
    top: 1px;
    color: #F9E962;
    font-size:30px;
    z-index:0;
}



/* Custom Styles */
#page-container {overflow:visible;}
#wrap {overflow:visible;}

#page-content {margin-left:0}
footer {margin-left:0}

#rightmenu-trigger {
    margin-right:20%;
    color: #AAAAAA;
    line-height: 20px;
    display: block;
    padding: 10px 15px;
    position: relative;
    background:none;
    text-decoration: none !important;
    width:175px;
    float:left;
    font-weight:bold;
}
#rightmenu-trigger:hover {
    color: #3f444C;
    background-color: #d2d3d6;
}

.show-rightbar #rightmenu-trigger {
    color: #3f444C;
    background-color: #d2d3d6;
}
#wrap > .container {
    padding: 40px 20px;
}
#page-rightbar {width:400px}

.sortable li.placeholder {outline: 1px dashed lightgray;}
.mjs-nestedSortable-error {background: #fbe3e4;border-color: transparent;}

ol.sortable, ol.sortable ol {margin: 0 0 0 30px;padding: 0;list-style-type: none;}
ol.sortable ol li div span.column2 {display:inline-block;width:70px;}

ol.sortable {margin: 10px 0 0 0px}

.sortable li {margin: 5px 0 0 0;padding: 0;}
.sortable li div {border:1px solid lightgray;padding:10px;}
.sortable li div.columnGroup {background-color: #eeeeee;}

.sortable li div span.column1 {display:inline-block;width:350px;}
.sortable li div span.column2 {display:inline-block;width:100px;}
.sortable li div span.column3 {display:inline-block;width:165px;}
.sortable li div span.column4 {display:inline-block;}

.disclose {cursor: pointer;width: 20px;display: inline-block;padding:3px 0;font-weight:bold;}
.sortable li.mjs-nestedSortable-collapsed > ol {display: none;}
.sortable li.mjs-nestedSortable-branch > div > .disclose {display: inline-block;}
.sortable li.mjs-nestedSortable-collapsed > div > .disclose > span:before {
    display: inline-block;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f055";
}
.sortable li.mjs-nestedSortable-expanded > div > .disclose > span:before {
    display: inline-block;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f056";
}









.sortable .sortable-container {
    border:1px solid #afb4b9;
    margin-left:20px;
    height:35px;
}
.sortable .sortable-marker  {display:inline-block;width:3px;height:33px;line-height:33px;}
.sortable .sortable-marker-green    {background:#2ecc70;}
.sortable .sortable-marker-red      {background:#e64d5f;}
.sortable .sortable-info    {display:inline-block;}
.sortable .sortable-btn  {display:inline-block;padding:5px 10px;}



.disclose {
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    padding: 3px 0;
    width: 20px;
    margin-left:-20px;
}









.gallery-image-website {
    border-bottom: 3px solid #60BD68;
}

.rotate1 {
    display: inline-block;
    overflow: hidden;
    width: 1.5em;
    line-height: 1.5;
}
.rotate1 .inner {
    display: inline-block;
    white-space: nowrap;
    -webkit-transform: translate(0,100%) rotate(-90deg);
    -moz-transform: translate(0,100%) rotate(-90deg);
    -ms-transform: translate(0,100%) rotate(-90deg);
    -o-transform: translate(0,100%) rotate(-90deg);
    transform: translate(0,100%) rotate(-90deg);
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;

    /* Should be unset in IE9+ I think. */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
.rotate1 .inner:after{ content: "";float: left;margin-top: 100%;}
.tdRotate1 {text-align: center;vertical-align: middle !important;}


.rotate1.size2 .inner {
   white-space: normal;
   line-height:100%;
}


.size1 {font-size:18px;font-weight: bold;}
.size2 {font-size:16px;font-weight: bold;}
.size3 {font-size:10px;}


table.columnTable th {background-color:#ffffff}


/* Upload */
.uploadContainer     {width:110px; height:150px;float:left;margin-right:10px;}
.uploadLoaderGif     {margin:5px 40px;}
.uploadError         {margin:5px 40px;display:none;}
.uploadText          {height:57px;}
.uploadPreview       {}
.uploadProgress      {border:1px solid #2d5c88;}
.uploadProgress .bar {background: #2d5c88;height:8px;}
.uploadText.error    {color: #B94A48;}

.preview-image-container {
    display:flex;
    flex-direction: row;
}
.preview-image {
    width:120px;
    padding-right:10px;
}
.preview-image img {
    width:100%;
}

.website-preview {
    border:1px solid #cccccc;
    padding:20px;
    margin-bottom:10px;
}



.fileinput-button {
    overflow: hidden;
    position: relative;
}
.fileinput-button input {
    cursor: pointer;
    direction: ltr;
    font-size: 200px;
    margin: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
}
@media screen {
    .fileinput-button input {
        font-size: 100%;
        height: 100%;
    }
}
.img-polaroid {
    padding: 4px;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}


/*
* Columntype: IMAGE
*******************************************************/
.img-edit-container {
    position:relative;
    height:150px;
    width:150px;
}
.img-edit-overlay {
    background: #ffffff;
    position:absolute;
    bottom:0;
    height:35%;
    width:100%;
    opacity:0.8;
    -webkit-transition: height 0.1s; /* For Safari 3.1 to 6.0 */
    transition: height 0.1s;
    padding:5px;
    overflow:hidden;
}
div.img-edit-display {
    display:block;
    font-size:11px;
}
div.img-edit-display-website {
    background: #b1ff84;
}

div.img-edit-edit {
    display:none;

}
div.img-edit-edit label {
    margin:0;
    font-size:11px;
}

div.img-edit-edit .btn-delete {
    float: right;
    margin-top: 10px
}
div.img-edit-edit .form-control {
    height:24px;
    font-size:11px;
    padding:0 3px;
}
.img-listing {
    height:100px;
}


.img-edit-overlay:hover {
    height:200%;
    opacity:1;
    border:1px solid #ccc;
    box-shadow: 0 0 20px rgba(0,0,0,0.1);
}
.img-edit-overlay:hover div.img-edit-display {
    display:none;
}
.img-edit-overlay:hover div.img-edit-edit {
    display:block;
}




#textLogo {font-size:20px;letter-spacing: -1px;line-height: 39px; color:#dddddd;text-decoration:none;font-family:'Source Sans Pro','Segoe UI','Droid Sans',sans-serif;padding:5px 0 5px 20px;}

.columnTable td {padding:5px !important;}

tr.placeholder td {
    height:150px;
    background: #D9EEFF !important;
}
.noLoadedComposition tr.placeholder td {
    background: #ffada1 !important;
    color:#ffffff;
}

.sorthandle       {cursor: move}
.ui-state-hover {background: #D9EEFF !important;}


.filterBox .form-control    {padding:0 2px;height:24px;}
.filterBox .btn             {padding:2px;color:#ffffff}
.filterBox .form-group      {margin-bottom: 0}
.filterBox a                {color:#4D4D4D;}
.filterBox a.filterActive   {color:#B94A48;}
.filterBox .popover {max-width:400px;width:400px;}

a.sortButton.sortActive     {color:#B94A48;}

a.compositionAdd            {color:#aaaaaa}
a.compositionAdd.active     {color:#337ab7 !important}

a.compositionRemove         {font-size: 20px;color:#B94A48}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus  {
    background-color: #FFFFFF;
    border-color: #337ab7 !important;
    border-width:1px 1px 1px 10px;
    color:#4d4d4d;
}


#mainMenuLeft               {margin-left:40px;border-left:1px solid #222222;}


.filterTriangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 15px 15px;
    border-color: transparent transparent #337ab7 transparent;
    border-style: inset;
    -webkit-transform:rotate(360deg);
    cursor: pointer;
}

.filterActive   .filterTriangle {border-color: transparent transparent #B94A48 transparent;}
.sortActive     .filterTriangle {border-color: transparent transparent #B94A48 transparent;}


/* Export */
.reportTemplateContainer {}
.reportTemplateContainer ul {
    margin-bottom: 10px;
    margin-left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-left: 5px;
    list-style: none;
    border:1px solid #ddd;
    padding-bottom:2px;
}
.reportTemplateContainer p {margin:5px 0}
.reportTemplateContainer ul li ul {margin-left:21px;padding-top:0;border-width: 0;height:auto;min-height:auto}

.reportTemplateContainer a.reportTemplate {
    display: inline-block;
    line-height: normal;
    padding: 0 5px;
    transition: all 0.1s ease-in 0s;
    white-space: nowrap;
    vertical-align: bottom;
    text-decoration: none;
}

.reportTemplateContainer ul li ul a {margin-top:2px;}
.reportTemplateContainer a.reportTemplate:hover {color:#333333;text-decoration:none;background-color:#dddddd}

.reportTemplateContainer a.reportTemplate.rtSelected {
    background: none repeat scroll 0 0 #777777;
    color: #FFFFFF;
}

#columnContainer {
    padding-left:108px;
    padding-bottom:10px
}

a.rtToggle               {display: inline-block;font-size: 10px;line-height: 18px;text-align: center;width: 16px;background-color: #777777 !important;color:#ffffff !important; vertical-align: top;text-decoration: none}
a.rtToggle.hiden:before  {content: "+";}
a.rtToggle:before        {content: "-";}

.rtIcon             {display: inline-block;font-size: 10px;line-height: 18px;text-align: center;width: 24px;}
.rtIcon-container   {display:none;}
.rtIcon-pdf         {background-color: #DE0D13;color:#ffffff}
.rtIcon-pdf:after   {content:"pdf"}
.rtIcon-xls         {background-color: #B1C700;color:#333333}
.rtIcon-xls:after   {content:"xls"}
.rtIcon-html        {background-color: #0081c2;color:#ffffff}
.rtIcon-html:after  {content:"html"}


/* Download */
.mediatypeContainer {}
.mediatypeContainer p {margin:5px 0}
.mediatypeContainer ul {
    margin-bottom: 10px;
    margin-left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-left: 5px;
    list-style: none;
    border:1px solid #ddd;
    padding-bottom:2px;
}
.mediatypeContainer ul li ul {margin-left:21px;padding-top:0;border-width: 0;height:auto;min-height:auto}

.mediatypeContainer a.mediatype {
    display: inline-block;
    line-height: normal;
    padding: 0 5px;
    transition: all 0.1s ease-in 0s;
    white-space: nowrap;
    vertical-align: bottom;
    text-decoration: none;
}

.mediatypeContainer ul li ul a {margin-top:2px;}
.mediatypeContainer a.mediatype:hover {color:#333333;text-decoration:none;background-color:#dddddd}

.mediatypeContainer a.mediatype.rtSelected {
    background: none repeat scroll 0 0 #777777;
    color: #FFFFFF;
}

.editContainer p {margin:5px 0}




.miniSelect {
    border:1px solid #dddddd;
    float:left;
    width:40px;
    height:50px;
    border-radius:3px;
    padding:5px;
    text-align:center;
}

.colorBlock {
    width:100%;
    height:20px
}





.savedReportContainer {margin-bottom:0px}
.savedReportContainer ul {
    border:1px solid #DDDDDD;
    border-radius: 2px;
    margin-bottom: 10px;
    margin-left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 5px;
    height:80px;
}
.savedReportContainer .srLeft {float:left;width:94%}
.savedReportContainer .srRight {float:right;width:5%}



.savedReportContainer a.savedReport {
    background: none repeat scroll 0 0 #FFFFFF;
    display: inline-block;
    line-height: normal;
    padding: 0 5px;
    transition: all 0.1s ease-in 0s;
    white-space: nowrap;
    width: 90%;
    vertical-align: top;
    text-decoration: none;
}
.savedReportContainer a.savedReport:hover {color:#333333;text-decoration:none;background-color:#dddddd}

.savedReportContainer a.savedReport.srSelected {
    background: none repeat scroll 0 0 #777777;
    color: #FFFFFF;
}
.savedReportDeleteBox {}


a.onlyName {
    text-decoration: none !important;
    color:#454951 !important;
}

th.group {border-bottom-width: 0 !important}
th.groupChild {border-top-width: 0 !important}

#currentCompositionContainer {min-height:350px;}

.node.level1 {white-space: nowrap}
