/***** GENERAL *****/

.grow { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(1.5); }

/*****  MENU *****/

/*
    tra container e container fluid serve flexbox
 */

@media (min-width: 768px) {
    .navbar-container {
        float: left;
        width: 780px;
        height: 75px
    }

    .navbar ul {
        white-space: nowrap;
    }

    .navbar .open>.dropdown-menu, .navbar .active>.dropdown-menu {
        display: block;
    }

    .navbar .open>.dropdown-menu {
        z-index: 1001;
    }

    .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
        color: #555;
        text-shadow: 0 0 .30px #777;
    }

    .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover{
        color: #555;
        background-color: transparent;
        border-bottom: 3px solid #d9534f; /*#c1282e*/
        font-weight: bold;
    }

    .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
        color: #555;
        font-weight: bold;
        background-color: transparent;
    }

    .navbar-nav {
        position: relative;
    }

    .navbar .dropdown .caret {
        display: none;
    }

    .navbar .dropdown-menu {
        width: 750px;
        position: absolute;
        top: 40px;
        left: 0px;
        font-size: 12px;
        /* reset */
        background-color: #f8f8f8;
        -webkit-background-clip: initial;
        background-clip: initial;
        border: initial;
        /* border: 1px solid rgba(0,0,0,.15); */
        /* border-radius: 4px; */
        -webkit-box-shadow: initial;
        box-shadow: initial;
    }

    .navbar .dropdown-menu>li {
        float: left;
    }

    .navbar .dropdown-menu>li {
        position: relative;
        display: block;
    }

    .navbar-nav>li {
        float: left;
        max-width: 200px;
        overflow: hidden;
    }

    .nav>li {
        position: static;
    }

    .nav>li>a {
        padding-left: 10px;
        padding-right: 10px;
    }

    .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 0px;
        margin-bottom: 5px;
        display: inline-block;
    }

    .navbar .dropdown-menu>li>a {
        padding: 3px 5px;
        color: #777;
    }

    .navbar .dropdown-menu>.active>a, .navbar .dropdown-menu>.active>a:focus, .navbar .dropdown-menu>.active>a:hover {
        color: #555;
        background-color: transparent;
        border-bottom: 3px solid #d9534f; /*#c1282e*/
        font-weight: bold;
    }

    .navbar .dropdown-menu>li>a:focus, .navbar .dropdown-menu>li>a:hover {
        color: #555;
        background-color: inherit;
        /*font-weight: bold;*/
        text-shadow: 0 0 .30px #777;
    }

}

.contacts-link {
    color: #555;
    font-weight: bold;
}

.navbar-brand {
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.navbar-brand:hover {
    opacity:0;
}

.navbar {
    min-height: 78px;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color: #555;
    background-color: transparent;
    border-bottom: 3px solid #d9534f; /*#c1282e*/
    font-weight: bold;
}

ul.nav {
    font-size: 18px;
}


/********************** TOOLBAR ****************/

.toolbar {
    background-color: red; /*#337ab7;*/
    padding: 15px;
    margin-bottom: 15px;
}

.toolbar h3 {
    display: inline-block;
    color: white;
    margin-bottom: 0px;
    vertical-align: top;
    margin-top: 3px;
}

/*.btn-group {
    margin-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
}*/

.btn-toolbar {
    margin-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
}

@media (max-width: 768px) {

    .toolbar {
        padding: 8px;
    }

    .toolbar .btn {
        padding: 6px 8px;
    }

    .toolbar button {
        font-size: 0px;
        height: 34px;
    }

    .toolbar button span {
        font-size: 14px;
    }
}


/*********** BTN TOOLBAR *************/

@media (max-width: 768px) {
    .form-group .btn-toolbar .btn {
        padding: 6px 8px;
    }

    .form-group .btn-toolbar button {
        font-size: 0px;
        height: 34px;
    }

    .form-group .btn-toolbar button span {
        font-size: 14px;
    }
}

.no-padding {
    padding: 0 0;
}

body {
    /*padding-top: 78px;*/
    min-height: 1000px;
}

.btn-glyph {
    padding: 2px 4px;
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.help-glyph {
    color: #337ab7;
    font-size: 22px;
}

.help-glyph:focus, .help-glyph:hover {
    color: #23527A;
    text-decoration: none;
}

h3 {
    margin-top: 0px;
    margin-left: 15px;
}

.navbar {
    margin-bottom: 0px;
}

/*
.btn-primary.btn-success {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.btn-primary.btn-success:hover {
    color: #fff;
    background-color: #449d44;
    border-color: #398439;
}

.btn-primary.btn-danger {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a;
}

.btn-primary.btn-danger:hover {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925;
}
*/

button.active {
    color: white !important;
    background-color: #398438 !important;
}

.btn-secondary {
    border-color: #2e6da4;
    background: transparent;
    color: #337ab7;
    /* CSS Transition */
    -webkit-transition: background .2s ease-in-out, border .2s ease-in-out;
    -moz-transition: background .2s ease-in-out, border .2s ease-in-out;
    -ms-transition: background .2s ease-in-out, border .2s ease-in-out;
    -o-transition: background .2s ease-in-out, border .2s ease-in-out;
    transition: background .2s ease-in-out, border .2s ease-in-out;
}

.btn-secondary:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}

/*.btn-danger {
    border-color: #d43f3a;
    background: transparent;
    color: #d9534f;

    -webkit-transition: background .2s ease-in-out, border .2s ease-in-out;
    -moz-transition: background .2s ease-in-out, border .2s ease-in-out;
    -ms-transition: background .2s ease-in-out, border .2s ease-in-out;
    -o-transition: background .2s ease-in-out, border .2s ease-in-out;
    transition: background .2s ease-in-out, border .2s ease-in-out;
}

.btn-danger:hover {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925;
}

.btn-success {
    border-color: #4cae4c;
    background: transparent;
    color: #5cb85c;

    -webkit-transition: background .2s ease-in-out, border .2s ease-in-out;
    -moz-transition: background .2s ease-in-out, border .2s ease-in-out;
    -ms-transition: background .2s ease-in-out, border .2s ease-in-out;
    -o-transition: background .2s ease-in-out, border .2s ease-in-out;
    transition: background .2s ease-in-out, border .2s ease-in-out;
}

.btn-success:hover {
    color: #fff;
    background-color: #449d44;
    border-color: #398439;
}
*/

/************ FORMS ****************/

legend {
    color: lightgrey;
    margin-bottom: 10px;
}

.form-group.required>label:after {
    content: "*";
    color: red;
}

.required-for-associate .form-group.required label:after {
    content: "*";
    color: goldenrod;
}

.form-group.suggested label:before {
    content: "*";
    color: #5cb85c;
}

.radio-inline .form-control {
    display: initial;
    width: initial;
    height: initial;
}

.green {
    color: #5cb85c;
}

.red {
    color: #d43f3a;
}

.blue {
    color: #2e6da4;
}

.purple {
    color: purple;
}

.gold {
    color: goldenrod;
}



.form-inline-unresponsive .form-group {
    margin-left: 15px;
    margin-bottom: 20px;
}

.form-inline-unresponsive .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
}

.form-inline-unresponsive .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
}

.form-inline-unresponsive .input-group {
    display: inline-table;
    vertical-align: middle;
}

.form-inline-unresponsive .input-group .form-control, .form-inline-unresponsive .input-group .input-group-addon, .form-inline-unresponsive .input-group .input-group-btn {
    width: auto;
}

.form-inline-unresponsive .input-group>.form-control {
    width: 100%;
}

.grid-full {
    width: 100%;
    height: 500px;
}

@media (min-height: 800px) {
    .grid-full {
        height: 650px;
    }
}

.my-grid-large {
    width: 800px;
    height: 500px;
}

.my-grid-small {
    width: 300px;
    height: 500px;
}

.ui-grid .green {
    color: green;
}

.ui-grid .red {
    color: red;
}

.associates-grid .red {
    color: black;
    background-color: #fc8f8f!important;
}

.details-link-cell {
    display: table-cell;
    vertical-align: middle;
    font-size: 22px
}

a.glyphicon:hover {
    text-decoration: none;
}

.ui-grid .unmodifiable {
    text-decoration: underline;
/ / font-weight: bold;
/ / font-variant: all-small-caps;
/ / font-variant: small-caps;
}

.ui-grid .conflict {
    background-color: #ffff66 !important;
}

.csv-import .label {
    color: #333;
    display: none;
}

.form-image {
    display: block;
    /* width: 100%; */
    margin-bottom: 25px;
    padding: 6px 12px;
    color: #555;
    background-color: #FFF;
    background-image: none;
    border: 1px solid #CCC;
    border-radius: 4px;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}

.control-group-label {
    font-size: 18px;
    color: gray;
    text-decoration: underline;
    margin-top: 15px;
    margin-bottom: 10px;
}

.refa ul {
    list-style-type: none;
}

.ng-camera-stack {
    position: relative;
}

.ng-camera-overlay {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2;
}

@media (max-width: 768px) {
    input[type=date] {
        width: 140px;
    }
}


/*************** MODAL *****************/

.modal-content h2 {
    font-size: 20px;
    text-align: center;
}

.modal-content h3 {
    font-size: 15px;
    text-align: center;
}

.modal-content .modal-body {
    margin: 0 50px;
}

.csv-button {
    width: 150px;
}

@media (max-width: 768px) {
    .modal-dialog {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
    }

    .modal-content {
        height: auto;
        min-height: 100%;
        border-radius: 0;
    }
    
    .modal-content .modal-body {
        margin: 0 0;
    }
}

/*Toggle Button: TODO: gestire il colore durante il click*/

/*.btn-primary.active, .btn-primary:active, .open>.dropdown-toggle.btn-primary {
    background-color: #d9534f;
    border-color: #d43f3a;
}

.btn-primary.active:focus, .btn-primary.active:hover {
    background-color: #d2322d;
    border-color: #ac2925;
}

.btn-primary {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.btn-primary:focus, .btn-primary:hover {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}*/

td.full > button {
    background-color: limegreen;
    border-radius: 32px;
    color: black;
}

.partially button span {
    background-color: orange;
    border-radius: 32px;
    color: black;
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

/******************** CALENDAR ********************/

#calendar-container {
    /*position: fixed;
    top: 148px;
    left: 0;
    right: 0;
    bottom: 0;*/
}

.calendar {
    margin: 0 10px;
}

.fc-toolbar.fc-header-toolbar {
    margin-bottom: 0em;
}

.fc-event {
    border: 1px solid black
}

.fc-time-grid-event .fc-time {
    font-size: .85em;
    /*white-space: nowrap;*/
}

.fc-time-grid-event.fc-short .fc-content {
    white-space: initial;
}

.fc-time-grid-event.fc-short .fc-main {
    position: absolute;
    top: 0;
}

/*.fc-time-grid-event.fc-short .fc-time {
    display: none;
}*/

.fc-time-grid-event.fc-short .fc-time span {
    display: initial;
}

.fc-time-grid-event.fc-short .fc-time:after {
    content: "";
}

.fc-time-grid-event .fc-content {
    overflow: initial;
}

.fc-event .fc-bg {
    z-index: 3;
}

.fc-time-grid-event.fc-short {
    z-index: 2;
}

.fc-main {
    /*position: relative;
    top: 10px;*/
}

.fc-time-grid .fc-slats td {
    height: 2em;
}

/*.fc-time-grid-event.fc-short .fc-main {
    position: initial;
}*/

.fc-title {
    font-weight: bold;
    text-transform: uppercase;
}

.fc-content .fc-time {
    text-align: right;
    height: 0.95em;
    display: block!important;
}

.fc-content-white {
    color: white;
    text-shadow: 0 0 3px black;
    margin: 0 2px;
    /*white-space: nowrap;*/

}

.fc-content-black {
    color: black;
    text-shadow: 0 0 3px white;
    margin: 0 2px;
    /*white-space: nowrap;*/
}

.fc-subtitle {
}

.fc-participants {
    text-decoration: underline;
    text-transform: capitalize;
}

.fc-instructor {
    text-transform: capitalize;
}

.fc-event-first {
    border: 1px solid red !important;
}

.fc-event-selected {
    border: 2px solid #d9534f !important;
    /*box-shadow: 1px 1px 2px 3px #d9534f;*/
}

.fc-schedule-selected {
    border: 2px solid grey !important;
    /*box-shadow: 1px 1px 2px 2px grey;*/
}

thead th, tr td.fc-axis {
    overflow: hidden;
}

.qtip-default {
    background-color: #fff;
    border-color: #E2E2E2;
    color: #454545;
}

.qtip-default .qtip-titlebar {
    background-color: #337ab7;
    color: white;
}

.qtip-content h6 {
    font-weight: bold;
    margin-top: 5px;
    margin-bottom: 5px;
}

.qtip-content ul {
    padding-left: 20px;
}

.calendar-notes {
    outline: none !important;
    width: 55px;
    height: 55px;
    display: none;
    vertical-align: middle;
    position: absolute;
    z-index: 10;
    top: 0px;
    left: 5px;
    transition: all .2s ease-in-out;
}

.calendar-notes-inactive {
    display: block;
    background-image: url(/imgs/post-inactive.png);
}

.calendar-notes-active {
    display: block;
    background-image: url(/imgs/post-active.png);
}

/*.calendar-notes:hover {
    background-image: url(/imgs/post-hover.png) !important;
}*/
.calendar-notes:hover {
    transform: scale(1.5);
}

/*to change the height of calendar row*/
/*.fc-time-grid .fc-slats td {
    height: 1.5em;
}*/

@media (min-height: 800px) {
    .fc-time-grid .fc-slats td {
        height: 2em;
    }
}

@media (max-width: 768px) {

    .calendar {
        margin: 0 0;
    }

    .fc button {
        padding: 1px 7px 2px;
    }

    .calendar-notes {
        width: 40px;
        height: 40px;
    }

    .fc-axis {
        width: 20px !important;
    }
}


/*************** COURSE SCHEDULE EDIT *************/

@media (max-width: 768px) {
    /*.color-picker-container {
        margin-left: -12px;
    }*/

    .calendar {
        text-transform: lowercase;
    }
}

/*************** CHARTS *****************/
.charts-container {
    margin: 0px 0px;
}

.charts-container .graph-row>label {
    margin: 0 0 5px 20px;
}
.charts-container .graph-row>.subtitle {
    margin: 0 0 5px 20px;
}

.charts-container .graph-row>canvas {
    margin: 0 10px;
}

.form-group {
    position: relative;
}

.form-group .help-block {
    display: none;
    position: absolute;
    right: -10px;
    bottom: -10px;
    padding: 2px;
    margin:0;
    background-color: white;
    z-index: 10;
}

.form-group.has-error .help-block {
    display: block;
}

label.mandatory {
    text-decoration: underline;
}

/*input.form-control[type="radio"] {
    display: initial;
    width: initial;
    height: initial;
}*/

.interactive {
    cursor: pointer;
}

/*.footer {
    position: absolute;
    bottom: 0;
    width: 1140px;
    padding: 5px 15px 0px 15px;
    background-color: #f8f8f8;
    border: 1px solid #e7e7e7;
    border-radius: 4px;
}

.footer p {
    line-height: 1.0;
    margin-bottom: 5px;
}*/

.full-page-content {
    display: flex;
    flex-direction: column;
    padding: 0 0;
}

.main-content {
    /*display: flex;
    flex-direction: column;*/
    flex-grow: 1;
}

.main-element {
    margin: 0px 20px;
}

/*calc(100% - 649px);*/
.footer {
    color: white;
    background-color: #286090;
    border-color: #204d74;
    margin-top: 20px;
    margin-bottom: 0px;
}

/*@media (min-height: 800px) {
    .footer {
        height: calc(100% - 799px);
    }
} */

.glyphicon.spinning {
    animation: spin 2s infinite linear;
    -webkit-animation: spin2 2s infinite linear;
}

.glyphicon.spinning.ng-animate {
    /* transition:0s none; */
    /* -webkit-transition:0s none; */
    animation: 0s none;
    -webkit-animation: 0s none;
}

.conflict {
    background-color: #ffff66;
}

@keyframes spin {
    0% {
        transform: scale(1) rotate(0deg);
    }
    100% {
        transform: scale(1) rotate(360deg);
    }
}

@-webkit-keyframes spin2 {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}



.disabled {
    cursor: not-allowed;
    pointer-events: none;
    color: grey;
}

table.refa, table.refa th, table.refa td {
    /*border: 1px solid black;
    border-collapse: collapse;*/
    padding: 2px 10px;
}

.graph-row {
    margin-top: 30px
}

.tooltip-wrapper {
    display: inline-block; /* display: block works as well */
}

/**/

/*
*   CSS file with Bootstrap grid classes for screens bigger than 1600px. Just add this file after the Bootstrap CSS file and you will be able to juse col-xl, col-xl-push, hidden-xl, etc.
*
*   Author: Marc van Nieuwenhuijzen
*   Company: WebVakman
*   Site: WebVakman.nl
*
*/

@media (min-width: 1200px) and (max-width: 1599px) {
    .hidden-lg {
        display: none !important;
    }
}

.visible-xl-block,
.visible-xl-inline,
.visible-xl-inline-block,
.visible-xl {
    display: none !important;
}

.form-inline .form-group {
    margin-left: 15px;
    margin-bottom: 20px;
}

@media (min-width: 1600px) {
    .container {
        width: 1570px;
    }

    .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
        float: left;
    }

    .col-xl-12 {
        width: 100%;
    }

    .col-xl-11 {
        width: 91.66666667%;
    }

    .col-xl-10 {
        width: 83.33333333%;
    }

    .col-xl-9 {
        width: 75%;
    }

    .col-xl-8 {
        width: 66.66666667%;
    }

    .col-xl-7 {
        width: 58.33333333%;
    }

    .col-xl-6 {
        width: 50%;
    }

    .col-xl-5 {
        width: 41.66666667%;
    }

    .col-xl-4 {
        width: 33.33333333%;
    }

    .col-xl-3 {
        width: 25%;
    }

    .col-xl-2 {
        width: 16.66666667%;
    }

    .col-xl-1 {
        width: 8.33333333%;
    }

    .col-xl-pull-12 {
        right: 100%;
    }

    .col-xl-pull-11 {
        right: 91.66666667%;
    }

    .col-xl-pull-10 {
        right: 83.33333333%;
    }

    .col-xl-pull-9 {
        right: 75%;
    }

    .col-xl-pull-8 {
        right: 66.66666667%;
    }

    .col-xl-pull-7 {
        right: 58.33333333%;
    }

    .col-xl-pull-6 {
        right: 50%;
    }

    .col-xl-pull-5 {
        right: 41.66666667%;
    }

    .col-xl-pull-4 {
        right: 33.33333333%;
    }

    .col-xl-pull-3 {
        right: 25%;
    }

    .col-xl-pull-2 {
        right: 16.66666667%;
    }

    .col-xl-pull-1 {
        right: 8.33333333%;
    }

    .col-xl-pull-0 {
        right: auto;
    }

    .col-xl-push-12 {
        left: 100%;
    }

    .col-xl-push-11 {
        left: 91.66666667%;
    }

    .col-xl-push-10 {
        left: 83.33333333%;
    }

    .col-xl-push-9 {
        left: 75%;
    }

    .col-xl-push-8 {
        left: 66.66666667%;
    }

    .col-xl-push-7 {
        left: 58.33333333%;
    }

    .col-xl-push-6 {
        left: 50%;
    }

    .col-xl-push-5 {
        left: 41.66666667%;
    }

    .col-xl-push-4 {
        left: 33.33333333%;
    }

    .col-xl-push-3 {
        left: 25%;
    }

    .col-xl-push-2 {
        left: 16.66666667%;
    }

    .col-xl-push-1 {
        left: 8.33333333%;
    }

    .col-xl-push-0 {
        left: auto;
    }

    .col-xl-offset-12 {
        margin-left: 100%;
    }

    .col-xl-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-xl-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-xl-offset-9 {
        margin-left: 75%;
    }

    .col-xl-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-xl-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-xl-offset-6 {
        margin-left: 50%;
    }

    .col-xl-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-xl-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-xl-offset-3 {
        margin-left: 25%;
    }

    .col-xl-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-xl-offset-1 {
        margin-left: 8.33333333%;
    }

    .col-xl-offset-0 {
        margin-left: 0;
    }

    .visible-xl {
        display: block !important;
    }

    table.visible-xl {
        display: table;
    }

    tr.visible-xl {
        display: table-row !important;
    }

    th.visible-xl, td.visible-xl {
        display: table-cell !important;
    }

    .visible-xl-block {
        display: block !important;
    }

    .visible-xl-inline {
        display: inline !important;
    }

    .visible-xl-inline-block {
        display: inline-block !important;
    }

    .hidden-xl {
        display: none !important;
    }
}