/*
 * It is advised not to edit the smartadmin_production.css
 * as this will override any changes you make in the 
 * later versions of this theme. 
 * 
 * We advise that you use use this CSS to override 
 * SmartAdmin styles. 
 * 
 * Rename the stylesheet to whatever your liking so it will stay
 * unique to you with each update of SmartAdmin.
 */

/*
 * INDEX
 * 
 * - HTML
 * - BODY
 * - CUSTOM STYLES
 */


#ribbon {
    background: #0078C1!important;
    border-bottom: 1px solid #0078C1!important;
    border-top: 1px solid #0078C1!important;
}


#main{
    margin-left: 0px; /* remove menu bar */
}

body{
    font-size: 15px;
}

.jarviswidget>div{
    font-size: 15px;
}

.form-control{
    font-size: 15px;
}

.jarviswidget>header h2{
    font-size: 16px;
}

.table thead tr {
    font-size: 15px;
}

.top-buffer { margin-top:20px; }

.btn-margin-above{
	margin-top: 10px;
}

.btn-margin-right{
	margin-right: 10px;
}
 
.btn-margin-left{
	margin-left: 10px;
}  
.btn-margin-below{
	margin-bottom: 10px;
}

.list-margin-below{
	margin-bottom: 10px!important;
}

.input-margin-below{
	margin-bottom: 10px;
}

.list-margin-right{
	margin-right: 40px
}

.icon-pull-right{
	float: right;
	line-height: 20px;
	font-size: 20px;	
    margin-left: 10px;
}

#extr-page #header #logo img {
    width: 150px;
}

#logo img {
    width: 150px;
}


.pull-right{
	float: right;
}

.right-align-textbox{
    text-align: right;
}

/* Claun up labels */

.label.font-sm{
    font-size: 76% !important;
}

.label.font-xs{
    font-size: 76% !important;
}

/* Clean up ribbon */

#ribbon {
    background: #00a7e1!important;
    border-bottom: 1px solid #00a7e1!important;
    border-top: 1px solid #00a7e1!important;
}

#ribbon .breadcrumb, #ribbon .breadcrumb a {
    color: #E4E4E4!important;
    text-decoration: none!important;
}

#ribbon .breadcrumb li:last-child, #ribbon .breadcrumb>.active {
    color: #E4E4E4!important;
}

.breadcrumb>li+li:before {
    content: "|";
    padding: 0 5px;
    color: #E4E4E4;
}

.toast-message li{
     margin-left: -25px;
}

#header {
    background-image: linear-gradient(to bottom,#f3f3f3,#e2e2e2)!important;
    background-repeat: repeat-x!important;
}

.cg-busy-backdrop {
	background-color:grey;
	opacity:0.6;
}

.toggle-yes {
    color: #739e73;
}

.toggle-no {
    color: #a90329;
}


.fake-link:hover{
    cursor: pointer;
    background-color: #f5f5f5;
}

.fake-link-pointer:hover{
   cursor: pointer;
}

.pager-text{
    margin-bottom: 18px;
    font-weight: 600;
}

.item-header{
    margin-bottom: 10px;
    font-weight: 600;
}

.item-header-no-margin{
    font-weight: 600;
}

.btn-file {
    position: relative;
    overflow: hidden;
}


.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}

.ng-invalid.form-control.with-validation{
    background: #fff0f0;
    border-color: #A90329;
}

.ng-valid.form-control.with-validation{
    background: #f0fff0;
    border-color: #7DC27D;
}

.ng-valid.ui-select-container.with-validation .form-control{
    background: #f0fff0;
    border-color: #7DC27D;
}

.ng-invalid.ui-select-container.with-validation .form-control{
    background: #fff0f0;
    border-color: #A90329;
}


.validation-message{
    display: block;
    margin-top: 6px;
    padding: 0 1px;
    font-style: normal;
    font-size: 13px;
    line-height: 15px;
    color: #D56161;
}

.control-label{
    font-size: 15px;
    font-weight: 600;
}

.note{
    font-size: 14px;
}
/* Clean up logout button */

@media (max-width: 880px) and (min-width: 768px)
{
    .btn-header.transparent a {
        border-radius: 2px;
        cursor: default!important;
        display: inline-block;
        font-weight: 700;
        padding: 2px;
        text-align: center;
        text-decoration: none!important;
        -webkit-user-select: none;
        background-color: #f8f8f8;
        background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
        border: 1px solid #bfbfbf!important;
        color: #6D6A69;
        font-size: 17px;
        margin-top: 5px!important;
        width: 40px!important;
        height: 39px!important;
        line-height: 38px!important;
    }
    
    .btn-header.transparent a:hover {
        color: #6D6A69;
    }
    
    #logout i {
        color: #eeeeee!important;
        font-size: 121%;
    }
}

@media (max-width: 767px) and (min-width: 320px)
{
    .btn-header.transparent a {
        border-radius: 2px;
        cursor: default!important;
        display: inline-block;
        font-weight: 700;
        padding: 2px;
        text-align: center;
        text-decoration: none!important;
        -webkit-user-select: none;
        background-color: #f8f8f8!important;
        background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
        border: 1px solid #bfbfbf!important;
        color: #6D6A69;
        font-size: 17px;
        margin-top: 5px!important;
        width: 50px!important;
        height: 39px!important;
        line-height: 38px!important;
    }
 
    .btn-header.transparent a:hover {
        color: #6D6A69!important;
    }
    
    #logout i {
         color: #eeeeee!important;
        font-size: 121%!important;
    }
}


/* Availability boxes */

.tribox{
    width: 23px;
    height: 23px;
    float: left;
    margin-right: 3px;
    margin-bottom: 3px;
   
}

.tribox.state0{
 background-color: #a90329
}

.tribox.state1{
 background-color: #c79121
}

.tribox.state2{
 background-color: #739e73
}

.triboxtallheader{
    width: 23px;
    height: 23px;
    float: center;
    margin-right: 3px;
    margin-bottom: 3px;     
}

.triboxtall{
    width: 23px;
    height: 23px;
    float: left;
     margin-right: 3px;
    margin-bottom: 3px;     
}

.triboxtall.state0{
 background-color: #a90329
}

.triboxtall.state1{
 background-color: #c79121
}

.triboxtall.state2{
 background-color: #739e73
}

.signature{
    border: 1px solid #000;
    display: block;
    margin: auto;
    width: 280;
    height: 180;
    background-color: #fff2cc;
}

/* Nag List */

.dark-mode.pagination>li>a {
    background-color: #555!important;
    border-color: #fff!important;
    color: #8bc9ff!important;
}

.dark-mode.pagination>.active>a{
     background-color: #888!important;
    color: #fff!important;
}

.jarviswidget>div.nag-list{
    background-color: #333333!important
}

list-group-item.nag-item{
    border: none;
    background-color: #333333!important;
}

.nag-item{
    border: none;
    margin-bottom: 5px;
 
}
.nag-priority-0{
     background-color: #cc00ff;
     color: #fff;
}
.nag-priority-1{
     background-color: #ff0000;
     color: #fff;
}
.nag-priority-2{
     background-color: #ff3300;
    color: #fff;
}
.nag-priority-3{
     background-color: #ff6600;
      color: #fff;
}
.nag-priority-4{
     background-color: #ff9900;
      color: #fff;
}
.nag-priority-5{
     background-color:#ffcc00; 
      color: #000;
}
.nag-priority-6{
     background-color: #ffff00;
      color: #000;
}
.nag-priority-7{
     background-color: #ccff00;
     color: #000;
}
.nag-priority-8{
     background-color: #99ff00;
     color: #000;
}
.nag-priority-9{
     background-color: #66ff00;
      color: #000;
}
.nag-priority-10{
     background-color: #00ff00;
     color: #000;
}
.nag-priority-11{
     background-color: #00ff66;
      color: #000;
}
.nag-priority-12{
     background-color: #00ff99;
      color: #000;
}

.nag-priority-13{
    background-color: #00ffcc;
      color: #000;
}
.nag-priority-14{
    background-color: #00ffff;
    color: #000;
}
.nag-priority-15{
    background-color: #0099ff;
    color: #fff;
}
.nag-priority-16{
    background-color: #0066ff;
    color: #fff;
}
.nag-priority-17{
    background-color: #0033ff;
    color: #fff;
}
.nag-priority-18{
    background-color: #0000ff;
    color: #fff;
}