/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
.app-logo {
    margin-left: 5px;
    margin-top: 5px;
    height: 47px;
}

.system-menu {
    color: #fee600;
}

    .system-menu:hover, .system-menu:focus, system-menu.active {
        color: yellow;
    }

.navbar-toggle .icon-bar {
    background-color: white;
}

.control-label {
    padding-left: 0px;
    padding-right: 0px;
}

.header-style {
    background-color: #2e2e38;
    border-color: #666666;
    height: 7%;
    max-height: 7%;
}

.footer-style {
    background-color: #333;
    border-color: #080808;
    /*clear: both;
    position: relative;
    z-index: 10;
    height: auto;
    margin-top: -3em;*/
    color: silver;
}

.header-text {
    font-size: 23px;
    font-weight: 400;
}

.header-div {
    padding-top: 14px; 
}

.body-container {
    margin-top: 14px;
    margin-bottom: 5px;
    min-height: 600px;
    background-color: #ffffff;
    box-sizing: border-box;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(204, 204, 204, 1);
    border-radius: 0px;
    -moz-box-shadow: 2px 2px 2px rgba(204, 204, 204, 0.349019607843137);
    -webkit-box-shadow: 2px 2px 2px rgba(204, 204, 204, 0.349019607843137);
    box-shadow: 2px 2px 2px rgba(204,204,204,0.349019);
}

.client-container {  
    margin:25px;   
    min-height: 300px;
    background-color: #ffffff;
    box-sizing: border-box;    
}
.client-common{
     padding:15px;
}
.clienttab{
    background-color:rgba(245, 245, 245, 1);    
}
.tabmargin{
     margin-right:  0px !important; 
}

.clienttab-border{   
    border-width: 1px; 
    left:0px;
    top:0px;
    background:inherit;  
    background-color:rgba(235, 235, 235, 1);  
    box-sizing:border-box;
    border-style: solid;
    border-color: rgba(204, 204, 204, 1);
    border-bottom:0px;
    border-radius:3px;
    border-bottom-right-radius:0px;
    border-bottom-left-radius:0px;
     -moz-box-shadow: none;
    -webkit-box-shadow: none;
     box-shadow:none;      
}

body {
    background-color: #f0f0f0;
}

.footer-text {
    text-decoration: none;
    font-weight: bold;
    letter-spacing: 0.02em;
    line-height: 19.2px;
    color: #fff;
    padding-top: 13px;
    padding-bottom: 13px;
}

.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
    color: #c0c0c0;
    /*background-color: #080808;*/
}

/*.collapse.navbar-collapse {
    padding-left: 0px !important;
}*/

.nav > li > a.selected {
    border-bottom: 5px solid #fee600 !important;
    background-color: #1b1b1b !important;
    padding-bottom: 16px;
}

.nav .open > a, .nav .open > a:hover, .nav .open > a:focus
{
    background-color:#1b1b1b !important
}
.nav > li > a {
    /*text-transform: uppercase;*/
    color: silver !important;
    text-align: left;
    color: #f2f2f2 !important;
    font-size: 16px !important;
    line-height: 19.2px;
    letter-spacing: 0.02em;
}

    .nav > li > a:hover, .nav > li > a:focus {
        text-decoration: none;
        background-color: transparent !important;
        color: #fff !important;
    }

@font-face {
    font-family: 'NotoSansRegular';
    src: url('../Content/fonts/NotoSans-Regular.ttf');
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0px;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0px 6px 12px rgba(0,0,0,0.175);
}

.navbar-nav > li > .dropdown-menu {
    background-color: #000;
}


.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .active > a {
    background-image: -webkit-linear-gradient(top,#080808 0,#0f0f0f 100%);
    background-image: -o-linear-gradient(top,#080808 0,#0f0f0f 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,from(#080808),to(#0f0f0f));
    background-image: linear-gradient(to bottom,#080808 0,#0f0f0f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808',endColorstr='#ff0f0f0f',GradientType=0);
    background-repeat: repeat-x;
    -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
    box-shadow: inset 0px 3px 9px rgba(0,0,0,0.25);
}



.dropdown-menu > li > a {
    display: block;
    padding: 8px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.0;
    color: black;
    white-space: nowrap;
    height: 30px;
}

.navbar-nav > li > .dropdown-menu > li > a {
    border-top: 1px solid #888;
    color: silver;
    height: 50px;
    line-height: 1.4285;
    padding: 15px 20px;
}


.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    text-decoration: none;
    background-color: #8c8c8c !important;
    color: #fff;
}

.navbar-nav > li > .dropdown-menu > li > a:hover, .navbar-nav > li > .dropdown-menu > li > a:focus {
    text-decoration: none;
    background-color: #1b1b1b !important;
    color: #fff;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    background-color: #8c8c8c !important;
    color: #fff;
    text-decoration: none;
    outline: 0;
}

.navbar-nav > li > .dropdown-menu > .active > a, .navbar-nav > li > .dropdown-menu > .active > a:hover, .navbar-nav > li > .dropdown-menu > .active > a:focus {
    color: #fff;
    text-decoration: none;
    outline: 0;
    background-color: transparent !important;
}


.btn {
    border-radius: 0px;
    /*font-weight: bold;*/
   
}

.btn-default {
    color: #ffffff!important;
    background-color: #666666!important;
    border:none;
    -webkit-box-shadow: inset -2px -2px 0px #333333;
    box-shadow: inset -2px -2px 0px #333333;
}



.btn-default:hover {
     background-color: #666666!important;
    -webkit-box-shadow: inset 0px 0px 0px #333333;
    box-shadow: inset 0px 0px 0px #333333;
     color: #ffffff!important;
}

.btn-default:focus
{
      background-color: #666666!important;
      color: #ffffff!important;
      -webkit-box-shadow: inset 0px 0px 0px #333333;
    box-shadow: inset 0px 0px 0px #333333;

}



.btn-default:active,
.btn-default.active
 {
     background-color: #666666!important;
    color: #ffffff!important;
    -webkit-box-shadow: inset -2px -2px 0 #333333, -2px -2px 0px #333333;
    box-shadow: inset -2px -2px 0 #333333, -2px -2px 0px #333333;
    outline:none!important;
}



.btn-primary {
    color: #333333!important;
    background-color: #ffe600!important;
    border:none!important;
    -webkit-box-shadow: inset -2px -2px 0px #c0c0c0;
    box-shadow: inset -2px -2px 0px #c0c0c0;
}



.btn-primary:hover {
     background-color: #ffe600!important;
    -webkit-box-shadow: inset 0px 0px 0px #c0c0c0;
    box-shadow: inset 0px 0px 0px #c0c0c0;
     color: #333333!important;
}

.btn-primary:focus
{
      background-color: #ffe600!important;
      color: #333333!important;
      -webkit-box-shadow: inset 0px 0px 0px #c0c0c0;
    box-shadow: inset 0px 0px 0px #c0c0c0;

}



.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
     background-color: #ffe600!important;
    color: #333333!important;
    -webkit-box-shadow: inset -2px -2px 0 #c0c0c0, -2px -2px 0px #c0c0c0;
    box-shadow: inset -2px -2px 0 #c0c0c0, -2px -2px 0px #c0c0c0;
    outline:none!important;
}

        /*.btn-primary:active:hover,
        .btn-primary.active:hover,
        .open > .dropdown-toggle.btn-primary:hover,
        .btn-primary:active:focus,
        .btn-primary.active:focus,
        .open > .dropdown-toggle.btn-primary:focus,
        .btn-primary:active.focus,
        .btn-primary.active.focus,
        .open > .dropdown-toggle.btn-primary.focus {
            color: #080808;
            background-color: yellow;
        }*/


.bootstrap-select > .dropdown-toggle {
    background-color: transparent !important;
    color: black !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border:1px solid #ccc!important;
}

    .bootstrap-select > .dropdown-toggle:focus,
    .bootstrap-select > .dropdown-toggle.focus {
        background-color: transparent;
        color: black;
    }

    .bootstrap-select > .dropdown-toggle:active,
    .bootstrap-select > .dropdown-toggle.active,
    .open > .bootstrap-select > .dropdown-toggle.btn-default {
        background-color: transparent;
        color: black;
    }


.btn-circle {
    width: 49px;
    height: 49px;
    text-align: center;
    padding: 5px 0;
    font-size: 20px;
    line-height: 2.00;
    border-radius: 30px;
}

.btn-circle-action {
    width: 85px;
    height: 85px;
    text-align: center;
    padding: 5px 0;
    font-size: 30px;
    line-height: 2.00;
    border-radius: 50px;
    border-color: #333;
}

/*.table-responsive, .table-responsive td, .table-responsive th {
    border: 1px solid #f4f4f4 !important;
}

    .table-responsive tr:nth-child(even) {
        background-color: #f8f8f8;
    }

    .table-responsive tr:nth-child(odd) {
        background-color: #fff;
    }*/

    .table
    {
        border: 1px solid #bfbfbf !important;
    }

/*.table, .table td, .table th {
    border: 1px solid #bfbfbf !important;
}

    .table th {
        border: 0px solid #bfbfbf !important;
    }*/



    .table tr:nth-child(even) {
        background-color: #f8f8f8;
    }

    .table tr:nth-child(odd) {
        background-color: #fff;
    }

thead > tr {
    background-color: #f4f4f4 !important;
    color: #333333;
}

th > a {
    color: #333333 !important;
}

td > a.glyphicon {
    color: rgba(0, 0, 0, .25) !important;
    font-size: 20px;
    text-decoration:none!important;
}

    td > a.glyphicon:hover {
        color: #8c8c8c !important;
        font-size: 20px;
    }

.verticalLine {
    border-right: 1px solid silver;
    height: 100%;
}

.verticalLine-footer {
    border-left: 1px solid silver;
    height: 80%;
}

.form-control:focus {
    border-color: #FFD200;
    box-shadow: none;
}

.form-control {
    border-radius: 0;
}
.Arabictext {
    direction: rtl;
}

.modal-content {
    border-radius: 0;
}

.status-header-style {
    font-weight: bolder;
    color: #fff;
    background-color: #8c8c8c;
}

.statusdiv-style {
    padding-top: 10px;
}

.span-font-small {
    font-weight: 100;
    font-size: smaller;
}

.badge-style {
    color: #fff;
    background-color: #8c8c8c;
}

.badge-current-style {
    color: #fff;
    background-color: #333;
}

.btn-circle:hover, .btn-circle:focus {
    color: antiquewhite;
}

.badge-action-style {
    color: #333;
    background-color: gainsboro;
}

.horizontal {
    display: inline-block;
    width: 13%;
    border-top: 3px solid silver;
    margin-left: -5px;
    margin-right: -4px;
}

.action-span-style {
    position: absolute;
    margin-top: 100px;
    font-weight: bold;
    color: #2C689B;
    min-width: 80px;
    text-align: center;
}

.smallLabel {
    text-align: left !important;
    font-size: 11px !important;
    color: gray !important;
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .app-logo {
        margin-top: 5px;
        height: 27px;
    }
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .app-logo {
        margin-top: 5px;
        height: 37px;
    }
}
/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .app-logo {
        margin-top: 5px;
        height: 47px;
    }
}

/* .btn-tab {
    color: #fff;
    background-color: #8c8c8c;
    font-weight: normal;
    font-size: 15px;
}

   .btn-tab:focus,
    .btn-tab.focus {
        color: #fff;
        background-color: #333;
    }

    .btn-tab:hover {
        color: #fff;
        background-color: #333;
    }

    .btn-tab:active,
    .btn-tab.active {
        color: #666666;
        background-color: #333;
    }*/

.nav-tabs > li > a {
    background-color: #E4E4E4 !important;
    color: #333333 !important; 
    border-radius: 0px !important;   
}

    .nav-tabs > li > a:hover {
        background-color: #EBEBEB !important;
        border-color: #eee #eee #ddd; 
        color: #333333 !important;       
    }

.nav-tabs > li.active > a {
   background-color: #666666 !important;
    color: #fff !important;    
}

    .nav-tabs > li.active > a:hover {
        background-color: #666666 !important;
        color: #fff !important;        
    }

    .nav-tabs > li.active > a:focus {
        background-color: #666666 !important;
        color: #fff !important;        
    }
    .tt-input
    {
        border-radius:0px!important;
    }

    .client-name{
        display:inline-block;
        font-size:23px;
        word-wrap:break-word;
        word-break:break-all;
    }

.client_ClientName {
    word-wrap: break-word;
    word-break: break-all;
}


    .k-window-titlebar
    {
        padding-left:0px!important;
        padding-right:0px!important;
    }

.k-list{
    max-height:250px!important;
    overflow:auto!important;
    } 

.spreadsheet-fullview{
    width: 100%!important;
    position: fixed!important;
    height: 100%!important;
    top: 0px!important;
    left: 0px!important;
    z-index: 1!important;
}

.btnHeader
{
    margin-left:5px;
}

.gMapIcon{
    font-size:25px !important;
    margin-top:4px;
}

   .contact-type {
        border-width:0px; 
        left:0px;
        top:0px;
        width:122px;
        height:42px;
        background:inherit;
        background-color:rgba(255, 255, 255, 0);
        box-sizing:border-box;
        border-width:3px;
        border-style:solid;
        border-color:rgba(51, 51, 51, 1);
        border-left:0px;
        border-top:0px;
        border-right:0px;
        border-radius:5px;
        border-top-left-radius:0px;
        border-top-right-radius:0px;
        border-bottom-right-radius:0px;
        border-bottom-left-radius:0px;
        -moz-box-shadow:none;
        -webkit-box-shadow:none;
        box-shadow:none;
        font-size:14px;
        color:#666666;
        text-align:left;
    }

   .managepanel
    {
         border:none !important;
    }
    .managementhead {
        height: 40px;
        border-bottom: solid;
        border-width: 1px;
        border-color: rgba(192, 192, 192, 1);
    }
    .AddressBorder{
        margin:20px;
        border-color: rgba(121, 121, 121, 1) !important;
    }

   .tabcolor > li > a {
        background-color: rgba(235, 235, 235, 1) !important; 
        font-weight: normal !important;   
        color:#333333 !important;           
        border-color:rgba(204, 204, 204, 1) !important;  
        margin-right:0px !important;              
    }

    .tabcolor > li > a:hover {
        background-color: rgba(228, 228, 228, 1) !important;
        font-weight:normal !important;
        color:#333333 !important;
        border-color:rgba(204, 204, 204, 1) !important;  
        margin-right:0px !important;       
    }

    .tabcolor > li.active > a {   
        background-color:  rgba(255, 255, 255, 1) !important;
        font-weight:bold !important;
        color:#333333 !important;
        border-color:rgba(204, 204, 204, 1) !important;          
        margin-right:0px !important;        
        border-bottom: 0px !important;
        outline:none
    }

    .tabcolor > li.active > a:hover {
        background-color: rgba(228, 228, 228, 1) !important;
         font-weight:bold !important;
         color:#333333 !important;
         border-color:rgba(204, 204, 204, 1) !important;          
         margin-right:0px !important;         
         border-bottom: 0px !important;
         outline:none
    }
    .tabcolor > li.active > a:focus {
        background-color: rgba(255, 255, 255, 1) !important;
         font-weight:bold !important;
         color:#333333 !important;
         border-color:rgba(204, 204, 204, 1) !important; 
         margin-right:0px !important;         
         border-bottom:0px !important;
         outline:none
    }
    .innertab > li > a {
        background-color: rgba(204, 204, 204, 1) !important; 
        font-weight: normal !important;   
        color:#333333 !important;   
        border-color:rgba(204, 204, 204, 1) !important;  
        margin-right:0px !important;               
    }

    .innertab > li > a:hover {
        background-color: rgba(228, 228, 228, 1) !important;
        font-weight:normal !important;
        color:#333333 !important;
        border-color:rgba(204, 204, 204, 1) !important;  
        margin-right:0px !important;             
    }

    .innertab > li.active > a {   
        background-color:  rgba(250, 250, 250, 1) !important;
        font-weight:bold !important;
        color:#333333 !important;
        border-color:rgba(204, 204, 204, 1) !important;  
        margin-right:0px !important; 
        border-bottom-color: rgba(250, 250, 250, 1) !important;
        outline:none   
    }

    .innertab > li.active > a:hover {
         background-color: rgba(228, 228, 228, 1) !important;
         font-weight:bold !important;
         color:#333333 !important;
         border-color:rgba(204, 204, 204, 1) !important; 
         margin-right:0px !important; 
         outline:none
    }
    .innertab > li.active > a:focus {
         background-color: rgba(250, 250, 250, 1) !important;
         font-weight:bold !important;
         color:#333333 !important;
         border-color:rgba(204, 204, 204, 1) !important; 
         margin-right:0px !important;
         border-bottom-color: rgba(250, 250, 250, 1) !important;
         outline:none
    }

    .tabcolor {
        border-bottom: 0px !important;
    } 
    
    .budgetLine{
        margin-left:15px !important;
        margin-right:15px !important;
    }
    .budgetmdBody{
        height:705px !important;
    }
    .lblbudgetLocked{
        font-size:15px !important;
        font-weight:bold !important;
        padding-right:50px !important;
    }   

    .btn-defaultborder{
    border:1px solid rgba(100, 100, 100, 1);
    /*padding-left:20px!important;
    padding-right:20px!important;*/
}
    .btn-todo{
    border:1px solid rgba(100, 100, 100, 1);
   background-color: rgba(100, 100, 100, 1);
   color:#ffffff!important;
   text-align:center;
   vertical-align:middle;
    text-decoration:none!important;
}
   

  .normallistviewdv{
      min-height:600px;background-color:#fff;margin-top:1%;
  }

    .notificaitonToggle{
       min-width:400px;min-height:200px;display:none;background-color:#fff;position:absolute;z-index:12;border:1px solid #808080;
    }

    .btn-dashboard {
    color: #333333!important;
    background-color: #ffe600!important;
    border:none!important;
    padding:2px 8px;
    font-size:13px;
}
    .btn-dashboard:hover{
        cursor:pointer;
        text-decoration:none;
    }

        .dropdown-content {
                                        display: none;
                                      
                                       
                                        z-index: 1;
                                        position: absolute;
                                        background-color: #fff;
                                        /*border: 1px solid #808080;*/
                                        left: 44%;
                                    }

                                        .dropdown-content span {
                                            display: block;
                                           padding-top:5px;
                                            text-align: left;
                                        }

                                    .show {
                                        display: block;
                                    }


.height28
{
    height: 28px !important;
}

.delegate-backcolor {
    color: #ffe600;
}

.deadLineDaysCount {
    font-weight: bold !important;
    font-size: 22px !important;    
}
.deadLineDaysStatus
{
    font-weight: bold !important;
    font-size: 16px !important;
}
.deadLineDaysAlign{
    padding-left:0px !important;
    padding-right:0px !important;
    text-align:center;
}

.serviceFormGroup{
    margin-bottom:15px !important;
}
.serviceFormGroup_left{
    margin-left:-11px !important;
}

input.transparent-input {
    background-color: #1A1A24 !important;
    border-color: #1A1A24 !important;
    color: #f2f2f2 !important;
    font-size: 16px !important;
}
    input.transparent-input:focus {
        border-color: #1A1A24 !important;
    }

    input.transparent-input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #f2f2f2 !important;
        font-size: 14px !important;
        opacity: 1;
    }

    input.transparent-input:-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #f2f2f2 !important;
        font-size: 14px !important;
        opacity: 1;
    }

    input.transparent-input::-ms-input-placeholder { /* Microsoft Edge */
        color: #f2f2f2 !important;
        font-size: 14px !important;
        opacity: 1;
    }

/* enable absolute positioning */
.inner-addon {
    position: relative;
}


/* style icon */
.inner-addon .fa {
    position: absolute;
    padding-top: 23px;
    padding-left:10px;
    pointer-events: none;
}

/* align icon */
.left-addon .fa {
    left: 0px;
}

.right-addon .fa {
    right: 0px;
}

/* add padding  */
.left-addon input {
    padding-left: 30px;
}

.right-addon input {
    padding-right: 30px;
}


.client-search .tt-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    min-width: 515px !important;
    padding: 5px 0;
    margin: 0 !important;
    list-style: none;
    font-size: 14px;
    background-color: #2e2e38 !important;
    border: 1px solid #2e2e38 !important;
    border-radius: 0px !important;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: border-box !important;
    *border-right-width: 2px;
    *border-bottom-width: 2px;
}

    .client-search .tt-menu .tt-suggestion {
        display: block;
        padding: 8px 20px !important;
        clear: both;
        font-weight: normal;
        line-height: 1.42857143;
        color: #f2f2f2 !important;
        white-space: nowrap;
    }

    .client-search .tt-menu .tt-suggestion {
        margin: 0;
    }

    .client-search .tt-menu .tt-selectable:hover {
        cursor: pointer;
        text-decoration: none;
        outline: 0;
        background-color: transparent !important;
        color: #f2f2f2 !important;
        /*font-weight: bold !important;*/
    }

.suggestion-item {
    margin-bottom: 5px;
    border-bottom: 1px solid #474747
}

.suggestion-name a, .suggestion-name a:link, .suggestion-name a:visited, .suggestion-name a:hover, .suggestion-name a:active {
    color: inherit;
    text-decoration: inherit;
    font-weight: inherit;
}


a.nav-link-button {
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 5px;
    padding: 2px 4px;
    transition: color 0.3s,background-color 0.3s,border 0.3s;
    text-decoration: underline;
}

    a.nav-link-button:hover {
        color: #2e2e38;
        background-color: #f3f3f3;
    }

.navigate-buttons {
    margin: 5px 0;
    text-align: right;
    font-size: small;
    color: #b1b1b1;
}