/****************************************/
/***Ability Listing View***/
/**************************************/

.path-abilityaction .main-container.container {
    /*background-color: #f3f3f3;*/
}

.smlgrytxt {
    font-size:12px;
    color:#999;
}

/*top headline bar*/

.abilitybreadcrumbs {
    font-size:14px;
    color:#777;
}


.topabilityheadline {
    position: -webkit-sticky;
    position: sticky;
    top: 50px;
    background-color: white;
    z-index: 10;
}

.actbtn {
    background: #F39C12;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    border-radius: 3px;
    color: #fff;
    margin-top: 15px;
    text-align: center;
    cursor: pointer !important;
    font-weight: 600;
    /*width: fit-content;*/
    font-size: 16px;
}



.profileimg {
    display: inline-block;
    position: relative;
    width: 30px;
    height: 30px;
    overflow: hidden;
    border-radius: 50%;
    box-shadow: 5px 5px 5px #e7e7e7;
    margin-top: 5px;
}

.profileimg img {
    width: auto;
    height: 100%;
}

.abilitymsgimg {
    display:inline-block;
    vertical-align: middle;
}

.abilitymsgtxt {
    display:inline-block;
    vertical-align: middle;
    margin-left: 5px;
    width:85%;
}

a.messagecomprep {
    font-weight:700;
    font-size:10px;
}

.messagedate {
    /*display: inline-block;*/
    font-size: 10px;
    font-weight: 500;
    color: #999;
}

.myablyButton {
    padding: .2em 1em;
    font-size: 1em;
}

#myablyDiv {
    color:Green;
    background-color:#eee;
    border:2px solid #333;
    display:none;
    text-align:justify;
}
#myablyDiv p {
    margin: 15px;
    font-size: 0.917em;
}

/* workflow progress bar */
.abltyservwfsuby {
    padding-top: 8px;
    background: #f3f3f3;
}

.servwf {
    /*** Element found in max-width: 768px ***/
}
  
.servwf .stepper {
    width: 100%;
    display: flex;
  }
  
  .servwf li {
    display: inline-block;
    position: relative;
    margin-top: 32px;
  }
  .servwf li + li {
    flex-grow: 1;
    display: flex;
    flex-direction: row;
  }
  .servwf li + li::before {
    display: block;
    position: absolute;
    left: -10%; 
    top: -16px;
    content: "";
    width: 100%;
    height: 4px;
  }
  
  .servwf .item {
    position: relative;
    margin-left: auto;
    margin-right: 0;
    padding-top: 8px;
    z-index: 1;
    text-align: right;
  }
  
  .servwf .item::before {
    width: 32px;
    height: 32px;
    position: absolute;
    content: "";
    top: -32px;
    /*left: 0;*/
    right: 0;
    margin: auto;
    border-radius: 50%;
    box-sizing: border-box;
  }
  
  .servwf .ready::before {
    background-color: lightgrey;
  }
  .servwf .ready > .item::before {
    background-color: lightgrey;
  }
  
  .servwf .wip::before {
    background-color: #2f4050;
    /*background-color: #ff914d;*/
  }
  .servwf .wip > .item::before {
    border: solid 8px #ff914d;;
    background-color: white;
  }
  
  .servwf .done::before {
    background-color: #2f4050;
    /*background-color: #ff914d;*/
  }
  .servwf .done > .item::before {
    background-color: #2f4050;
    /*background-color: #ff914d;*/
  }
  
  
  .servwf ul,
  .servwf li {
    padding: 0;
    list-style: none;
  }

/* service action box area */
.abltyservicehelpertab {

}

/* tabs start */


.abltyservicehelper .tabset > input[type="radio"] {
    position: absolute;
    left: -200vw;
  }
  
  .abltyservicehelper .tabset .tab-panel {
    display: none;
  }
  
  .abltyservicehelper .tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
  .abltyservicehelper .tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
  .abltyservicehelper .tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
  .abltyservicehelper .tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
  .abltyservicehelper .tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
  .abltyservicehelper .tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
    display: block;
  }
  
  
  .abltyservicehelper .tabset > label {
    position: relative;
    display: inline-block;
    /*padding: 15px 15px 25px;*/
    border: 1px solid transparent;
    border-bottom: 0;
    cursor: pointer;
    font-weight: 600;
    background-color: #fff;
  }
  
  .abltyservicehelper .tabset > label::after { /*label not check */
    content: "";
    position: absolute;
    left: 15px;
    bottom: 10px;
    width: 22px;
    height: 4px;
    /*background: #8d8d8d;*/
  }
  
  .abltyservicehelper input:focus-visible + label {
    outline: 2px solid rgba(0,102,204,1);
    border-radius: 3px;
  }
  
  .abltyservicehelper .tabset > label:hover,
  .abltyservicehelper .tabset > input:focus + label,
  .abltyservicehelper .tabset > input:checked + label {
    color: #06c;
    background-color: #fff;
  }
  
  .abltyservicehelper .tabset > label:hover::after,
  .abltyservicehelper .tabset > input:focus + label::after,
  .abltyservicehelper .tabset > input:checked + label::after {
    /*background: #06c;*/
  }
  
  .abltyservicehelper .tabset > input:checked + label {
    /*border-color: #ccc;*/
    border-bottom: 1px solid #06c;
    margin-bottom: -1px;
  }
  
  .abltyservicehelper .tab-panel {
    padding: 30px 0;
    border-top: 1px solid #ccc;
  }
  
  
  .abltyservicehelper *,
  .abltyservicehelper *:before,
  .abltyservicehelper *:after {
    box-sizing: border-box;
  }
  
  
  .abltyservicehelper .tabset {
    max-width: 65em;
  }

  .ordrdtlsdataone {

  }

  .ordrdtlsdatatwo {
    margin-top:8px;
  }

  .ordrdtlslblone {
    text-decoration: underline;
  }

  .dtlsservimg {
    display: inline-block;
  }

  .dtlsservimg img {
    max-width: 20px !important;
    max-height: 20px !important;
    display: inline-block;
    }

.dtlsservun {
    display: inline-block;
}

.serv_convo {
    margin-top:-20px;
    border:1px solid #777;
    border-radius:25px; 
}

.serv_messagefield {

}

.serv_messagefield .form-textarea {
    height: 50px;
    /*border-color: transparent;
    resize: none;*/
    box-shadow: 0 0 0 0;
    border: 0px;
    resize: none;
    border-radius: 25px;
}

.modal-backdrop.fade.in {
    z-index: 10;
}


/* tabs end */

.abltyservicehelper {
    /*background: #e7e7e7;*/
    border: 1px solid #d0d0d0;
    border-top: 2px solid #06c;
    /*border-radius: 4px;*/
    padding: 8px;
    height:400px;
    overflow: hidden;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.abltyservicehelperhl {
    font-size: 16px;
    font-weight: 700;
}

.abltyservicehelper hr {
    margin-top: 5px;
    border: 1px solid #d0d0d0;
}

.abltyservicehelpertext .helptext {
    margin-top: 5px;
}

/* Service Inquire Details */
.topabilityheadline img {
    max-width: 50px;
    max-height: 50px;
}
  


/*message field*/

.abilitylistingview {
    background:#fff;
}

.abilitylistingview .limittxt {
    margin-top:0px;
}

.breadcrumbs {
    display:inline-block;
}

input {
 outline:none;
}

.abltybtnwraper {
    /*text-align:right;*/
    
}

.abltyedtbtnwraper {
    text-align:right;
    margin-right:8px;
    font-weight:600;
    
}

.abltymsg .btn-default {
    border: 0 solid;
    background:#fff;
    color: #777;
    /*font-size:18px;*/
}

.abltymsgbtn {
    /*text-align: right;
    display:inline-block;
    margin-top:-20px;*/
    float:right;
}

.abltymsgbtnpost {
    display:inline-block;
}

.abltymsgbtn .btn-default {
    color: #2f4050;
    background-color: transparent;
    border-color: transparent;
    display: inline-block;
    border: 1px solid;
    border-radius: 50px;
}

.abltymsgbtnglyph {
    color: #2f4050;
    background-color: transparent;
    border-color: transparent;
    display: inline-block;
    border: 1px solid;
    border-radius: 50px;
    padding: 6px 12px;
    margin-bottom: 5px;
    cursor: pointer;
}

.abilitylistingviewfile {
    z-index: 20;
}

/*****************************/
/**** Modals ****/
/***************************/

/*** Modal buttons ***/
.modal-header.ui-dialog-titlebar {
    /*border-bottom:1px solid #ccc;*/
}

.moticon {
    float:right;
    color: #ccc;
    font-size: 16px;
    margin-top: 8px;
    cursor: pointer !important;
}

/* Modal Design for Hours */
.abltylabel {
    margin-top:8px;
}

.cstlbl {
    padding-left:8px;
}

.smtxt {
    color:#777;
    margin-top:5px;
    font-size:12px;
}

/* Modal for Ability Service Confirmation */

.abltconfbtn {
    border-radius:4px;
    color:#fff;
    background: #0071bc;
    cursor:pointer;
    text-align:center;
}

/*.abltconfbtn .btn-default:active,
.abltconfbtn .btn-default:focus,
.abltconfbtn .btn-default.focus {
    background-image: url("/sites/default/files/sitefiles/cogloader.gif");
    background-repeat: no-repeat !important;
    background-size: 80% !important;
    background-position: center !important;
    background-color: transparent;
    color:transparent;
}*/

.abltconfbtn .btn-default:active,
.abltconfbtn .btn-default:focus {
    background-image: url("/sites/default/files/sitefiles/loading.gif");
    background-repeat: no-repeat;
    background-size: 75px;
    background-position: center;
    background-color: transparent;
    color:transparent;
}

/* End Modal for Ability Service Confirmation */

/* Modal Design for Payment */

#mypmod .active a.nav-link,
#mypmod .active a.nav-link:hover{
    color:#F39C12!important;
    text-decoration: none;
    background: #fff;
    /*border-left: 0px solid #F39C12;*/
}

#mypmod .active,
#mypmod .active:hover{
    color:#000;
    text-decoration: none;
    background: #fff;
    border-left: 0px solid #F39C12;
}

#mypmod .nav-tabs > li > a {
    /*border: 1px solid red;*/
}

#mypmod nav-tabs > li {
    
}

#mypmod .modallabel {
    text-align: center;
}

#mypmod .amtd {
    color:#000;
    font-weight:600;
}

#mypmod a.nav-link {
    color: #000;
}

.ccfrmfld {
    color:#000;
}

.straccttxt {
    color: #000;
    padding: 10px;
    border: 1px solid #000;
    border-radius: 4px;
}

.mdlacctitemlst {
    color: #000;
}

.jbal {
    font-weight: 300;
    font-size: 24px;
    color: #000;
}

.mdlbdr {
    padding: 10px;
    border: 1px solid #ccc;
}

/*abilitylistingview payment buttons*/
.striperegbtn {
    text-align:center;
}

/*pay with credit card button*/
.striperegbtn .btn-primary:active,
.striperegbtn .btn-primary:focus {
    background-image: url("/sites/default/files/sitefiles/loading.gif");
    background-repeat: no-repeat;
    background-size: 75px;
    background-position: center;
    background-color: transparent;
    color:transparent;
}

/*pay with balance button*/
.striperegbtn .btn-default:active,
.striperegbtn .btn-default:focus {
    background-image: url("/sites/default/files/sitefiles/loading.gif");
    background-repeat: no-repeat;
    background-size: 75px;
    background-position: center;
    background-color: transparent;
    color:transparent;
}

/* End payment modal */

/* Complete modal design */
 
.abilitybtn .btn-primary:active,
.abilitybtn .btn-primary:focus {
    background-image: url("/sites/default/files/sitefiles/loading.gif");
    background-repeat: no-repeat;
    background-size: 75px;
    background-position: center;
    background-color: transparent;
    color:transparent;
}

.abilitybtndsbld {
    text-align:center;
}

/*.abilitybtndsbld .btn[disabled],*/
.abilitybtndsbld .btn[disabled] {
    background-color: red;
    border:1px solid red;
    opacity:1;
}

.abilitybtndsbld .btn[disabled]:active,
.abilitybtndsbld .btn[disabled]:focus {
    background-image: url("/sites/default/files/sitefiles/loading.gif");
    background-repeat: no-repeat;
    background-size: 75px;
    background-position: center;
    background-color: transparent;
    color:transparent;
}

/* End Complete Modal */

/* rating modal design */

.ratewhotxt {
    font-weight:600;
}

.rate {
    float: left;
    height: 46px;
    padding: 0 10px;
    background-color: #fff;
}
.rate:not(:checked) > input {
    position:absolute;
    /*top:-9999px;*/
    opacity:0;
    background-color: #fff;
}
.rate:not(:checked) > label {
    padding: 0 0 0 0;
    margin:3px;
    float: right;
    width:1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:30px;
    color:#ccc;
    background-color: transparent;
    border:0px;
}
.rate:not(:checked) > label:before {
    content: '★ ';
    background-color: #fff;
}

    /*** when checked ***/
.rate > input:checked ~ label {
    color: #F39C12;    
    background-color: #fff;
    border:0px;
}

    /*** when hovering stars ***/
.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
    color: #F39C12;  
    background-color: #fff;
}

    /*** when checked and hovered ***/
.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
    color: #c77f0a;
    background-color: #fff;
    border:0px;
}

.rate > input[type=radio]:checked + label {
    background-color: #fff;
}


/* End rating modal */

/* Star Display Rating */

.stars-container {
  position: relative;
  display: inline-block;
  color: transparent;
}

.stars-container:before {
  position: absolute;
  top: 0;
  left: 0;
  content: '★★★★★';
  color: lightgray;
}

.stars-container:after {
  position: absolute;
  top: 0;
  left: 0;
  content: '★★★★★';
  color: #000;
  overflow: hidden;
}

.stars-0:after { width: 0%; } /* 0 star */
.stars-5:after { width: 5%; } /* .25 star */
.stars-10:after { width: 10%; } /* .50 star */
.stars-15:after { width: 15%; } /* .75 star */
.stars-20:after { width: 20%; } /* 1 star */
.stars-25:after { width: 25%; } /* 1.25 star */
.stars-30:after { width: 30%; } /* 1.50 star */
.stars-35:after { width: 35%; } /* 1.75 star */
.stars-40:after { width: 40%; } /* 2 star */
.stars-45:after { width: 45%; } /* 2.25 star */
.stars-50:after { width: 50%; } /* 2.5 star */
.stars-55:after { width: 55%; } /* 2.75 star */
.stars-60:after { width: 60%; } /* 3 star */
.stars-65:after { width: 65%; } /* 3.25 star */
.stars-70:after { width: 70%; } /* 3.50 star */
.stars-75:after { width: 75%; } /* 3.75 star */
.stars-80:after { width: 80%; } /* 4 star */
.stars-85:after { width: 85%; } /* 4.25 star */
.stars-90:after { width: 90%; } /* 4.50 star */
.stars-95:after { width: 95%; }  /* 4.25 star */
.stars-100:after { width: 100; } /* 5 star */

.ttlrsts {
    display:inline-block;
    color: #777;
}

/* End Display Rating */

/*.path-abilityaction .abltysidedtls .col-xs-8 {
    padding-left: 0px;
}*/

.abltydtlsprofdn {
    font-size:16px;
    font-weight:600;
    /*margin-bottom: 5px;
    width: 78%;
    display:inline-block;*/
}

.abltydtlsslrloc {
    font-size:12px;
    margin-top: 5px;
}

.profileimgad {
    position: relative;
    width: 40px;
    height: 40px;
    overflow: hidden;
    border-radius: 50%;
    box-shadow: 5px 5px 5px #e7e7e7;
    /*margin-top: 5px;
    float: right;
    margin-right: 5px;
    display: inline-block;*/
}

.profileimgad img {
    width: auto;
    height: 100%;
}

.abltyheading {
   /* font-size: 20px;
    font-weight: 600;*/
    padding:10px;
    /*border: 1px solid #e7e7e7;
    border-radius: 4px;*/
}

.abltyheadingsuby {

}

.abltyfldlbl {
    font-weight: 600;
    font-size: 18px;
}

.abltycost {
    color: #e44724;
    font-weight: 600;
    font-size: 24px;    
}

/*.abltycostmbl {

}*/

/*.abltycosttxtmbl {
    color: #e44724;
    font-weight: 600;
    font-size: 18px;
    text-align:center;
    display: inline-block;
}*/

/*.abltycosttxtlblmbl {
    display: inline-block;
}*/


.abltydtlslnk {
    float:right;
    font-size: 12px;
    color: #337ab7;
    font-weight:500;
}

.abltybtnvm {
    cursor: pointer;
    /*border: 1px solid #777;
    border-radius: 4px;
    margin-right: 5px;
    padding: 7px;
    display:inline-block;
    float: right;*/
    color:#000;
    float: right;
    font-weight:600;
}

.origabltycost {
    display: inline-block;
    font-size: 22px;
    color: #e44724;
    font-weight: 600;
}

.origabltycosttype {
    display: inline-block;
    color: #777;
}

.albtytitleent {
    font-size: 18px;
    font-weight: 600;
}

.abltydtlslbl {
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 8px;
    /*display:inline-block;*/
    color:#777;
}

.abltydtlslblalt {
    font-size: 14px;
    font-weight: 700;
}

.abltydtlslocd {
    /*display:inline-block;*/
}

.smallhr {
    margin-top:20px;
}

.smallhr hr {
    width:90%;
}

.abltydtlscol {
    /*background:#e7e7e7;
    padding-top:5px;
    padding-bottom:5px;*/
    /*color: rgba(255, 255, 255, 0.8);*/
    color: #000 !important;
    font-weight: 700;
    border-radius:10px;
    padding-top:10px;
    padding-bottom:10px;
    padding-left:5px;
}

.abltydtlscol:hover {
    background:#e7e7e7;
    color: #000 !important;
    text-decoration: none;
    font-weight: 700;
    
}

a.abltyimgitem {
    font-size:14px;
}

.abltydtlsprofau {
    font-size:12px;
}

/* Start File Upload Modal */

.abilitybtnmdl {
    float:right;
}

.abilitybtnmdl .btn-primary:active,
.abilitybtnmdl .btn-primary:focus {
    background-image: url("/sites/default/files/sitefiles/loading.gif");
    background-repeat: no-repeat;
    background-size: 75px;
    background-position: center;
    background-color: transparent;
    color:transparent;
}

#abltyfilelink .glyphicon-file,
#abltyfilelinkmbl .glyphicon-file {
    color: #337ab7; 
}

/* End File Upload Modal */

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 10;
  top: 0;
  right: 0;
  background-color: #FFF;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
  /*padding-left: 5px;
  padding-right: 5px;*/
  border-left:1px solid #e7e7e7;
}

.sidenavdtls {
  padding-left: 5px;
  padding-right: 5px;
}

/*.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidenav a:hover {
  color: #f1f1f1;
}*/

.sidenav .closebtn {
  /*position: absolute;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
  color: #818181;*/
    font-size: 22px;
    margin-right: 10px;
    color: #d0d0d0;
    float: right;
}

.abltysidedtlsmbl .glyphicon-option-vertical {
    /*font-size: 24px;*/
}

/*.mblelip {

}*/

/*** Ability Modal Profile Image ***/

/*landscape*/
.abltyinqlmmpp {
   /*float: right;
   margin-left: -20px;
   position: relative;
   box-shadow: 5px 5px 5px #e7e7e7;*/
   display: inline-block;
   width: 75px;
   height: 75px;
   overflow: hidden;
   border-radius: 50%; 
   /*margin-top:7px;*/
}

.abltyinqlmmpp img {
    width: auto;
    height: 100%;
}

/*Portrait*/
.abltyinqpmmpp {
  /*box-shadow: 5px 5px 5px #e7e7e7;
  position: relative;
  margin-left: -20px;*/
  float: left;
  width: 75px;
  height: 75px;
  overflow: hidden;
  border-radius: 50%;
  /*margin-top:7px;*/
  
}

.abltyinqpmmpp img {
  width: 100%;
  height: auto;
}

/*Square*/
.abltyinqsmmpp img {
  width: 75px;
  height: 75px;
  border-radius: 50%;
  background: #e7e7e7;
  padding: 3px;
  /*margin-top:7px;*/
}

/*default glpyhicon due to no image uploaded*/
.abltyinqgmmpp {
    font-size:30px;
    color:#000;
}
.abltyinqgmmpp a,
.abltyinqgmmpp a:hover {
    font-size:30px;
    color:#fff;
    text-decoration: none;
}


.abltyinqmdlimg {
    text-align:center;
    color:#777;
}

.abltyconftxt .glyphicon-ok {
    color:green;
}

.abltyconferrtxt {
    color:red;
}

.abltyconftxtsub {
    color:#777;
    margin-top:10px;
}

.abltycnclbtn {
    border:1px solid #0071bc;
    padding: 6px 12px;
    text-align: center;
    border-radius: 4px;
    color:#0071bc;
    cursor:pointer;
}

.abltycnclbtn a,
.abltycnclbtn a:hover {
    padding: 6px 12px;
    text-align: center;
    color:#0071bc;
    cursor:pointer;
}

.abltylgnbtn {
    border:1px solid #0071bc;
    padding: 6px 12px;
    text-align: center;
    border-radius: 4px;
    background:#0071bc;
    color:#fff;
    cursor:pointer;
    font-weight: 600;
}

.abltylgnbtn a,
.abltylgnbtn a:hover {
    padding: 6px 12px;
    text-align: center;
    background:#0071bc;
    color:#fff;
    cursor:pointer;
    font-weight: 600;
}

.abltysubtn {
    border:1px solid #F39C12;
    padding: 6px 12px;
    text-align: center;
    border-radius: 4px;
    background:#F39C12;
    color:#fff;
    cursor:pointer;
    font-weight: 600;
}

.abltysubtn a,
.abltysubtn a:hover {
    padding: 6px 12px;
    text-align: center;
    background:#F39C12;
    color:#fff;
    cursor:pointer;
    font-weight: 600;
}

 @media screen and (max-height: 450px) {
            .sidenav {padding-top: 15px;}
            .sidenav a {font-size: 18px;}
          }


/*** main display ***/
/*** added 3/25/25 - 3/26/25 ***/
.abltysrvimger {
    display: inline-block;
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    /*margin-top: 8px;
    margin-left: 8px;*/
    margin-right: 8px;
    vertical-align: top;
}

.abltysrvimger img {
    width: auto;
    height: 100%;
    max-width: inherit;
    max-height: inherit;
}

.abltysrvhly {
    display: inline-block;
    width:85%;
}




/**************************/
/**** Mobile Settings ****/
/************************/

@media (min-width: 1200px) {


}
    
@media (min-width: 992px) {
        
        #block-abilityaction-titlebar {
            border-right: 1px solid #e7e7e7;
        }
        
        /*message history*/
        .view-ability-message-history {
            overflow-x: hidden;
            overflow-y: auto;
            height: 550px;
            border-right: 1px solid #e7e7e7;
        }
        
        .path-abilityaction .region-content {
            /*margin-left:0px;*/
        }

    }


@media (max-width: 991px) {
        .path-abilityaction .col-sm-6 {
            width: 45%;
        }
        
        .path-abilityaction .col-sm-6 .region-content {
            margin-left:-175px;
        }
        
        /*.path-abilityaction .col-sm-3 {
           width: 25%;
        }*/

        .path-abilityaction .col-sm-9 {
            width:100%;
        }
        
        .abltysidedtls {
            width:120%;
        }
        
        .abltysidedtls .col-xs-8,
        .abltysidedtls .col-xs-4 {
            margin-left:0px;
            padding-left:0px;
            padding-right:0px;
        }
        
        .abltysidedtls .ttlrsts {
            display:none;
        }
       
}

@media (min-width: 768px) {

        /*.mblelip {
            display:none;
        }*/

        .abltysidedtlsmbl {
            display:none;
        }
        
        /*.abltyheadingMBL {
            display:none;
        }*/
        
        /*.abltyheadingdnMBL {
            display:none;
        }*/
        
        /*.abltyheadingrtMBL {
            display:none;
        }*/
        
        /*.abltybtnMBL {
            display:none;
        }*/
        
        .abltybtn {
            width:95%;
            display:inline-block;
            font-weight:600;
            font-size: 16px;
        }
        
        .pendspbtn {
            background: #fff;
            padding: 7px;
            border-radius: 3px;
            color: #000;
            font-weight: 700;
            text-align: center;
            border: 1px solid;
            cursor: pointer !important;
        }

        .actdspbtn {
            background: #fff;
            padding: 7px;
            border-radius: 3px;
            color: #F39C12;
            font-weight: 500;
            text-align: center;
            border: 1px solid #F39C12;
            cursor: pointer !important;
        }
        
        /*.abltycostmbl {
            display:none;
        }*/
        
        /*message history*/
        .view-ability-message-history {
            overflow-x: hidden;
            overflow-y: auto;
            height: 550px;
            border-right: 1px solid #e7e7e7;
        }

        .abltyheadingmbl {
            display:none;
        }

        .servwf {
            width:100%;
            font-size: 12px;
        }

} 

@media (max-width: 767px) {
    
    .path-abilityaction .spacerone {
        display:none;
    }
    
    .topabilityheadline {
        position: -webkit-sticky;
        position: sticky;
        top: 0px;
        /*background-color: white;*/
        z-index: 10;
        border-bottom:1px solid #e7e7e7;
    }
        
        .path-abilityaction .col-sm-6 {
            width: 50%;
        }
        
        .path-abilityaction .col-sm-6 .region-content {
            margin-left:0px;
        }

        .abltysidedtls {
            display:none;
        }
        
        .sidenav {
            /*padding-left:8px;*/
        }
        
        .abltyheading {
            display:none;
        }
        
        .abltybtnvm {
            display:none;
        }
        
        .abltybtn {
            display:none;
        }
        
        .abltylistdtlsmn .abltybtnwraper {
            display:none;
        }
        
        /*.abltyheadingdnMBL {
            font-size: 14px;
            font-weight: 600;
        }*/
        
        /*.abltyheadingrtMBL {
            border-bottom:1px solid #e7e7e7;
            margin-bottom: 10px;
        }*/
        
        /*.abltyheadingMBL {
            font-size: 16px;
            font-weight: 600;
        }*/
        
        /*.abltybtnMBL {
            display:inline-block;
        }*/
        
        /*.mblelip {
            display:inline-block;
        }*/
        
        .pendspbtn {
            background: #fff;
            padding: 5px;
            border-radius: 3px;
            color: #000;
            font-weight: 500;
            text-align: center;
            border: 1px solid;
            cursor: pointer !important;
            /*width: 50%;*/
            font-size: 12px;
        }

        .actdspbtn {
            background: #fff;
            padding: 5px;
            border-radius: 3px;
            color: #F39C12;
            font-weight: 500;
            text-align: center;
            border: 1px solid #F39C12;
            cursor: pointer !important;
            /*width: 50%;*/
            font-size: 12px;
        }
        
        /*.abltybtnMBLvm {
            background: #fff;
            padding: 5px;
            border-radius: 3px;
            color: #000;
            font-weight: 500;
            text-align: center;
            border: 1px solid;
            cursor: pointer !important;
            font-size: 12px;
        }*/
        
        .abilitybreadcrumbs {
            /*display:none;*/
        }
        
        /*.abltycosttxtmbl {
            color: #e44724;
            font-weight: 500;
            font-size: 14px;
            text-align:center;
            display: inline-block;
        }*/
        
        .topabilityheadline .spacebar {
            margin-top:5px;
        }

        .servwf {
            /*width:100%;*/
            font-size: 12px;
            margin-left: 5% !important;
        }

    }

@media (max-width: 500px) {

    .profileimg {
        display: inline-block;
        position: relative;
        width: 20px;
        height: 20px;
        overflow: hidden;
        border-radius: 50%;
        box-shadow: 5px 5px 5px #e7e7e7;
        margin-top: 5px;
    }

 }