.allAppCol{
    border-radius: 5px;
}
.app-articles{
    margin-top: 22px;
}

.app-items img.favimage1 {
    width: 70px !important;
    height: 70px;
    display: inline-table !important;
}

.app-items .top-right {
    display: block;
    position: absolute;
    right:5px;
    top: 5px;
    display: flex;
}

.app-items .top-right span {
    height: 21px;
    width: 21px;
    display: block;
    /* margin: 7px; */
}

.app-items .fav-like-btn {
    background-size: 80%;
    /* margin-right: 2px !important; */
}

.app-items .fav-favorite-btn {
    padding-top: 4px;
    margin-left: 2px !important;
}

.app-items .my-fav-card-body {
    text-align: center;
    position: relative;
    padding: 7px;
}

.app-items h5 {
    font-size: 1.1rem;
    font-weight: 900;
    margin-bottom: 0px;
    font-family: inherit !important
}

.app-items .tag {
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 600;
}

.app-items .image-placeholder {
    width: 100%;
    text-align: center;
    display: block;
    margin-top: 20%;
}

.app-items .status {
    color: var(--base-primary);
    position: absolute;
    top: 10px;
    font-size: 0.8rem;
    text-transform: capitalize;
    border: 1px solid #ccc;
    display: table;
    padding: 1px 7px 1px 7px;
    border-radius: 27px;
    font-weight: 600;
    background-color: #fff;
}

.app-items .pendingStatus {
    color: var(--bs-yellow);
}

.app-items .reject {
    color: var(--base-primary-2);
}

.app-items .approvedStatus {
    color: var(--bs-green);
}

.app-overlay {
    padding: 10%;
    border-radius: var(--bs-card-border-radius);
}

.app-overlay button {
    width: 83%;
    display: flex;
    cursor: pointer;
}


.app-overlay .access {
    background-color: var(--base-primary-2);
    margin-bottom: 11px;
}

.app-overlay .view-detals {
    background-color: var(--base-white) !important;
    color: var(--base-black) !important;
    display: flex;
    width: 83%;

}

.app-overlay button span {
    height: 20px;
    width: 16px;
    display: block;
    background-size: 100%;
    margin-right: 10px;
    position: relative;
    top: -3px;
    left: 4px !important;
}

.app-overlay a span {
    height: 20px;
    width: 16px;
    display: block;
    background-size: 100%;
    margin-right: 10px;
    position: relative;
    top: -3px;
}

.app-items :hover .app-overlay {
    display: block;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}

#app-container .col-sm-3 {
    width: 20% !important;
    padding-right: 0px !important;

}


.app-items .bi-hand-thumbs-up-fill,
.app-items .bi-hand-thumbs-up {
    font-size: 1.2rem;
}

.section-header_action a {
    text-decoration: underline !important;
    font-weight: 700;
    color: #FD9606 !important;
    letter-spacing: 0.5px;
}



.app-items {
    margin: 5px;
    cursor: pointer;
    border-radius: 8px;
}

._card.app-items .card-body{
    border: 2px solid #ffffff00;
}

/*********procurement****************/
._card.app-items.procurement{
    --base-color: #ff8039;
}

._card.app-items.procurement .card-body {
    background-image: url(./procurement.svg);
    background-position: -2px 101.5%;
    background-size: 102%;
    background-repeat: no-repeat;
}
.app-items.procurement .card-body:hover,
.app-items.procurement .card-body:active {
 border: 2px solid #ff8039 !important;;
}


.card._card.app-items.procurement .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
.card._card.app-items.procurement .card-body .top-right span,
.card._card.app-items.procurement .card-body .top-right .fav-like-btn i,
.card._card.app-items.procurement .card-body .top-right .fav-fill,
.card._card.app-items.procurement .card-body .top-right #favourite-icon
{
    color:  var(--base-color) !important;
}


.card._card.app-items.procurement .app-overlay .access{

    background-color: #ff8039!important;
}

.card._card.app-items.procurement .app-overlay .clickMeBtn{

    background-color: #ff8039 !important;
   }

/* .card._card.app-items.procurement img{
    filter: brightness(0) saturate(100%) invert(77%) sepia(56%) saturate(5992%) hue-rotate(151deg) brightness(100%) contrast(101%);

} */



/*********HQ****************/
._card.app-items.hq{
    --base-color: #35d8d0;
}

._card.app-items.hq .card-body {
    background-image: url(./hq.svg);
    background-position:-2px 101.5%;
    background-size: 102%;
    background-repeat: no-repeat;
}
.app-items.hq .card-body:hover,
.app-items.hq .card-body:active {
 border: 2px solid #35d8d0 !important;;
}


.card._card.app-items.hq .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
.card._card.app-items.hq .card-body .top-right span,
.card._card.app-items.hq .card-body .top-right .fav-like-btn i,
.card._card.app-items.hq .card-body .top-right .fav-fill,
.card._card.app-items.hq .card-body .top-right #favourite-icon
{
    color: #35d8d0 !important;
}

.card._card.app-items.hq .app-overlay .access{

    background-color: #35d8d0!important;
}

.card._card.app-items.hq .app-overlay .clickMeBtn{

    background-color: #35d8d0!important;
}

/* .card._card.app-items.procurement img{
    filter: brightness(0) saturate(100%) invert(91%) sepia(91%) saturate(3404%) hue-rotate(133deg) brightness(88%) contrast(90%);

} */

/********FBS***********/
._card.app-items.fbs{
    --base-color: #f43228;
}

._card.app-items.fbs .card-body {
    background-image: url(./fbs.svg);
    background-position:-2px 101.5%;
    background-size: 102%;
    background-repeat: no-repeat;
}
.app-items.fbs .card-body:hover,
.app-items.fbs .card-body:active {
 border: 2px solid #f43228 !important;;
}


.card._card.app-items.fbs .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
.card._card.app-items.fbs .card-body .top-right span,
.card._card.app-items.fbs .card-body .top-right .fav-like-btn i,
.card._card.app-items.fbs .card-body .top-right .fav-fill,
.card._card.app-items.fbs .card-body .top-right #favourite-icon
{
    color: #f43228 !important;
}


.card._card.app-items.fbs .app-overlay .access{

    background-color: #f43228!important;
}

.card._card.app-items.fbs .app-overlay .clickMeBtn{

    background-color: #f43228!important;
}

/* .card._card.app-items.procurement img{
    filter: brightness(0) saturate(100%) invert(22%) sepia(68%) saturate(3206%) hue-rotate(349deg) brightness(108%) contrast(92%);
} */

/******Hrs*/
.app-items.hrs {
    --base-color: #eaad00;
}


._card.app-items.hrs .card-body {
    background-image: url(./hrs.svg);
    background-position: -2px 101.5%;
    background-size: 102%;
    background-repeat: no-repeat;
}
.app-items.hrs .card-body:hover,
.app-items.hrs .card-body:active {
 border: 2px solid #eaad00 !important;;
}


.card._card.app-items.hrs .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
.card._card.app-items.hrs .card-body .top-right span,
.card._card.app-items.hrs .card-body .top-right .fav-like-btn i,
.card._card.app-items.hrs .card-body .top-right .fav-fill,
.card._card.app-items.hrs .card-body .top-right #favourite-icon
{
    color: #eaad00 !important;
}

.card._card.app-items.hrs .app-overlay .access{

    background-color: #eaad00!important;
}

.card._card.app-items.hrs .app-overlay .clickMeBtn{

    background-color: #eaad00!important;
}

/* .card._card.app-items.hrs img{
    
    filter: brightness(0) saturate(100%) invert(66%) sepia(76%) saturate(1917%) hue-rotate(7deg) brightness(99%) contrast(101%);
} */

/******CCC*/
.app-items.ccc {
  --base-color: #47c651;
}


._card.app-items.ccc .card-body {
    background-image: url("data:image/svg+xml,%3Csvg width='288' height='129' viewBox='0 0 288 129' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.08' d='M288 22.8505V121.835C288 125.8 284.788 129.009 280.818 129.009H7.18154C3.21231 129.009 0 125.8 0 121.835V0.71875C0 0.71875 110.197 71.7984 288 22.8505Z' fill='%2347C651'/%3E%3C/svg%3E");
    background-position: -2px 101.5%;
    background-size: 102%;
    background-repeat: no-repeat;
}
.app-items.ccc .card-body:hover,
.app-items.ccc .card-body:active {
 border: 2px solid var(--base-color) !important;;
}


.card._card.app-items.ccc .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
.card._card.app-items.ccc .card-body .top-right span,
.card._card.app-items.ccc .card-body .top-right .fav-like-btn i,
.card._card.app-items.ccc .card-body .top-right .fav-fill,
.card._card.app-items.ccc .card-body .top-right #favourite-icon
{
    color: #47c651 !important;
}

.card._card.app-items.ccc .app-overlay .access{
    background-color: var(--base-color) !important;
}

.card._card.app-items.ccc .app-overlay .clickMeBtn{

    background-color: var(--base-color) !important;
}

/*********naou****************/
._card.app-items.naou{
    --base-color: rgba(180, 102, 180, 1);
}

._card.app-items.naou .card-body {
    background-image: url(./naou.svg);
    background-position:-2px 101.5%;
    background-size: 102%;
    background-repeat: no-repeat;
}
.app-items.naou .card-body:hover,
.app-items.naou .card-body:active {
 border: 2px solid rgba(180, 102, 180, 1) !important;;
}


.card._card.app-items.naou .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
.card._card.app-items.naou .card-body .top-right span,
.card._card.app-items.naou .card-body .top-right .fav-like-btn i,
.card._card.app-items.naou .card-body .top-right .fav-fill,
.card._card.app-items.naou .card-body .top-right #favourite-icon
{
    color: rgba(180, 102, 180, 1) !important;
}

.card._card.app-items.naou .app-overlay .access{

    background-color: rgba(180, 102, 180, 1) !important;
}

.card._card.app-items.naou .app-overlay .clickMeBtn{

    background-color: rgba(180, 102, 180, 1) !important;
}

/* .card._card.app-items.naou img{
    filter: brightness(0) saturate(100%) invert(91%) sepia(91%) saturate(3404%) hue-rotate(133deg) brightness(88%) contrast(90%);

} */

/*********cona****************/
._card.app-items.cona{
    --base-color: #1e90ff;
}

._card.app-items.cona .card-body {
    background-image: url(./cona.svg);
    background-position:-2px 101.5%;
    background-size: 102%;
    background-repeat: no-repeat;
}

.app-items.cona .card-body:hover,
.app-items.cona .card-body:active {
 border: 2px solid #1e90ff !important;;
}


.card._card.app-items.cona .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
.card._card.app-items.cona .card-body .top-right span,
.card._card.app-items.cona .card-body .top-right .fav-like-btn i,
.card._card.app-items.cona .card-body .top-right .fav-fill,
.card._card.app-items.cona .card-body .top-right #favourite-icon
{
    color: #1e90ff !important;
}

.card._card.app-items.cona .app-overlay .access{

    background-color: #1e90ff!important;
}

.card._card.app-items.cona .app-overlay .clickMeBtn{

    background-color: #1e90ff!important;
}

/* .card._card.app-items.cona img{
    filter: brightness(0) saturate(100%) invert(91%) sepia(91%) saturate(3404%) hue-rotate(133deg) brightness(88%) contrast(90%);

} */

/******CBS*/
.app-items.cbs {
    --base-color: #00bedd;
  }
  
  
  ._card.app-items.cbs .card-body {
      background-image: url("data:image/svg+xml,%3Csvg width='288' height='129' viewBox='0 0 288 129' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.08' d='M288 22.8505V121.835C288 125.8 284.788 129.009 280.818 129.009H7.18154C3.21231 129.009 0 125.8 0 121.835V0.71875C0 0.71875 110.197 71.7984 288 22.8505Z' fill='%2300BEDD'/%3E%3C/svg%3E");
      background-position: -2px 101.5%;
      background-size: 102%;
      background-repeat: no-repeat;
  }
  
  .app-items.cbs .card-body:hover,
  .app-items.cbs .card-body:active {
   border: 2px solid var(--base-color) !important;;
  }
  
  
  .card._card.app-items.cbs .card-body .top-right .fav-like-btn .bi-hand-thumbs-up-fill,
  .card._card.app-items.cbs .card-body .top-right span,
  .card._card.app-items.cbs .card-body .top-right .fav-like-btn i,
  .card._card.app-items.cbs .card-body .top-right .fav-fill,
  .card._card.app-items.cbs .card-body .top-right #favourite-icon
  {
      color: #00bedd !important;
  }
  
  .card._card.app-items.cbs .app-overlay .access{
      background-color: var(--base-color) !important;
  }

  .card._card.app-items.cbs .app-overlay .clickMeBtn{

    background-color: var(--base-color) !important;
   }



.app-title-area{
    position: absolute;
    bottom: 7px;
    left: 0;
    right: 0;
    padding: 0px 10px 0px 10px;
}


/* media-queries

@media only screen and (min-width: 321px) and (max-width: 450px) {
    .app-items .fav-like-btn {
        margin-right: 2px !important;
    }
    
    .app-items .fav-favorite-btn {
        padding-top: 4px;
        margin-left: 2px !important;
    }

} */

.applogoPublishedApp.favimage1:not([src]),
.applogoPublishedApp.app-logo:not([src]),
.applogoPublishedApp.favimage1[src=""],
.applogoPublishedApp.app-logo[src=""] {
  /* background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><circle cx='100' cy='100' r='50' fill='var(--base-color)'/></svg>"); */
  /* background-size: contain; */
  /* background-repeat: no-repeat; */
  display: inline-block !important;
  width: 80px !important;
  height: 80px !important;
  background-position-y: -50px;
  color: transparent;
  position: relative;
  border-radius: 100%;
  background-color: var(--base-color);
}

/* .applogoPublishedApp:not([src])::before,
.applogoPublishedApp[src=""]::before {
    content: '';
    width: 50px;
    height: 50px;
    background-color: #fff;
    border-radius: 10px;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-50%);
} */

.applogoPublishedApp:not([src])::after,
.applogoPublishedApp[src=""]::after {
    content: attr(data-alt); /* Extract text from data-alt */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px;
    font-weight: normal;
    color: white;
    padding: 5px 10px;
    white-space: nowrap;
}

.webchat__keyboard-help__section > header {
    display: none;
}

.pva-privacy-message {
    font-size: 5px !important;
}

body .pva-privacy-message p {
    display: none;
}

.red-link {
    color: var(--base-primary) !important;
}

.select2-dropdown--below {
    background: #fff !important;
}

.sm-dropdown-btn{
    background-color:transparent;
    border: none !important;
    color: #706a6a;
}
.sm-dropdown > button{
     background-color:transparent;
    border:none 
}

/* .sm-dropdown .sm-dropdown-menu{
    width: 115px !important;
    border-radius:0px;
    min-width: 5\1150px;
    background-color:#fff;
    border: 1px solid #ccc;
}

.app-items.fbs .card-body:hover .sm-dropdown-btn{
    color: #706a6a;  
} */
/* .sm-dropdown .dropdown-menu.sm-dropdown-menu.show{
    transform: translate(-7px, 10px) !important;
    
} */

/* .app-items .sm-dropdown .fav-like-btn{
    position: relative;
    left: 3px;
} */

.app-dropdown{
    padding:0px 5px!important;
}
.app-dropdown li,.app-dropdown li a,.app-dropdown li button{
    display:flex !important ;
    width:100% !important;
    background-color:transparent !important;
    color:#000 ;
    font-family: "Arimo", sans-serif !important;
    font-weight: 400 !important;
    font-size:14px;
    cursor:pointer;
    text-decoration:none !important;
    
}
.app-dropdown li a,.app-dropdown li button{
    padding:0px!important;
    display:flex !important;
}
.app-dropdown li{
    margin:7px 0px;
}
.app-dropdown li .edit ,.app-dropdown li .view, .app-dropdown li span{
    position:inherit !important;
    margin-right:5px;
}

.app-dropdown li:hover,.app-dropdown li a:hover,.app-dropdown li button:hover{
    color: #7a8085 !important;
    text-decoration:none !important;
}