@font-face{
    font-family: fastorder;
    src : url('/api/public/font/AvenirLTStd-Roman.otf');
}
*{font-family: fastorder; }
body{
    background-color: #ededed!important;font-family: fastorder!important;
}
.main-container-in-bookmark{width: 100%!important;    margin: 2rem auto!important;}
.Capuchino-list .Capuchino-product .media .media-body h4{ margin-top: 0px!important;margin-bottom: 0px!important }
.Capuchino-list .Capuchino-product .media .media-body p{ font-size: .9rem;margin-bottom: 0px!important;color: grey;}
.Capuchino-list .Capuchino-product .media .media-body h3{ margin-bottom: 5px!important;font-size: 20px!important; }
#bookmark_store_details_modal .product-i-mage {
    padding: 3px 3px;
    background-color: #ffff;
    border-radius: 10%;
    box-shadow: 0px 1px 3px 0px #0000004f;
    height: 52px;
    width: 51px;
}
#arrow-cap-modify .product-i-mage {
    padding: 3px 11px;
    background-color: #ffff;
    border-radius: 10%;
    box-shadow: 0px 1px 3px 0px #0000004f;
    height: 52px;
    width: 51px;
}

.owl-next {
    left: 96%!important;
    top: 50%;
    transform: translate(0%, -50%)!important;
    background: dimgrey!important;
}

.more-btn{text-align: center!important;}


/*popup css*/

#arrow-cap .modal-header .col-md-12{    padding: 0px!important;}
#arrow-cap .modal-content .close{margin: 0px!important;padding:0px!important;}
#arrow-cap .product-i-mage{padding: 0px 0px;
                           background-color: #ffff;
                           border-radius: 10%;
                           box-shadow: 0px 1px 3px 0px #0000004f}
                           #arrow-cap .product-i-mage img{width:70px;
    height: 70px;
    object-fit: contain;
    padding: 5px;}
#arrow-cap .modal-header{    padding: 10px 25px;
                         background: #fff;background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px #00000029;
opacity: 1;}
.arrow-click-cap {background-color: #f5f5f5;border-radius: 10px;}
.arrow-click-cap ul li{padding:10px 0px;border-bottom: 1px solid lightgray;}

.spacer-c-1-1{height: 10px;}
.arrow-click-cap ul li:last-child{border-bottom: none!important;}
#arrow-cap .modal-body{height: auto;
    overflow-y: auto;}
.grey-bg-header .media-left{    margin: auto;}
.grey-bg-header .media-body h5{font-size: 16px;}
.grey-bg-header .media-body p{font-size: 12px;
                              margin-bottom: 0rem!important;    letter-spacing: 0.33px;
    color: #686868;}

#arrow-cap .modal-content{border-radius: 15px 15px 5px 5px!important;}
#arrow-cap-modify .modal-content{border-radius: 15px 15px 0px 0px!important;}
#arrow-cap-modify .modal-header {
    padding: 10px !important;
    background: whitesmoke;
}
#arrow-cap-modify .modal-header .col-md-12
{padding: 0px!important;}

#arrow-cap-modify .product-i-mage {
    padding: 3px 11px;
    background-color: #ffff;
    border-radius: 10%;
    box-shadow: 0px 1px 3px 0px #0000004f; height: 52px;  width: 51px;
}
#arrow-cap-modify .modal-content .close {
    margin: 0px!important;
    padding: 0px!important;
}
.store-details-mody{    text-align: center;}
.store-details-mody p{margin-bottom: 0px!important}
.text-light-grey{color: #686868}
.store-md-Q-p{padding:0px;margin: 0px;}
.store-md-Q-p li{float: left;padding-right: 10px}
.Modify-quantity select{    padding: 5px 15px;
                            border: 1px solid lightgrey;
                            border-radius: 5p}
.Modify-me li{margin: 0px;padding: 0px;float: left;}
.blue-bg-light{background-color: #22A7DE19;padding: 10px 0px}
.Modify-blue-list{margin: 0px;padding: 0px}
.lk li{padding: 10px 0px;border-bottom: 1px solid lightgrey;    font-size: 14px;}
.tttt{    height: 100%;
          overflow-y: auto;overflow-x: hidden;}
.tttt .modal-footer{border-bottom: 1px solid lightgrey;}
#Me-friends .card-body{height: auto!important;}
#Me-friends .card-body:hover{box-shadow: none!important;}
#Me-friends .card-body{box-shadow: none;}
#arrow-cap-modify{    overflow-y: hidden;padding-right: 0px!important;}
/*popup css close */


/*New bookmark page css*/
.mg-auto{margin: auto;}
section .book-mark-page-main-body{    margin: 2rem 2rem 6rem;}
section .book-mark-page-main-body .bookmark-left-side-item .main-Left-body{
  background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 2px 2px #00000024;
border-radius: 4px;
opacity: 1;
}
section .book-mark-page-main-body .inner-header h1{letter-spacing: 0.49px;
color: #000000;font-size: 18px;font-weight: bolder;margin: 0px}
section .book-mark-page-main-body .inner-header{height: 60px;display: flex;background: #fff;
    align-items: center;box-shadow: 0px 2px 2px #00000024;    position: relative;
    z-index: 1;}
    section .book-mark-page-main-body .left-side-body .nav-tabs .nav-link.active,  section .book-mark-page-main-body .left-side-body .nav-tabs .nav-link{border: none;
    padding: 15px 15px;
    border-bottom: 1px solid #f2f2f2;}
      section .book-mark-page-main-body .left-side-body ul li .media .product-image img{height: 90px;
    width: 90px;
    object-fit: contain;}
        section .book-mark-page-main-body .left-side-body ul li .media .product-image{margin-right: 1rem}
    section .book-mark-page-main-body .left-side-body .nav-tabs .nav-link.active{background: #22A7DE0A}
          section .book-mark-page-main-body .left-side-body ul li .media .details-product h4 {font-size: 16px;letter-spacing: -0.21px;
color: #000000;}
  section .book-mark-page-main-body .left-side-body ul li .media .details-product h1{letter-spacing: -0.12px;
color: #000000;
opacity: 1;font-size: 18px;margin-bottom: 0px}
          section .book-mark-page-main-body .left-side-body  .nav{    display: block!important;    padding-bottom: 4rem;}
                    section .book-mark-page-main-body .left-side-body {padding: 0px!important}
                              section .book-mark-page-main-body .left-side-body ul li .media .more-icon .three-dout{padding: 0px;background: transparent;border: none}
#myTabContent{width: 100%;}
#myTabContent .main-right-side-list .inner-header .media{width: 100%;}

#myTabContent .main-right-side-list{   padding: 0px;background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 2px 2px #00000024;
    border-radius: 4px;}
    .right-side-product-list ul li .media .details .product-details-main-body .name-and-size h4{margin: 0px;    font-size: 16px;}
        .right-side-product-list ul li .media .details .product-details-main-body .name-and-size h4 span{font-size: 10px;    color: grey;}
                .right-side-product-list ul li .media .details .product-details-main-body .short-discription p{    font-size: 12px;
    color: grey;
    margin: 0px;}
        .right-side-product-list ul li .media .details .product-details-main-body .star-review-and-quantity{display: flex;
    align-items: center;
    justify-content: start;font-size: 12px}
      .right-side-product-list ul li .media .details .product-details-main-body .star-review-and-quantity .rateing span img{    width: 22px;
    height: 22px;}
          .right-side-product-list ul li .media .details .product-details-main-body .star-review-and-quantity .rateing a{color: #22A7DE!important}
                    .right-side-product-list ul li .media .details .product-details-main-body  .quantity a{    font-size: 10px;
    font-weight: bolder;}
        .right-side-product-list ul li{border-bottom: 1px solid #f2f2f2;
    padding: 30px 0px;}
              .right-side-product-list ul li .media .details .product-details-main-body .price-detals h1{       margin: 5px 0px; font-size: 20px;    font-weight: 600;}
        .right-side-product-list ul li .media .details .product-details-main-body .price-detals h1 span{    font-size: 18px;
    color: #686868;}
            .right-side-product-list ul li .media .details .product-details-main-body  .Shop-detals .media .shop-image img{    width: 30px;
    height: 30px;
    border-radius: 50%;}
    .right-side-product-list ul li .media .details .product-details-main-body  .Shop-detals .media .shop-title p{margin: 0px;
    font-size: 14px;letter-spacing: 0.16px;    padding-left: 5px;}
      .right-side-product-list ul li .media .details .product-details-main-body {padding: 0px!important}
            .right-side-product-list ul li .media .product-image img{    width: 112px;
    height: 112px;
    object-fit: contain;}

      #arrow-cap-modify .modal-dialog{    margin: 0px 0px 0px auto;
      height: 100%;left: 100%;}

      #arrow-cap .modal-dialog{    margin: 0px 0px 0px auto;
      height: 100%;left: 100%;transition: .5s ease left}

.right-t-l.show .modal-dialog{left: 0px!important}
  #arrow-cap .modal-dialog .modal-content{height: 100%;border-radius: 0px!important;border: none}
  #arrow-cap-modify .modal-dialog .modal-content{height: 100%;border-radius: 0px!important;border: none;overflow-y: hidden;}
    #arrow-cap-modify .modal-dialog .modal-content .modal-body{overflow-y: auto;}
  #arrow-cap .modal-dialog .first-popup-header-details{    display: flex;
    justify-content: center;
    align-items: center;}
      #arrow-cap .modal-dialog  .modal-header .first-popup-header-details .media .media-left img{
        background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 1px 3px #00000033;
border-radius: 4px;width: 40px;height: 40px;object-fit: contain;
      }
        #arrow-cap .modal-dialog  .modal-header .first-popup-header-details .media .media-left {margin-right: 1rem}
        #arrow-cap .modal-dialog  .modal-header .first-popup-header-details .media .media-body h3{margin: 0px;font-size: 18px;letter-spacing: 0.42px;
color: #000000;}
  #arrow-cap {padding-right: 0px!important;overflow-y: hidden!important;}
  .desktop-view-none{display: none;}
  .popup-top-headd .media-body .cap-p-details-p {padding: 0px!important}
  .popup-top-headd .media-body .cap-p-details-p .cap-p-details{       display: flex;
    align-items: center;
    overflow: auto;
    margin: 0px;}
    .popup-top-headd .media-body .cap-p-details-p .cap-p-details .PCS{margin-left: 30px}

        .popup-top-headd .media-body .cap-p-details-p .cap-p-details  li a{color: #22A7DE!important;
    font-size: 14px;
        }
  .popup-top-headd {     margin-bottom: 1.5rem;
    margin-top: 1rem;}
    .arrow-click-cap .col-md-12 ul li span{font-size: 14px;color: #000000}
        .arrow-click-cap .col-md-12 ul li {cursor: pointer;}
        .dta{    display: flex;
    align-items: center;
    justify-content: center;}
    .more-icon{    position: relative;}
        .dta .media .media-body h5 {    font-size: 14px;}
        .delet-bookmark-items{    padding: 15px;
    border: none;
    background: #FFFFFF 0% 0% no-repeat padding-box;
  box-shadow: 1px 3px 6px #0000003d;
      border-radius: 6px;
    position: absolute;
    top: 100%;
    right: 0px;
    transform: translateY(30%);    font-size: 16px;    color: #686868;}
      .delet-bookmark-items:hover{    background: #F6FCFE;}
            .delet-bookmark-items .media-body{margin-right: 8rem}
                    .delet-bookmark-items .media-body h4{margin-bottom: 0px;font-size: 16px;    letter-spacing: 0.52px;
    color: #000000;}
    .delet-bookmark-items{display: none;}
.more-icon.show-delet   .delet-bookmark-items{display: block;}
 .no-padding{padding: 0px!important}
 #friends-select .item{    cursor: pointer;min-height: 70px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;}
     #friends-select .item .shadow-effect{height: 50px;
    width: 50px;
    border: 1px solid #00000033;
      box-shadow: 0px 0px 10px -3px #00000033;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;object-fit: contain;}
     #friends-select .item .shadow-effect img{height: 100%;width: 100%;object-fit: contain; }
     #friends-select .item .Friends-name{font-size: 14px;color: #686868;letter-spacing: 0.24px  ;  padding: 5px;}
        #friends-select .item:hover .shadow-effect{box-shadow: 0px 0px 0px 1px #283a90;}
           #friends-select .owl-item {    padding: 5px 0px;}
                   #friends-select .item.selected .shadow-effect{box-shadow: 0px 0px 0px 1px #283a90;}
                   .Friends-price-and-quantity{    padding: 10px 0px;}
                        .Friends-price-and-quantity .media-right .list-inline {margin: 0px}
                          .Friends-price-and-quantity .media-right  li img{height: 35px;width: 35px;border-radius: 50%;transition: .5s}
                            .Friends-price-and-quantity .media-right .show-friends-div  img{border: 1px solid #283a90}
                            #friends-select .item  .svg-inline--fa.fa-w-16{font-size: 30px;}
/*New bookmark page css close*/

/*Mobile media Query*/
@media only screen and (max-width: 768px) {
  header,footer{display: none;}
  section .book-mark-page-main-body {
    margin: 0px;
}
body{overflow-y: hidden;}
html,body,  section ,.container, .book-mark-page-main-body,  .book-mark-page-main-body .row, .bookmark-left-side-item, .main-Left-body {height: 100%}
section .book-mark-page-main-body .left-side-body{    height: calc(100% - 50px);
    overflow-y: auto;}
    section .book-mark-page-main-body .left-side-body .nav{       overflow: auto; padding-bottom: 0rem;
    height: 100%;}
  section .book-mark-page-main-body .bookmark-left-side-item{padding: 0px!important}
  .right-side-main-list-div{display: none;}
  section .book-mark-page-main-body .inner-header {
    height: 50px;padding: 0px}
    .inner-header .media{width: 100%}
      section .book-mark-page-main-body .inner-header h1{text-align: center;font-size: 16px;}
        section .book-mark-page-main-body .inner-header .media{height: 100%;position: relative;}
        section .book-mark-page-main-body .inner-header .media   .media-left{    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);}
      .hide-mobile{display: none;}
        section .book-mark-page-main-body .inner-header .media   .media-left button{width: 80px;
    background: transparent;
    border: none;
    text-align: left;
    color: #22A7DE;font-size: 18px;
}
  section .book-mark-page-main-body .left-side-body .nav-tabs .nav-link.active, section .book-mark-page-main-body .left-side-body .nav-tabs .nav-link{    border-bottom: 1px solid #e3e3e3;}
 section .book-mark-page-main-body .left-side-body .nav-tabs .nav-link.active{background: transparent!important}
#deleteother-ac .modal-dialog{margin: 0px;    align-items: flex-end;height: 100%}
#deleteother-ac .modal-dialog .modal-content{    border: none;
    border-radius: 20px 20px 0px 0px;    transform: translateY(100%);
    transition: transform .5s ease;}

.top-effect.show .modal-dialog .modal-content{     transform: translateY(0%)!important;}
#deleteother-ac .modal-body h5 {    font-size: 16px;
    text-align: center;
    padding: 0px 2rem;
    line-height: 1.5em;margin-bottom: 0px}
  #deleteother-ac .modal-dialog .modal-content  .modal-footer button{width: 40%;}
  #deleteother-ac {overflow-y: hidden;}
  .show-inner-products .bookmark-left-side-item{display: none;}
  .show-inner-products .right-side-main-list-div {display: block!important;}
  .right-side-main-list-div .book-mark-filler-div{position: absolute;    padding-left: 10px;
    top: 100%;
    height: 40px;
    width: 100%;
    border-bottom: 1px solid #dcdcdc;
    display: flex;
    align-items: center;}
    .right-side-main-list-div .right-side-product-list{    margin-top: 40px;    height: calc(100% - 90px);

    overflow-y: auto;}
    .right-side-product-list ul li {
    border-bottom: 1px solid #dcdcdc;
    padding: 15px 0px;
}
  .right-side-main-list-div .book-mark-filler-div a{    font-size: 12px;}
    .right-side-main-list-div .book-mark-filler-div a img{    width: 20px;
    height: 20px;}
    .right-side-product-list ul li .media .product-image img {
    width: 100px;
    height: 100px;
    object-fit: contain;
}
.right-side-product-list ul li .media .details .product-details-main-body .name-and-size h4 {
    margin: 0px;
    font-size: 14px;
}
.right-side-product-list ul li .media .details .product-details-main-body .short-discription p {    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: break-word;}
    .right-side-product-list ul li .media .details .product-details-main-body .star-review-and-quantity .rateing{    display: contents;}
    .right-side-product-list ul li .media .details .product-details-main-body .star-review-and-quantity .quantity{    margin-left: 10px;}
    .right-side-product-list ul li .media .details .product-details-main-body .price-detals h1 {
    margin: 4px 0px;
    font-size: 16px;}
    .right-side-product-list ul li .media .details .product-details-main-body .Shop-detals .media .shop-image img {
    width: 25px;
    height: 25px;}
    .right-side-product-list ul li .media .details .product-details-main-body .Shop-detals .media .shop-title p{    margin: 0px;
    font-size: 12px;
    letter-spacing: 0.16px;
    padding-left: 5px;}
    .right-side-main-list-div .right-side-product-list ul{    margin-bottom: 0rem;}
      .right-side-main-list-div  .tab-content .tab-pane{    height: 100%;}
        .right-side-main-list-div  .tab-content .tab-pane .main-right-side-list{height: 100%}
        .right-side-product-list ul li .media .product-image {    margin-right: .5rem !important;}
        .right-side-product-list ul li .media .details .product-details-main-body .col-md-12{padding: 0px!important}
      #arrow-cap .modal-dialog .modal-content{    height: auto;    border-radius: 10px 10px 0px 0px !important;}
      #arrow-cap .modal-dialog .modal-content .modal-footer{display: none;}
            #arrow-cap .modal-dialog .modal-content .modal-header{display: none;}
        #arrow-cap .modal-dialog {    align-items: flex-end;left: 0px;transition: transform .5s ease;}
        .popup-top-headd{    padding: 10px 15px!important;
    background: #f5f5f5;
    margin: 0px 0px 2rem;}
        #arrow-cap .modal-body{    padding: 0px 0px;}
        .arrow-click-cap {
    background-color: #f5f5f5;
    border-radius: 10px;
    width: calc(100% - 15px);
    margin: auto;
}
#arrow-cap .product-i-mage img {
    width: 50px;
    height: 50px;}
    .grey-bg-header .media-body h5 {
    font-size: 14px;font-weight: bold;
}
.grey-bg-header .media-body p {
    font-size: 10px;text-overflow: ellipsis;
    white-space: nowrap;}
    .desktop-view-none{display: block;   margin: auto;    margin-left: 1rem;}
  #arrow-cap .modal-content .close{    height: 25px;
    width: 25px;
    border-radius: 50%;
    color: #f8f9fa;
    font-weight: 100;    background: #6c757d;}
    .grey-bg-header .media-body h5 .size{    font-size: 10px;
    color: #979797;font-weight: normal;}

    .dta .media {    max-width: 100%;
    min-width: 100%;}
    #arrow-cap-modify .modal-dialog{    height: auto;    align-items: flex-end;
    min-height: calc(100% - (0px* 2));}
        #arrow-cap-modify .modal-dialog .modal-footer{display: none;}
        #arrow-cap-modify .modal-dialog .modal-content {    border-radius: 10px 10px 0px 0px!important;
    height: auto;}
    #arrow-cap-modify .modal-dialog .modal-content .modal-body {
        overflow-y: auto;
        padding: 0px;
        height: 420px;
    }
    .lk li {
    padding: 20px 0px;}
    #friends-select .item .Friends-name {
    font-size: 10px;}
    .dta .media .media-right a{color: #22A7DE!important}
}


/*Mobile media Query close*/

@media only screen and (min-width: 768px) {
  .show-mobile{display: none;}


}

.more-icon{    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    z-index: 1;
}
.nav-tabs .nav-item{    position: relative;}
.more-icon .three-dout{background: transparent;border: none}
.nav-tabs .nav-item a .media .details-product{    padding-right: 2rem;}

header{
  z-index: 99999999
}
