/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 21.01.2017, 15:42:26
    Author     : Jakob
*/

/* side options */

.disable-desktop-scrollbars::-webkit-scrollbar,
.disable-desktop-scrollbars *::-webkit-scrollbar,
.disable-desktop-scrollbars::-webkit-scrollbar-track,
.disable-desktop-scrollbars::-webkit-scrollbar:vertical,
.disable-desktop-scrollbars *::-webkit-scrollbar:vertical,
.disable-desktop-scrollbars::-webkit-scrollbar-track:vertical,
.disable-desktop-scrollbars::-webkit-scrollbar-thumb,
.disable-desktop-scrollbars::-webkit-scrollbar-track{
    width: 0px !important;
    background-color: transparent !important; /* Chrome/Safari/Webkit */
    box-shadow: none !important;
    height: 0px !important;
}

.disable-desktop-scrollbars {
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important;  /* IE 10+ */
}

body {
    font-size: 12px;
}

a.default {
    font-size: 12px;
}
button, button.button {
    font-size: 8pt;
}
.button.small {
    font-size: 12px;
}

.button {
    margin: 5px;
    padding: 5px 10px 5px 10px;
}
/*button, button.button {
    padding: 1px 8px 1px 8px;
}*/

/*.font-size-18 {
    font-size: 16pt;
}
.font-size-16 {
    font-size: 14pt;
}
.font-size-14 {
    font-size: 12pt;
}
.font-size-12, a.default.font-size-12 {
    font-size: 10pt
}
.font-size-11, a.default.font-size-11 {
    font-size: 9pt;
}
.font-size-10 {
    font-size: 8pt;
}
.font-size-9 {
    font-size: 7pt;
}*/

.jp-form-style label {
    font-size: 12px;
}
.jp-form-style input,
.jp-form-style select,
.jp-form-style .checkbox + label>span,
.jp-form-style textarea {
    font-size: 10px;
    padding: 6px;
}

.jp-form-style textarea {
    min-height: 55px;
}

/*.form-control {
    height: 27px;
}*/

#hw {
    height: 44px
}
.hw-container {
    height: calc(100% - 50px);
    top: 49px;
    margin-bottom: 0;
}
nav.navbar, .flex nav.navbar {
    height: 44px;
    min-height: 44px;
    line-height: 44px;
}
.top-menu {
    line-height: 44px;
}
nav.navbar .navbar-brand .image-wrapper {
    line-height: 45px;
}
nav.navbar .btn-group {
    min-height: 45px;
    height: auto;
    line-height: 25px;
    font-size: 12px;
    margin-left: 0px;
}
nav.navbar .btn-group>a {
    min-height: 45px;
    height: auto;
}
nav.navbar .btn-group>a {
    font-size: 8px;
    line-height: 10px;
    padding: 6px 8px;
    padding-left: 4px;
    margin-left: 4px;
    min-height: 51px;
}
nav.navbar .btn-group .dropdown-menu>li>a {
    line-height: 32px;
    font-size: 11px;
}
.notification-top a span {
    padding: 12px 0px;
}
nav.navbar .top-menu a.dropdown-toggle .user-img {
    margin-top: 4px;
    margin-bottom: 0px;
}
nav.navbar .gamepoint_icon {
    margin: 0px 5px;
    margin-right: 0px;
    margin-top: 1px;
}
nav.navbar .top-menu .image-wrapper .image-wrapper.user-img.round-img {
    margin: 2px;
}

.top-menu .user-img-wrapper span.caret {
    margin-top: 17px;
}

.nav.nav-tabs>li a {
    font-size: 9pt;
}
.jp-tabs.nav.nav-tabs li a {
    padding: 8px 4px;
}
.dropdown-menu {
    font-size: 12px;
}
.dropdown-menu>li>a {
    line-height: 24px;
}

#global-search #global-search-input {
    line-height: 30px;
    font-size: 10pt;
}
#global-search .ui-autocomplete li a.clickable-result {
    font-size: 11px;
}

.notify-container ul li a {
    font-size: 10px;
}
.full #main-content .row.mainframe-row>div {
    width: 100%;
}
.team-member {
    width: 36px;
    height: 36px;
}

.sub-nav-menu li a {
    font-size: 11px;
}

#side-options-content .main {
    height: 44px;
    line-height: 44px;
}
#side-options-content .main .icon-wrapper {
    height: 44px;
    padding-top: 2px;
}
#side-options-content .main .user-img.round.team-member {
    margin-top: 2px !important;
}
#side-options-content .main .btn-group.task-status {
    left: 33px;
    top: 15px;
}

.jp-options .btn-group, .jp-options a {
    margin-right: 5px;
}

#jp-posting,
.pointflow .info, .page-content.padding.nav-wrapper.info,
.pointflow .time-mark,
.timeline-filters,
.info-based,
info-based.nav-wrapper.info {
    width: 80%;
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
}
#dashboard-newsfeed #jp-posting,
#dashboard-newsfeed .pointflow .info {
    max-width: 100%;
    width: 100%;
}
.social-inbox textarea,
.highlighter, .element,
.social-inbox .input,
.social-inbox .input:focus {
    font-size: 10pt !important;
    line-height: 18px !important;
}
.posting .bt-send:hover, .posting .bt-send:focus, .posting .bt-send {
    font-size: 13px;
    z-index: 1
}
.posting .special-input, .posting .special-input:focus {
    line-height: 26px;
    font-size: 9pt;
}
#jp_posting_sel_wrapper .tab-content a {
    line-height: 28px;
    padding: 3px 5px;
}
#jp_posting_sel_wrapper .tab-content {
    height: 230px;
}
#dashboard-newsfeed #jp-posting .col-sm-4 {
    width: 100%;
    margin: 4px;
}

#jp_coll_wrapper {
    padding: 0;
}
.coll-container .coll-entry {
    height: 49px;
    line-height: 17px;
    margin: 0px 5px 10px 0px;
}
.coll-container .coll-entry .coll-entry-img-wrapper {
    margin-right: 5px;
}

/*#right-side-options-wrapper {min-width: 310px;}*/
.mainframe-row .inner-main-row.fullscreen #right-side-options-wrapper {
    min-width: 0;
}
#right-side-options .progress-text-wrapper {
    margin-top: 13px;
}
#jp-head-info .jp-head-info-wrapper {
    height: auto;
    padding-top: 3px;
}
#jp-head-info.page-content .jp-head-info-wrapper.account h1 {
    line-height: 40px;
    padding-left: 10px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    max-width: 450px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.breadcrumb-wrapper {
    font-size: 9px;
    height: 19px;
}
#jp-head-info .jp-head-info-wrapper h1 {
    font-size: 11px;
    line-height: 11pt;
}
#jp-head-info .jp-head-info-wrapper .col-xs-1 {
    width: 50px;
}
#jp-head-info .jp-head-info-wrapper .col-xs-11 {
    width: calc(100% - 50px)
}
#jp-head-info .draggable-jp {
    margin-top: -2px;
}

.no-f .team-member,
#jp-head-info .team-member,
.coll-entry .coll-entry-img-wrapper .team-member {
    margin: auto !important;
}

#right-side-options .jp-options {
    height: auto;
    line-height: 44px;
    font-size: 12px;
}
.jp-user-fav.favJP .glyphicon {
    font-size: 10pt;
}

/*#jp_coll_new {margin: 5px 20px;}*/
#jp_coll_new button.button {
    line-height: 19px
}
#dynamic-table {
    width: 100%;
    height: 600px;
    position: relative;
    background-color: white;
}
/*#dynamic-table-options {width: 54px;}*/
#dynamic-table-options a {
    margin-left: 0px;
}

#dynamic-table-header {
    padding: 10px 2px;
    margin-top: 5px;
    padding-bottom: 0px;
}
#dynamic-table-header .point-icon,
#dynamic-table-header .round-img {
    float: none;
}
#dynamic-table-header .type-title {
    font-size: 10pt;
    position: relative;
    top: -5px;
}
#dynamic-table-header .type-title.label {
    font-size: 9pt;
}

#dynamic-table-header .active-filters {
    display: block;
    width: 100%;
    margin-bottom: 10px;
}

#jp-filters.button {
    width: 44px;
}
#jp-list .table th {
    height: 44px;
    line-height: 25px;
    font-size: 10px;
}
#jp-list .table tbody tr td {
    font-size: 10px;
    line-height: 16px;
}

.jp-pipeline-settings {
    padding: 5px;
}
#jp-pipeline-mode-bt a {
    font-size: 8pt;
}
.jp-pipelines .jp-pipeline {
    width: 320px;
    min-width: 320px;
}
.jp-pipelines .jp-pipeline .pipeline-header {
    height: 30px;
    line-height: 28px;
    padding-left: 20px;
    margin-bottom: 0px;
}
.jp-pipelines .jp-pipeline .pipeline-header:after, .jp-pipelines .jp-pipeline .pipeline-header:before {
    right: -25px;
}
.jp-pipelines .jp-pipeline .pipeline-header:after {
    border-width: 15px;
}
.jp-pipelines .jp-pipeline .pipeline-header:before {
    border-width: 21px;
    margin-top: -4px;
    right: -44px;
}
.jp-pipelines .jp-pipeline .pipeline-header .title {
    font-size: 11px;
}
.jp-pipelines .jp-pipeline .pipeline-segment .segment-info {
    margin-bottom: 0px;
    font-size: 7pt;
}
.jp-pipelines .jp-pipeline .pipeline-content {
    padding: 7px 0px;
    padding-bottom: 0px;
}
.jp-pipelines .jp-pipeline .pipeline-content .content-header .row:last-child {
    padding-bottom: 7px;
}


/*#right-side-options .jp-options {position: relative;}*/

/*.mainframe-row .inner-main-row>.col-sm-9 {width: 100%;}*/
.mainframe-row>.col-sm-9 {
    width: 77%;
}
.mainframe-row>.col-sm-3 {
    width: 23%;
}

.info p, div.text-content,
.info .info-creation {
    font-size: 13px;
}
.info .info-creation {
    font-size: 12px;
}
.info-options .dropdown-menu li.dropdown-header, .info-options .dropdown-menu>li>a {
    font-size: 9pt;
    line-height: 17px;
}
.info .comment-controls span.counter,
.info .comment-controls span {
    font-size: 10pt;
}
.info a.jp-head-link {
    font-size: 10pt;
}
.info .task-status.btn-group {
    left: 15px;
}
.info .pointflow-vl {
    left: 30px;
}
.comment-wrapper .comment .text-content {
    font-size: 12px;
}

.jp-list-overview .custom-image {
    margin-left: -10px;
}

.boxlist input[type="text"] {
    font-size: 10pt;
    line-height: 23px;
}
.boxlist .val {
    line-height: 20px;
}
.boxlist .val .closable {
    top: 3px;
    font-size: 13px
}
.boxlist.tags .val {
    line-height: 20px;
}
.boxlist.tags .val .closable {
    top: 2px;
}
.infobox .option-content.lh-min li.ui-menu-item, .boxlist-autocomplete.ui-autocomplete .ui-menu-item {
    line-height: 26px;
}
.jp-list-overview .custom-image, .pipeline-content .custom-image, .boxlist .custom-image {
    width: 22px;
    height: 22px;
}


.jp-tree div.jp-tree-entry .jp-title {
    font-size: 11px
}
.infobox .option-content.lh-min li {
    line-height: 15px;
}

/*.infobox ul li {
    padding-left:10px;
}*/
.option-content .padding {
    padding: 0px 10px
}

/*#jp-view {height: calc(100% - 40px);}*/
#jp-list .table tbody tr td .round-img.small,
.jp-pipelines .round-img.small,
.round-img.small {
    width: 22px;
    height: 22px;
}
#jp-list .table tbody tr td .round-img.small,
.jp-pipelines .pipeline-content .round-img.small,
.jp-pipelines .pipeline-content .point-icon {
    opacity: 0.6;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

#jp-list .table tbody tr:hover td .round-img.small,
.jp-pipelines .pipeline-content:hover .round-img.small,
.jp-pipelines .pipeline-content:hover .point-icon {
    opacity: 1;
}

#jp-list.jp-list-overview .jp-list-row {
    padding: 5px 0px;
}

.task-status.btn-group .dropdown-menu.task-status-options {
    /*    width: 145px;*/
    min-width: 145px;
    /*height: 33px;*/
}
.task-status.btn-group.rating .dropdown-menu.task-status-options {
    height: auto;
}

.option-group.small .option {
    height: 30px;
}
.option-group.small .option input + label {
    padding: 4px 6px;
    line-height: 17px;
}

.option-group.small .option input + label .round-img,
.option-group .option input + label .round-img.small {
    margin-right: 5px !important;
}
.option-group.small .option input + label .point-icon {
    top: -2px;
}
/*.option-group .option input + label .round-img.small {top: -3px;}*/
.option-group.page-content.small {
    margin: 5px 0px;
    padding: 5px;
}



@media(max-width: 1250px) {

    .view-1200-hidden {
        display: none;
    }

    .right-side-options-trigger {
        float: left;
    }
    .jp-tabs.nav.nav-tabs .right-side-options-trigger a .glyphicon {
        padding-right: 0;
    }
    .nav.nav-tabs.style-jp>li.right-side-options-trigger {
        float: right;
        position: absolute;
        right: 15px;
    }

    #right-side-options-wrapper {
        position: fixed;
        top: 0;
        left: 105%;
        width: 385px;
        min-width: 385px;
        height: 100%;
        overflow: hidden;
        z-index: 9999999;
        -webkit-transition: all 0.2s ease-out;
        -moz-transition: all 0.2s ease-out;
        transition: all 0.2s ease-out;

        box-shadow: -2px 0px 15px rgba(50, 50, 50, 0.4);
    }
    #right-side-options-wrapper.open {
        left: calc(100% - 385px);
    }
    #right-side-options .chart.progress-pie {
        width: 85%;
    }

    /*.jp-list-overview .jp-list-row .edit {left: 5px; position: absolute;}*/
    .mainframe-row>.col-sm-9,
    .mainframe-row>.col-sm-8 {
        width: 70%;
    }
    .mainframe-row>.col-sm-3,
    .mainframe-row>.col-sm-4{
        width: 30%;
    }
    #jp-posting,
    .pointflow .info,
    .page-content.padding.nav-wrapper.info,
    .pointflow .time-mark,
    .timeline-filters,
    .modal-pointflow-wrapper.element-content .pointflow .info,
    .modal .modal-pointflow-wrapper.element-content .info,
    .info-based.nav-wrapper.info,
    .page-content.padding.nav-wrapper.info {
        max-width: 100%;
        width: 100%
    }
}

@media(max-width: 1024px) {


    nav.navbar .navbar-brand {
        margin: 0px;
        margin-right: 5px;
    }
    .top-menu.right {
        margin-left: 0px;
    }
    #jp-setting-view {
        width: 100%
    }
    ;
    /*.jp-list-overview .jp-list-row .edit {left: 5px; position: absolute;}*/
}



/*@media(max-width: 1200px) {
    .collapsed #main-content .row.mainframe-row>div {width: 100%;}

    .mainframe-row>.col-sm-3 {width: 0px;}
    .mainframe-row>.col-sm-9,
    .mainframe-row>.col-sm-9 .inner-main-row>.col-sm-9{width: 100%;}
    .collapsed #side-options-content,
    .full #side-options-content {width: 40%; height: calc(100% - 80px); position: fixed; top: 44px; z-index: 99999999; box-shadow: 5px 0px 3px rgba(50, 50, 50, 0.21); -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
    .collapsed #side-options-content {left: -110%; }
    .full #side-options-content {left: -5px; margin: 0;}
    #side-options-content .m-side-options-trigger {display: block; float: right; margin-right: 20px; position: absolute; top: 0px; right: 0;}

    .hw-container.service {width: 90%; left: 5%;}
}*/


@media(max-width: 1000px) {

    #push-m-gw {
        bottom: 55px;
    }

    .tablet-hidden {
        display: none !important;
    }
    .modal-dialog,
    .modal-dialog.size-big,
    .modal-dialog.size-full {
        width: 100% !important;
        margin-top: 0;
        height: auto;
        min-height: 100%;
        margin: 0 !important;
        padding-left: 75px;
    }
    .modal-dialog.size-medium {
        padding-left: 70px;
    }

    .modal-left,
    .modal-right{
        padding-left: 75px;
    }


    .mobile-scroll-x-width {
        width: max-content;
    }

    .nav.nav-tabs.style-jp>li.right-side-options-trigger,
    .right-side-options-trigger {
        display: block;
    }
    .nav.nav-tabs.style-jp>li.left-side-options-trigger,
    .left-side-options-trigger,
    .navbar .btn-group.left-side-options-trigger {
        display: block;
    }

    .collapsed #main-content .row.mainframe-row>div {
        width: 100%;
    }

    .mainframe-row>.col-sm-3 {
        width: 0px;
    }
    .mainframe-row>.col-sm-9,
    .mainframe-row>.col-sm-8,
    .mainframe-row>.col-sm-9 .inner-main-row>.col-sm-9,
    .mainframe-row>.col-sm-12 .inner-main-row>.col-sm-8{
        width: 100%;
    }
    /*    .collapsed #side-options-content {
            left: -110%;
        }
        .full #side-options-content {
            left: -5px;
            margin: 0;
        }
        #side-options-content .m-side-options-trigger {
            display: block;
            float: right;
            margin-right: 20px;
            position: absolute;
            top: 0px;
            right: 0;
        }
    
        .collapsed #side-options-content,
        .full #side-options-content {
            width: 40%;
            min-height: calc(100%);
            position: fixed;
            top: 0px;
            z-index: 99999999;
            -webkit-transition: all 0.2s ease-out;
            -moz-transition: all 0.2s ease-out;
            transition: all 0.2s ease-out;
        }
    
        .full #side-options-content {
            display: block;
        }
        #side-content-wrapper {
            display: block;
            position: fixed;
            left: 0;
            width: 100%;
            height: calc(100%);
            z-index: 9999997;
            overflow: auto;
            overflow-x: hidden;
            opacity: 0;
            background-color: #fcfcfc;
            -webkit-transition: all 0.2s ease-out;
            -moz-transition: all 0.2s ease-out;
            transition: all 0.2s ease-out;
        }
        #side-content-wrapper,
        .collapsed #side-content-wrapper {
            left: -100%;
            top: 0px;
        }
        .full #side-content-wrapper {
            left: 55px;
            width: calc(100% - 55px);
            opacity: 1;
        }
        #side-content-wrapper {position: fixed; top: 44px; left: -1000px; width: 100%; height: auto; min-height: 100%; z-index: 1031; overflow: scroll; background-color: #353535;}
        #side-options {
            position: absolute;
            top: 0;
            left: 0;
            float: left;
            height: 100%;
        }
    
        .collapsed #side-options-content, .full #side-options-content,
        #side-options-content {
            position: absolute;
            top: 0;
            left: auto;
            min-height: 100%;
            height: auto;
            padding-bottom: 50px;
            width: calc(100% - 55px);
        }
        #side-options-content .m-side-options-trigger {display: none;}
    
        .collapsed #side-options-content,
        .full #side-options-content {
            width: 40%;
            height: auto;
            padding-bottom: 30px;
            z-index: 99999999;
        }*/

    .hw-container.service {
        width: 90%;
        left: 5%;
    }
    /*    .col-side-options {
            width: 0px;
        }*/

    .disable-scrollbars::-webkit-scrollbar,
    .disable-scrollbars *::-webkit-scrollbar,
    .disable-scrollbars::-webkit-scrollbar-track,
    .disable-scrollbars::-webkit-scrollbar:vertical,
    .disable-scrollbars *::-webkit-scrollbar:vertical,
    .disable-scrollbars::-webkit-scrollbar-track:vertical,
    .disable-scrollbars::-webkit-scrollbar-thumb,
    .disable-scrollbars::-webkit-scrollbar-track{
        width: 0px !important;
        background-color: transparent !important; /* Chrome/Safari/Webkit */
        box-shadow: none !important;
        height: 0px !important;
    }

    .disable-scrollbars {
        overflow: auto;
        scrollbar-width: none !important; /* Firefox */
        -ms-overflow-style: none !important;  /* IE 10+ */
    }

    #dynamic-table {
        margin-bottom: 80px;
    }

    .timeline-filters .timeline-search input {
        display: inline-block;
        width: 100%;
        padding-left: 25px;
        border-radius: 30px;
    }
    .timeline-filters.jp-form-style .timeline-search input:focus {
        padding-left: 30px;
    }


}

@media(max-width: 970px) {

    .full #side-options-content {
        width: 50%;
    }
    /*.collapsed #side-options-content {left: -100%; }*/

    .pointflow .info,
    .page-content.padding {
        padding: 10px 10px;
    }

}

/*@media(max-width: 1500px) {
    #main-content {width: calc(80% - 450px); }
    .collapsed #main-content { width: 80%;}
}*/

/* mobile */

@media(max-width: 767px) {

    nav.navbar .navbar-toggle {
        display: inline-block;
    }

    #nav-collapse .btn-group a.active::before, #nav-collapse .btn-group a.active::after {
        content: none;
    }

    .navbar-collapse {
        padding-right: 0px;
        padding-left: 0px;
    }

    nav.navbar {
        -webkit-transition: all 0.2s ease-out;
        -moz-transition: all 0.2s ease-out;
        transition: all 0.2s ease-out;
        bottom: -100%;
        top: auto;
    }

    .open-menu nav.navbar {
        top: auto;
        bottom: 0;
        border: 1px solid #eaeaea
    }

    #jp-head-info {
        padding-top: 0;
    }

    body.flex, body {
        background-color: #fafafa;
    }

    button, button.button {
        font-size: 11pt;
    }
    .button.small {
        width: auto;
        display: inline-block;
    }

    .mobile-in,
    .nav>li.mobile-in{
        display: block;
    }
    .mobile-in-ib {
        display: inline-block;
    }

    .modal-dialog,
    .modal-dialog.size-big,
    .modal-dialog.size-full {
        padding-left: 0px;
    }

    .modal-right {
        position: absolute;
        width: 100%;
        top: 0;
        margin: 0;
        right: 0;
        width: 100%;
        height: 100%;
        padding-left: 0;
        background-color: white;
    }
    .modal-left {
        position: absolute;
        width: 100%;
        top: 0;
        margin: 0;
        left: 0px;
        height: 100%;
        padding-left: 0;
        background-color: white;
    }

    .modal-dialog.size-medium {
        padding-left: 0;
    }

    /*    .modal .modal-footer {
            position: fixed;
            width: 100%;
            bottom: 0;
            background-color: white;
        }*/

    .font-size-14 {
        font-size: 14pt;
    }

    #push-m-gw {
        margin-top: 40px;
        width: 350px;
    }
    .dropdown-menu {
        z-index: 1000 !important;
    }
    .mainframe-row {
        display: block;
    }

    .row.mainframe-row {
        margin: 0;
    }
    .row.mainframe-row>div {
        padding: 0;
    }
    .mainframe-row .inner-main-row {
        display: block;
    }
    .mainframe-row > .col-sm-9,
    .mainframe-row > .col-sm-8{
        width: 100%;
    }

    .dropdown-menu>li>a {
        line-height: 35px;
    }

    /* nav */
    nav.navbar {
        min-height: 50px;
        height: 50px;
        overflow: visible;
    }
    nav.navbar .navbar-brand, nav.navbar .navbar-header {
        width: auto;
    }
    nav button.navbar-toggle,
    nav button.navbar-toggle:hover,
    nav button.navbar-toggle:focus {
        background: none;
        background-color: transparent;
    }
    nav.navbar .top-menu {
        height: 50px;
        float: left;
        line-height: 15px;
        margin-left: 5px;
    }
    nav.navbar .top-menu a.dropdown-toggle .user-img {
        margin-top: 8px;
    }
    nav.navbar .navbar-brand .image-wrapper {
        line-height: 45px;
    }
    nav.navbar .top-menu .image-wrapper .image-wrapper.user-img.round-img {
        margin: 5px 2px;
    }
    /*nav.navbar .top-menu a.dropdown-toggle .user-img {margin-top: 5px;}*/
    /*    nav.navbar .navbar-toggle {
            margin-top: 0;
            line-height: 45px;
            font-size: 15pt;
            margin-bottom: 0px;
            height: 60px;
            width: 60px;
            text-align: center;
        }*/
    nav.navbar .btn-group {
        line-height: 60px;
        height: 60px;
        margin-left: 5px;
    }
    nav.navbar a {
        color: #37518c;
    }
    nav.navbar #global-search-trigger i {
        top: 4px;
        position: relative;
    }

    nav.navbar .collapse.navbar-collapse {
        float: right;
        padding-right: 15px;
    }
    nav.navbar .collapse.navbar-collapse .btn-group {
        width: 100%;
    }
    nav.navbar .btn-group>a {
        font-size: 12pt;
    }

    nav.navbar .navbar-collapse.collapse a,
    nav.navbar .navbar-collapse.collapsing a{
        color: #333
    }

    nav.navbar .navbar-collapse .btn-group {
        width: 100%;
    }
    nav.navbar .navbar-collapse .btn-group a,
    nav.navbar .navbar-collapse .btn-group.open a {
        width: 100%;
        display: block;
        height: auto;
        color: #333;
        background-color: transparent;
    }
    nav.navbar .navbar-collapse .btn-group a i {
        font-size: 20pt;
    }

    nav.navbar .collapse.navbar-collapse{
        width: 100%;
        top: 54px;
        left: 0;
        height: 100vh;
        z-index: 99999;
        padding-bottom: 200px;
        overflow-y: auto;
        position: fixed;
    }
    nav.navbar .collapse.navbar-collapse .btn-group.open:hover,
    nav.navbar .collapse.navbar-collapse .btn-group.open,
    nav.navbar .collapse.navbar-collapse .btn-group .dropdown-menu {
        background-color: white;
        width: 100%;
        height: auto;
    }
    nav.navbar .collapse.navbar-collapse .btn-group .dropdown-menu>li>a {
        font-size: 12pt;
        line-height: 45px;
        font-family: 'Montserrat-Light';
    }
    nav.navbar .collapse.navbar-collapse .btn-group .dropdown-menu {
        box-shadow: none;
        margin-left: 10px;
        padding-left: 10px;
        float: none;
        background-color: white;
        border-radius: 0;
        border:0;
        border-left: 2px solid #eaeaea;
        position: relative;
        top: 0;
    }
    nav.navbar .navbar-toggle:hover, nav.navbar .navbar-toggle:focus {
        color: #37518c;
    }
    nav.navbar .btn-group.mobile-hidden {
        display: none;
    }
    .navbar-toggle.collapsed.switchoption.active i:before {
        content: '\f00d'
    }

    nav.navbar .notification-top,
    nav.navbar .notification-top a {
        width: 44px;
        height: 44px;
    }
    nav.navbar .notification-top a span {
        padding: 13px;
        font-size: 14pt;
    }
    nav.navbar .notification-top a span.bubble {
        padding: 2px;
        min-width: 21px;
        font-size: 9pt;
        line-height: 12px;
    }
    .footer {
        display: none;
    }

    .nav.nav-tabs.style-jp>li {
        margin: 0;
        margin-right: 10px;
    }
    .nav.nav-tabs.style-jp>li a {
        padding: 10px 5px;
        font-size: 11pt;
    }

    nav.navbar .btn-group.open ul li a,
    .notify-container ul li a {
        width: 100%;
        height: auto
    }

    nav.navbar .notify-container a {
        color: black
    }
    nav.navbar .notification-top .notify-container a span {
        font-size: 12px
    }

    #global-search .ui-autocomplete {
        max-width: 100%;
    }

    #hw {
        height: 50px;
        z-index: 999999;
        width: 100%;
        position: fixed;
        top: 0px;
    }
    #hw-line {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999999;
    }
    /*.hw-container {top: 50px; left: 0; width: 100%; height: calc(100% - 70px)}*/
    #hw .hw-container {
        height: 50px;
        top: 0px;
    }
    .hw-container {
        position: relative;
        width: 100%;
        height: 100%;
        top: 0px;
        left: 0;
    }
    .hw-container.service {
        width: 95%;
        left: 0%;
    }

    #content-bar-top {
        overflow: hidden;
        position: absolute;
        top: 44px;
        left: 0;
        width: 100%;
        height: 40px;
        margin-left: 0;
        z-index: 1029;
        padding-left: 20px;
        box-shadow: none;
        border-bottom: 1px solid #eaeaea;
    }
    .account_overview #content-bar-top {
        background-color: white;
    }
    /*    .breadcrumb-wrapper {height: 100%;}*/
    .breadcrumb-wrapper  {
        position: fixed;
        top: 50px;
        height: 40px;
        padding: 0px 10px;
        display: none;
    }
    .breadcrumb-wrapper  {
        position: absolute;
        top: -97px;
        height: 40px;
        width: 100%;
        padding-left: 30px;
        z-index: 55;
    }
    .breadcrumb-wrapper .breadcrumb {
        line-height: 40px;
    }

    #platform-version {
        left: 11px;
    }
    #account-switch-wrapper {
        margin-left: 0px;
        padding-left: 0px;
    }
    #account-switch-wrapper .account-witch-s1 {
        display: none;
    }
    #account-switch-wrapper .btn-group {
        height: 50px;
        line-height: 52px;
    }
    #account-switch-wrapper .btn-group>a {
        max-width: 140px;
        font-size: 11px;
    }
    /*#global-search {display: none;}*/
    #global-search {
        width: calc(100% - 10px);
        margin-bottom: 15px;
    }
    #global-search input {
        width: 100%;
        font-size: 12pt;
        height: 40px;
        line-height: 30px;
    }
    #global-search .ui-autocomplete li a {
        font-size: 11pt;
    }
    #global-search .ui-autocomplete {
        max-height: calc(100% - 100px);
    }

    /* side options */
    html.disable-scroll {
        overflow: hidden;
    }
    .collapsed #side-options-content {
        display: block;
    }

    #side-content-wrapper {
        top: 49px;
        height: calc(100% - 60px);
    }
    .collapsed #side-content-wrapper {
        left: -100%;
        top: 60px;
    }
    .full #side-content-wrapper {
        left: 0;
        width: 100%;
        opacity: 1;
    }

    #right-side-options .jp-options {
        position: relative;
    }
    #right-side-options .jp-options .main {
        display: inline-block;
        float: left;
    }

    #dashboard .inner-main-row {
        width: calc(95% - 15px);
    }
    #dashboard .dashboard-element {
        margin: 25px 0px;
    }
    #today-list-overview {
        max-height: none;
    }

    /*    .collapsed #side-options-content, 
        .full #side-options-content {position: relative; top: auto; left: 55px; height: auto; width: 100%;}*/

    /* main */
    .collapsed #main-content,
    /*#main-content {width: calc(100% - 60px); margin-left: 40px; margin-top: 40px;}*/
    #main-content {
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-top: 85px;
    }
    #main-content {
        margin-left: auto;
        margin-right: auto;
        width: 95%;
    }
    #main-content .dropdown-menu {
        left: 0;
    }

    #jp-head-info {
        padding: 0;
        /*padding-top: 60px;*/
    }
    #jp-head-info.empty {
        padding-top: 54px;
    }
    #jp-head-info .jp-head-info-wrapper {
        padding: 0px;
        height: auto;
    }
    #jp-head-info .jp-head-info-wrapper .col-sm-11 {
        padding-left: 15px;
    }
    #jp-head-info .jp-head-info-wrapper .row {
        margin: 0;
    }
    #jp-head-info .jp-head-info-wrapper .row>div {
        padding: 0;
    }
    h1.spec {
        text-align: center;
        text-align: left;
        line-height: 37px;
        padding: 3px 15px;
    }
    #jp-head-info.view-mainframe h1.spec {
        line-height: 25px;
        padding-left: 15px;
        padding-right: 15px;
    }
    #jp-head-info h1.spec.mobile-center {
        text-align: center;
    }
    #jp-head-info .nav.nav-tabs li a .glyphicon {
        padding: 0px 8px;
    }
    #jp-head-info .jp-head-info-wrapper h1 {
        margin-top: 10px;
    }
    #jp-head-info.page-content .jp-head-info-wrapper.account {
        text-align: center;
        border: 0;
    }
    #jp-head-info.page-content .jp-head-info-wrapper.account h1.simple-header-title {
        display: block;
        float: none;
        text-align: center;
        margin-bottom: 0px;
    }

    #jp-head-info.page-content .jp-head-info-wrapper.account h1 {
        line-height: 39px;
        padding-bottom: 0px;
        font-size: 12pt;
        max-width: 260px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    #jp-head-info.page-content .jp-head-info-wrapper.account h1 .image-wrapper {
        position: absolute;
        left: 10px;
        top: 65px;
    }
    .fixed #jp-head-info.page-content .jp-head-info-wrapper.account h1 .image-wrapper {
        top: 66px;
    }

    #jp-head-info .jp-head-title .root-group .button.small {
        margin-top: 3px;
        background-color: transparent !important;
        border-color: transparent !important;
    }

    #jp-head-info .jp-detail .root-group .icon-wrapper {
        position: absolute;
        left: -2px;
        top: 4px;
    }

    #jp-head-info .jp-detail .root-group .private-jp {
        position: absolute;
        left: -11px;
        font-size: 10pt;
        top: 22px;
        background-color: #f7f7fa;
        padding: 5px;
        border-radius: 100%;
    }

    #jp-head-info .jp-detail .root-group .button {
        display: block;
        margin-bottom: 0;
        background-color: transparent;
    }

    #jp-head-info .jp-detail.jp-head-title .edit {
        margin-top: 5px;
        display: inline-block;
    }

    #jp-head-info .jp-detail .root-group .button .jp-title {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        width: 80%;
        padding-left: 5px;
        padding-top: 7px;

    }


    .view-mainframe .view-mainframe-head-info.root {
        display: block
    }
    .jp-options {
        height: 40px;
        line-height: 40px;
        padding: 0px 0px;
        font-size: 10px;
        position: absolute;
        top: 2px;
        right: 0px;
        background-color: transparent;
    }
    .jp-options a .glyphicon {
        padding: 8px;
        background-color: #f6f6f6;
        border-radius: 30px;
        text-align: center;
    }
    .jp-options .btn-group, .jp-options a {
        margin-right: 5px;
    }

    .jp-list-overview .infobox-header{
        height: auto;
        min-height: 49px;
        line-height: 15px;
        padding-bottom: 10px;
    }
    #main-content .jp-list-overview .btn-group.task-status .dropdown-menu {
        left: -14px;
        min-width: 195px;
    }

    /* coll-container */
    /*#jp_coll {margin-top: 40px;}*/
    #jp_coll .link-options {
        margin-top: 20px;
        padding-top: 5px;
        border-top: 1px solid #eaeaea;
    }
    #jp_coll .coll-container .coll-entry {
        width: 100%;
    }
    #jp_coll_new {
        margin-top: 5px !important;
    }
    #jp_coll_new a.button {
        margin-left: 25px;
        display: inline-block;
    }
    #jp_coll_new .edit {
    }

    .btn-group.task-status .dropdown-menu,
    #main-content .btn-group.task-status .dropdown-menu {
        position: absolute;
        left: -130px;
        top: -65px;
        width: 100%;
        min-width: 330px;
    }
    .btn-group.task-status .dropdown-menu.arrow_box:after,
    .btn-group.task-status .dropdown-menu.arrow_box:before {
        left: 46%;
    }

    /* pointflow */
    .pointflow .info .content .row .col-xs-1 {
        width: 12%;
        height: 45px;
    }
    .info .share-jp-head,
    .info .share-jp-head .jp-head-link {
        text-align: center;
    }
    .info .share-jp-head .point-icon {
        margin: auto;
    }
    .info .share-jp-head .task-status.btn-group,
    .jp-head-info-wrapper .task-status.btn-group {
        left: 50%;
    }
    /*.jp-head-info-wrapper .task-status.btn-group {top: 25px;}*/
    .info p.text-content, .info div.text-content {
        width: 88%;
        margin: 10px auto;
    }
    .info .info-options.btn-group.open .dropdown-menu,
    #main-content .info .info-options.btn-group.open .dropdown-menu,
    #main-content .btn-group.open .dropdown-menu.pull-right {
        position: absolute;
        left: 0;
        right: 30%;
        left: auto;
        width: 100%;
        min-width: 330px;
    }
    .jp-tabs.nav.nav-tabs li a .glyphicon {
        padding: 0px 5px;
    }
    .info .pointflow-vl {
        left: calc(50% - 1px);
    }
    .info .content-row.content-header {
        margin-top: -10px;
    }
    .info-options button {
        position: absolute;
        right: -25px;
        border: 0;
    }
    .info.info-wrapper .content-wrapper.max .content-c {
        width: 100%;
    }

    .comment-wrapper .round-img {
        width: 25px;
        height: 25px;
    }
    .comment-wrapper .full {
        width: 100%;
    }
    .comment-wrapper .cm-b {
        width: 85%;
    }

    .task-status.rating.btn-group .dropdown-menu.task-status-options li.dropdown-header {
        width: 24px;
        height: 24px;
    }

    .posting .content:after,
    .posting .content:before {
        left: 8.5%;
    }
    .cursor-pos {
        left: 0;
    }
    .posting .actions {
        width: auto;
        left: 0;
    }
    .posting .posting-datetime .row {
        margin-bottom: 5px;
    }
    .posting .posting-datetime .row .col-xs-9,
    .posting .posting-datetime .row .col-xs-10{
        width: 91%;
    }
    .posting .posting-option.mobile-out {
        display: none;
    }
    #jp_posting_sel .dropdown-menu {
        width: 110%;
        left: -21%;
        top: 105%;
    }
    #jp_posting_sel .dropdown-menu:before,
    #jp_posting_sel .dropdown-menu:after {
        left: 30%;
    }

    .simpleType-selector a.button .current-val .detail,
    .permission-selector a.button .current-val .detail {
        display: none
    }

    /* jp-tree */
    .jp-tree-wrapper {
        float: left;
        left: 0;
        top: 0;
    }
    .jp-tree-wrapper .dropdown-menu {
        position: fixed;
        width: 100%;
        top: 95px;
        left: 0;
        min-height: 400px;
    }
    .jp-tree-wrapper .dropdown-menu .jp-tree-c {
        height: 315px;
    }
    .jp-tree-wrapper .dropdown-menu.arrow_box:after,
    .jp-tree-wrapper .dropdown-menu.arrow_box:before {
        left: 10%;
    }

    #jp-posting {
        width: 100%;
    }
    #jp-posting, .pointflow .info, .page-content.padding.nav-wrapper.info,
    .pointflow .time-mark,
    .timeline-filters {
        max-width: 100%;
    }
    #jp-view {
        padding: 0;
        height: 100%;
        /*padding-top: 10px;*/
    }
    #jp-setting-view {
        width: 100%;
        margin: auto;
    }
    .pointflow .info,
    .page-content.padding.nav-wrapper.info,
    .pointflow .time-mark {
        max-width: 100%;
        text-align: center
    }
    .pointflow .info .time {
        margin-top: 10px;
    }

    #pipeline {
        margin: 5px 15px;
    }
    .jp-pipelines .jp-pipeline {
        float: left;
    }
    .jp-pipeline-settings .button {
        width: auto;
        display: inline-block;
    }
    .pipeline-detail li {
        border-right: 2px solid white;
        line-height: 12px
    }
    .pipeline-detail li a {
        height: 15px;
    }
    .pipeline-detail li .arrow-right {
        display: none;
    }
    .pipeline-steps.fixed,
    #jp-view .jp-pipelines.style-2 .pipeline-steps.fixed {
        top: 0px;
        left: 0;
    }

    .jp-list-overview .jp-list-row {
        height: auto;
        margin-bottom: 0px;
    }
    .jp-list-overview .jp-list-row .progress {
        max-width: 100%;
        width: 100%;
        position: relative;
        top: 8px;
        left: 0;
    }
    /*.jp-list-overview .jp-list-row .title {margin-left: 75px;}*/
    .jp-list-overview .jp-list-row .title .jp-title {
        overflow: visible;
        height: auto;
        display: inline-block;
        line-height: 18px;
    }
    .jp-list-overview .jp-list-row .title a {
        font-size: 10pt;
    }
    .jp-list-overview .jp-list-row>.col-xs-1 {
        height: 25px;
        width: 50px;
    }
    .jp-list-overview .jp-list-row .list-details {
        margin: 0;
        margin-left: 12%;
        margin-top: 5px;
    }
    .jp-list-overview .jp-list-row .list-details div {
        width: auto;
        line-height: 25px;
    }
    .jp-list-overview .jp-list-row .list-details div.empty {
        display: none;
    }
    .jp-list-overview .jp-list-row .list-row-header {
        width: calc(90% - 50px);
        display: inline-block;
        float: none;
    }
    .jp-list-overview .jp-list-row .list-row-sub-details {
        margin-left: 0%;
        line-height: 22px;
    }
    .jp-list-overview .jp-list-row .progress {
        background-color: transparent
    }
    .jp-list-overview.big .jp-list-row {
        height: auto;
    }
    .jp-list-overview .custom-image {
        float: left;
    }
    .jp-list-overview .option-group {
        display: block;
    }

    .jp-list-overview .jp-list-row .edit {
        font-size: 11pt;
        margin: 0px 10px;
        display: inline-block;
        float: right;
        position: relative;
        top: auto;
        left: auto;
        opacity: 1;
    }
    #works-tab .jp-list-overview .jp-list-row .edit {
        position: absolute;
        top: 130%;
        z-index: 999;
    }
    .user-list.jp-list-overview .jp-list-row,
    .jp-list-overview .jp-list-row,
    .jp-list-overview .jp-list-row a.default{
        font-size: 10pt;
    }

    .jp-list-overview .jp-list-overview-group-header a {
        text-align: center;
        display: block;
        line-height: 30px;
    }
    .jp-list-overview .jp-list-overview-group-header a span {
        padding-left: 15px;
    }
    .jp-list-overview .jp-list-overview-group-header a .round-img.small,
    .jp-list-overview .jp-list-overview-group-header a .point-icon.small {
        margin-right: auto !important;
        margin: auto !important;
        position: relative;
        top: auto;
        zoom: 1.3;
    }

    .jp-list-overview .jp-list-overview-group-header .option-group.small {
        float: none;
        position: absolute;
        top: -20px;
        right: 10px;
        margin: auto;
        display: inline-block;
        margin: auto;
        margin-bottom: 15px;
    }

    #jp-list.jp-list-overview .jp-list-row {
        margin-bottom: 0px;
    }
    #jp-list.jp-list-overview .jp-list-row span {
        font-size: 9pt;
    }
    #jp-list.jp-list-overview .jp-list-row .dropdown-menu a,
    #jp-list.jp-list-overview .jp-list-row .dropdown-menu a span {
        font-size: 13pt;
    }
    #jp-list.jp-list-overview .jp-list-row .label {
        font-size: 80%;
    }
    #jp-list.jp-list-overview .jp-list-row .label span {
        font-size: 100%;
    }
    #jp-list.jp-list-overview .jp-list-row .task_changer_wrapper {
        float: none;
        margin: 5px auto;
    }
    #jp-list.jp-list-overview .jp-list-row a {
        width: 95%;
        font-size: 10pt;
    }
    #jp-list.jp-list-overview .jp-list-row a.first-info {
        margin-bottom: 0px;
        font-family: 'Montserrat-Regular';
    }
    #jp-list.jp-list-overview .jp-list-row .relation-info .point-icon {
        float: none;
    }
    #jp-list.jp-list-overview .jp-list-row .relation-info .jp-title {
        position: relative;
        top: -6px;
    }
    #jp-list.jp-list-overview .jp-list-row .relation-info .round-img.small-icon {
        float: none;
    }
    #jp-list.jp-list-overview .jp-list-row .jp-title {
        text-align: left;
    }
    #jp-list.jp-list-overview .jp-list-row .task_changer_wrapper {
        width: 20px;
    }
    #jp-list.jp-list-overview .jp-list-row.child {
        padding-left: 0px;
        border-left: 2px dotted #eaeaea;
        margin-left: 15px;
    }
    #jp-list.jp-list-overview .jp-list-row.child .task_changer_wrapper {
        width: 40px;
    }
    .jp-list-overview.user-list .team-member {
        margin: auto !important;
    }
    .task-status.btn-group .dropdown-menu.task-status-options {
        min-width: 0;
        zoom: 1.3;
    }
    .task-status.rating.btn-group .dropdown-menu.task-status-options {
        width: 252px;
    }

    #dynamic-table-options-wrapper {
        width: auto;
        margin: auto;
        display: inline-block;
    }
    #dynamic-table-options-wrapper .button {
        margin: 1px 5px;
    }
    #dynamic-table-options {
        width: 65px;
    }


    .settings-content .settings-header {
        text-align: center;
        margin-bottom: 20px;
    }
    .settings-content .settings-header h2 {
        float: none;
    }
    .settings-content .settings-header button{
        float: none;
        width: 100%;
        margin: auto;
        margin-bottom: 10px;
        font-size: 10pt;
    }

    /*    .option-group.small .option,
        .option-group .option {height: 40px;}
        .option-group.small .option input +label,
        .option-group .option input + label {padding: 5px 10px; line-height: 25px;}
        .option-group.small .option input +label .round-img.small,
        .option-group .option input + label .round-img.small {top: 1px;}
        .option-group.small .option input + label .point-icon {top: 0px;}*/

    .boxlist.user-allocation .boxlist-autocomplete.ui-autocomplete {
        left: auto !important;
        right: 0 !important;
    }



    #first-steps-wrapper {
        right: auto;
        left: 5px;
    }
    #first-steps-wrapper .first-steps-body {
        max-height: 250px
    }
    #first-steps-wrapper.closed:hover {
        bottom: -245px
    }
    #first-steps-wrapper.closed {
        bottom: -255px;
    }

    #bottom-info {
        display: none;
    }

    .jp-info-component {
        padding: 0px;
    }

}

@media(max-width: 512px) {

    #jp-head-info.page-content .jp-head-info-wrapper.account h1 {
        max-width: 240px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding-bottom: 0;
    }

    .modal .modal-footer button {
        margin: 5px 10px;
        height: auto;
        /* line-height: 25px; */
        padding: 8px 10px;
    }

    .pointflow .info,
    .page-content.padding {
        padding: 10px;
    }

    .pointflow .info .row .col-xs-1,
    .pointflow .info .row .col-xs-10 {
        padding: 0;
        padding-left: 10px;
    }
    .pointflow .info .row.content-row .col-xs-1 {
        width: 0%;
    }
    /*.pointflow .info .row .col-xs-10 {width: 70%}*/
    .pointflow .info .row.content-row .col-xs-10 {
        width: 95%;
        padding-left: 10px;
    }

    .info p.text-content, .info div.text-content {
        width: 100%
    }

    #right-side-options-wrapper {
        width: 95%;
        min-width: 0;
    }
    #right-side-options-wrapper.open {
        left: 5%;
    }
    #side-content-wrapper {
        width: 100%
    }

    nav.navbar .btn-group {
        margin-left: 1px;
    }

}