/*================================================================================
        Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
        Version: 2.0
        Author: PIXINVENT
        Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
label{
    font-weight: bold;
}
.disableclick{opacity: 0.52;cursor: not-allowed !important;pointer-events:none !important;}
.app-content .wizard > .steps > ul > li.current > a > label > h6{
    color: #7367F0;
    cursor: default;
}
.app-content .wizard > .steps > ul > li.error > a > label > h6 {
    color: #EA5455;
}
@media (max-width: 768px){
    .app-content .wizard > .steps > ul > li {
        width: 25%;
    }
    .card_in_responsive, #client_submit_form fieldset{
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    label.step_ttl > h6 {
        /*        -webkit-writing-mode: vertical-lr;
                transform: rotate(-180deg);*/
        font-size: smaller;
        overflow-wrap: anywhere;
    }
    .section-responsive{
        height:max-content;
        overflow-y:scroll !important; 
        overflow-x:hidden; 
    }
}
@media (max-width: 653px){
    .flexbox-container{
        margin-right: -18px;
        margin-left: -18px;
    }
}
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) { /* ----------- iPhone 6/7/8 (Portrait and Landscape) ----------- */
    .section-responsive{
        height:max-content;
        overflow-y:scroll !important; 
        overflow-x:hidden;
    }
}
.main-menu .navbar-header .navbar-brand {margin: -9px;}
.error {color: red}
.main-menu.menu-light .navigation li a {
    color: #565656;
    padding: 10px 15px 10px 5px;
    line-height: 1.45;
    -webkit-transition: padding .35s ease 0s!important;
    transition: padding .35s ease 0s!important;
}
.navigation {
    font-size: 1rem;
    font-family: Montserrat,Helvetica,Arial,serif;
    font-weight: 400;
    overflow-y: hidden;
    padding-bottom: 20px;
}
.main-menu.menu-light .navigation li.has-sub ul.menu-content > li.has-sub ul.menu-content {
    margin-left: 15px;
}
.main-menu.menu-light .navigation li.has-sub ul.menu-content {
    padding: 7px;
    margin: -7px -7px 0 -15px;
}
.main-menu.menu-light .navigation>li.open>a, .main-menu.menu-light .navigation>li.sidebar-group-active>a >li.sidebar-group-active>a {
    color: #494949;
    background: #f5f5f5;
    transition: transform .25s ease 0s,-webkit-transform .25s ease 0s;
    border-radius: 6px;
    margin-bottom: 7px;
}
.main-menu.menu-light .navigation>li ul .open>a, .main-menu.menu-light .navigation>li ul .sidebar-group-active>a {
    color: #626262;
    background: #f5f5f5;
    transition: transform .25s ease 0s,-webkit-transform .25s ease 0s;
    border-radius: 6px;
    margin-bottom: 7px;
}
.main-menu.menu-light .navigation>li ul li>a:hover{
    white-space: break-spaces;
}
.timline-avtar {
    left: -5.5rem !important;
}
.timline-img {
    width: 50px!important;
    height: 50px!important; 
}
.content_loader{
    opacity: 0.52;
    cursor: not-allowed !important;
    pointer-events:none !important;
}
.header-navbar .navbar-container ul.nav li>a.nav-link_button {
    color: #626262;
    padding: 0.9rem .5rem 0.8rem 0;
}
.header-navbar .navbar-container ul.nav li>a.nav-link_button > button {
    padding: 0.8rem 1.6rem;
}
.header-navbar .navbar-container ul.nav li>a.nav-link_input {
    color: #626262;
    padding: 0.9rem .5rem 0.8rem 0;
}
.fonticon-container i {
    color : #696969;
    font-size : 1.8rem;
}

.fonticon-container:hover i {
    color : #7367F0;
    font-size : 1.8rem;
    cursor: pointer;
    transform: unset !important;
}

.card-body p.task_time_line_description{
    white-space: normal;
}
.card-body .task_details {
    white-space: break-spaces;
    text-overflow: ellipsis;
    color: #7a7d82;
    font-size: 13px;
}

.task-list-row h4.task_title {
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    padding: 0;
    width: 60%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.text_clickable{
    cursor: pointer;
}
.progress-bar-primary {
    background-color: rgba(0, 0, 0, 0.28) !important;
}   
.browser-info > p {
    font-size: 11px !important;
    color:white;
} 
.past_due_bg {
    background-color: #2A044A;
}

.due_today_bg {
    background-color: #0B2E59;
}

.urgent_task_bg {
    background-color: #0D6759;
}

.task_on_hold_bg {
    background-color: #438e5f;
}

.complete_bg {
    background-color: #738e43;
}

.my_todo_list_bg {
    background-color: #437d8e;
}
td.dataTables_empty{
    text-align: center;
}
.signed_proposal{
    background-color: #000000;
}
.btn.btn-sm.btn-icon {
    padding: 0.4rem;
}
/*.comment_section .media:hover {
    -webkit-transform: translateY(-4px);
    -ms-transform: translateY(-4px);
    transform: translateY(-4px);
    box-shadow: 0 3px 10px 0 #cccccc;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}*/

.card .card-header .heading-elements a[data-action="close"]{display: none;}

/*
 * wrap text in modal and display modal header in center
 */
.modal .table tr th:nth-of-type(2) {word-break: break-all;}
.modal .modal-header .modal-title{width: 100%; text-align: center;}

/* colorbox To change position of close button to Top Right Corner */
#colorbox #cboxClose
{
top: 0;
right: 0;
}
#cboxLoadedContent{
margin-top:28px;
margin-bottom:0;
}


/*select 2 css*/

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    word-break: break-all;
    word-wrap: break-word;
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
    white-space: normal !important;
}

.commentTextSection{
    word-break: break-word;
}

@keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
.content_block{
  opacity: 0.52;
  cursor: not-allowed !important;
  pointer-events:none !important;
}
.content_block:before {
  position: absolute;
  font-family: 'FontAwesome';
  top: 32%; 
  left: 47%; 
  content: "\f110"; 
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear; 
  font-size: 40px; 
  z-index: 10 !important;
}

/* fullcalendar display date in week section */ 
.fc .fc-view-container .fc-head .fc-head-container thead .fc-day-header.fc-today{color: inherit !important;}

/* dashboard tile background color */ 
.dash-tile-color{ background-color: #c9c5f1;}

/* praposal class for actions button */
.hide{display: none;}

/* View task table responsive: START */
/*.table-responsive-stack tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}*/

table.dataTable thead>tr>th {
    text-transform: uppercase !important;
}

@media screen and (max-width: 768px) {
    .table-responsive-stack td,

   .table-responsive-stack tr {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      display:block;
   }

   /*  IE9 FIX   */
   .table-responsive-stack td {
      float: left\9;
      width:100%;
   }
   
    .setTdWidth td:first-child{
        width: 100% !important;
    }

    .switch-label{
        width: 100%;
        display: flex;
    }
    
}
/* View task table responsive: END */

/* breadcrumb responsive */
@media screen and (max-width: 768px) {
   html body .content .content-wrapper .content-header-title{    margin-left: 12px;}
   .breadcrumb-wrapper.col-12{display: flex;padding: 15px 0 0 0!important;}
   .breadcrumb{border-left: unset;}

}

/*proposal btn css*/
.proposal_btn{width: 100%; text-align: right;}
@media screen and (max-width: 768px) {
   .proposal_btn .sow_btn{width: 100%; display: block;margin-bottom: 11px;line-height: 18px;}
}
@media screen and (max-width: 768px) {
    .client-breadcrumb{
       display: grid !important; 
    }
}

.bread-left{float: left;}
.bread-right{float: right;}