/* coding */
.debug {
    border: 1px dotted red;
}

/* plug-ins */
.pace .pace-progress{
    background-color: white !important;
    height: 5px !important;
}
.spinner {
    margin: 100px auto;
    width: 50px;
    height: 40px;
    text-align: center;
    font-size: 10px;
}
.spinner > div {
    background-color: white;
    height: 100%;
    width: 6px;
    display: inline-block;

    -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
    animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.spinner .rect3 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

.spinner .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.spinner .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
    }
    20% {
        -webkit-transform: scaleY(1.0);
    }
}

@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }  20% {
           transform: scaleY(1.0);
           -webkit-transform: scaleY(1.0);
       }
}

.alertify-logs {
    bottom: 40px !important;
}

.datepicker-dropdown, .clockpicker-popover {
    z-index: 1000000000 !important;
}

.has-error .form-control{
    border-color: red;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);

}
.has-success .form-control{
    border-color: green;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);

}
.has-error .form-control:focus{
    border-color: red;
    -webkit-box-shadow: 0px 0px 20px red;
    box-shadow: 0px 0px 20px red;

}
.has-error .input-group-addon, .has-error .control-label {
    color: red;
    border-color: red;
}
.has-success .input-group-addon, .has-success .control-label {
    color: green;
    border-color: green;
}

/* misc */
.red {
    color: red;
}
a[data-url]:hover {
    cursor: pointer;
}

/* header */
.header {
    position: relative;
    height: 115px;
}
.header:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    z-index: -1;

    display: block;
    background: url("../../resources/images/curcit2.jpg");
    background-size: auto 115px;
    width: 100%;
    height: 115px;

    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}
#title {
    position: relative;
}
#logo {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 100px;
    height: 100px;
}
#logo img{
    height: 100px;
}
.animated {
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.marquee {
    position: absolute;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    left: 115px;
    top: 50px;
    width: calc(100% - 115px);
    vertical-align: middle;
    color: white;
    font-size: xx-large;
    font-weight: bolder;
}

/* menu */
#menu {
    position: absolute;
    top: 115px;
    height: 35px;
    width: 100%;
    color: #e0e0e0;
    font-weight: bolder;
    z-index: 1007;

    background: rgb(149,149,149);
    background: -moz-linear-gradient(top,  rgba(149,149,149,1) 0%, rgba(13,13,13,1) 93%, rgba(78,78,78,1) 77%, rgba(1,1,1,1) 78%, rgba(10,10,10,1) 82%, rgba(27,27,27,1) 89%, rgba(56,56,56,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(149,149,149,1) 0%,rgba(13,13,13,1) 93%,rgba(78,78,78,1) 77%,rgba(1,1,1,1) 78%,rgba(10,10,10,1) 82%,rgba(27,27,27,1) 89%,rgba(56,56,56,1) 100%);
    background: linear-gradient(to bottom,  rgba(149,149,149,1) 0%,rgba(13,13,13,1) 93%,rgba(78,78,78,1) 77%,rgba(1,1,1,1) 78%,rgba(10,10,10,1) 82%,rgba(27,27,27,1) 89%,rgba(56,56,56,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#959595', endColorstr='#383838',GradientType=0 );

    /*
    background: rgb(30,87,153);
    background: -moz-linear-gradient(top,  rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
    background: linear-gradient(to bottom,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 );
    */
}
@media only screen and (max-width: 1024px) {
    #menu {
        height: 70px;

        background: rgb(149, 149, 149);
        background: -moz-repeating-linear-gradient(to bottom, rgba(149,149,149,1) 0%, rgba(13,13,13,1) 46%, rgba(78,78,78,1) 39%, rgba(1,1,1,1) 39%, rgba(10,10,10,1) 41%, rgba(27,27,27,1) 45%, rgba(56,56,56,1) 50%);
        background: -webkit-repeating-linear-gradient(to bottom, rgba(149,149,149,1) 0%, rgba(13,13,13,1) 46%, rgba(78,78,78,1) 39%, rgba(1,1,1,1) 39%, rgba(10,10,10,1) 41%, rgba(27,27,27,1) 45%, rgba(56,56,56,1) 50%);
        background: repeating-linear-gradient(to bottom, rgba(149,149,149,1) 0%, rgba(13,13,13,1) 46%, rgba(78,78,78,1) 39%, rgba(1,1,1,1) 39%, rgba(10,10,10,1) 41%, rgba(27,27,27,1) 45%, rgba(56,56,56,1) 50%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#383838', GradientType=0);
    }
    li.parent.logout {
        position: relative !important;
        top: -42px !important;
        color: red;
    }
    .container-fluid {
        position: relative;
        top: 70px !important;
    }
}
#menu a {
    color: #e0e0e0;
    font-weight: bolder;
}
.menu {
    position: relative;
    padding-left: 10px;
    padding-right: 10px;
    margin: 10px 0 0 0;
}
.menu .glyphicon{
    font-size: x-small;
    position: absolute;
    right: 5px;
    top: 9px;
}
.menu li.parent {
    display: inline-block;
    position: relative;
    top: -9px;
    padding: 5px 7px 5px 7px;
    cursor: pointer;
    height: 33px !important;
}
.menu li.parent.logout{
    float: right;
}
.menu li.parent .fa {
    color: white !important;
}
.menu li.parent:hover {
    color: white !important;
    text-decoration: none;
    -webkit-box-shadow:0 0 10px 5px blue ;
    -moz-box-shadow:0 0 10px 5px blue ;
    box-shadow:0 0 10px 5px blue ;

    /*
    background: rgb(55,153,239);
    background: -moz-linear-gradient(top,  rgba(55,153,239,1) 0%, rgba(32,116,234,1) 25%, rgba(18,49,226,1) 51%, rgba(30,105,222,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(55,153,239,1) 0%,rgba(32,116,234,1) 25%,rgba(18,49,226,1) 51%,rgba(30,105,222,1) 100%);
    background: linear-gradient(to bottom,  rgba(55,153,239,1) 0%,rgba(32,116,234,1) 25%,rgba(18,49,226,1) 51%,rgba(30,105,222,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3799ef', endColorstr='#1e69de',GradientType=0 );
    */
}
.menu li.parent:hover a{
    color: #c0c0c0 !important;
    text-decoration: none;
}
.menu li.parent a:hover{
    color: white !important;
    text-decoration: none;
    white-space: nowrap !important;
}
.menu a, .menu .nested-parent{
    white-space: nowrap;
}
.nested-parent .grandchild{
    white-space: pre-wrap;
}
ul.child {
    display: none;
    position: absolute;
    padding: 0;
    width: auto;
    left: 0;
    top: 33px;
    z-index: 1009;
}
li.child {
    font-weight: normal !important;
    display: inline-block;
    position: relative;
    width: calc(100% + 15px);
    padding: 3px 10px 2px;
    font-family: "Trebuchet MS", sans-serif;
    color: #c0c0c0;
    background-color: #000000;
    z-index: 1009;
}
li.child a, li.child .glyphicon {
    color: #c0c0c0;
    font-weight: normal !important;
}
li.child:hover {
    text-decoration: none;
    -webkit-box-shadow:0 0 10px 5px blue ;
    -moz-box-shadow:0 0 10px 5px blue ;
    box-shadow:0 0 10px 5px blue ;
    z-index: 1010;
}
li.child:hover, li.child:hover a, li.child:hover .glyphicon {
    color: white !important;
}
ul.grandchild {
    display: none;
    position: absolute;
    padding: 0;
    left: 100%;
    top: -2px;
    z-index: 1008;
}
li.grandchild {
    display: inline-block;
    position: relative;
    width: 100%;
    padding: 3px 10px 2px;
    font-weight: normal;
    font-family: "Trebuchet MS", sans-serif;
    color: #c0c0c0;
    background-color: #000000;
    z-index: 1008;
}
li.grandchild:first-child {

}
li.grandchild:last-child {

}
li.grandchild:hover {
    color: white;
    -webkit-box-shadow:0 0 10px 5px blue ;
    -moz-box-shadow:0 0 10px 5px blue ;
    box-shadow:0 0 10px 5px blue ;
    z-index: 1010;
}
#top-padding {
    display: none;
    position: fixed;
    top: 35px;
    height: 10px;
    width: 100%;
    background-color: white;
    z-index: 1006;
}
/* overlay */
#overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100vw; /* Full width (cover the whole page) */
    height: 100vh; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.8); /* Black background with opacity */
    z-index: 1999; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
}
#overlay .loading{
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 50px;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
}

/* body */
body {
    font-family: "Trebuchet MS", sans-serif !important;
}
.container-fluid {
    position: relative;
    top: 35px;
    padding-top: 10px;
    padding-bottom: 45px;
    min-height: calc(100vh - 115px - 40px);
    width: 100%;
}

/* Chip */
.user-info {
    text-align: right;
    height: 70px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.chip {
    display: inline-block;
    padding: 0 20px;
    height: 40px;
    font-size: 12px;
    line-height: 40px;
    border-radius: 25px;
    background-color: #f1f1f1;
}
.chip img {
    float: left;
    margin: 0 10px 0 -25px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
}

/* footer */
.footer {
    position: fixed;
    top: calc(100vh - 40px);
    color: white;
    font-size: 11px;
    z-index: 1010;
    background-color: white;
}
.footer td:first-child {
    height: 10px;
}
.footer tr:last-child {
    background: rgb(69,72,77);
    background: -moz-linear-gradient(top,  rgba(69,72,77,1) 0%, rgba(0,0,0,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%);
    background: linear-gradient(to bottom,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 );
}

/* info */
.errorMsg {
    /*noinspection CssNoGenericFontName*/
    font-family: 'Trebuchet MS';
    position: relative;
    color:#F00;
    font-weight:inherit;
    letter-spacing:1px;
    text-align: center;
    vertical-align: bottom !important;
    font-size: smaller;
}

.doneMsg {
    font-family:Georgia, "Times New Roman", Times, serif;
    font-size:10px;
    color:#093;
    font-weight:inherit;
    letter-spacing:1px;
}