 /* :root {

    --p_m_bg_login_primary: #f5f7fa;
    
    --p_m_bg_login_primary_font: #f5f7fa;

    --p_m_login_primary_btn: #c5117a;

    --p_m_login_primary_btn_font: #900e0e;

    --p_m_bg_primary: #f5f7fa;
    --p_m_bg_secondary: #e10e0e;
    --p_m_bg_default: #06b1ea;

    --p_m_bg_primary_font: #19f578;  (NOTE this var used as main colot for fonts logos and other main texts)
    --p_m_bg_secondary_font: #ee6911;
    --p_m_bg_default_font: #e713e0;

    --p_m_primary_btn: #c5117a;
    --p_m_secondary_btn: #1ec821;
    --p_m_default_btn: #200bc1;

    --p_m_primary_btn_font: #900e0e;
    --p_m_secondary_btn_font: #0fcc8d;
    --p_m_default_btn_font: #dad416;
}  */

 /* START  ----------------- LOGIN --------------------- */
   #html-body input[type="checkbox"]{
    accent-color: var(--p_m_bg_login_primary_font);
   }
 #html-body.customer-account-forgotpassword button.primary,
 #html-body button.primary.login{
    background: var(--p_m_login_primary_btn);
    color: var(--p_m_login_primary_btn_font) !important;
 }
  #html-body .forgot-container .actions-toolbar .submit span{
    background: transparent;
 }
 #html-body main section.prx_mb_splash .prx_mb_splash_btngroup p.second button,
 #html-body main section.prx_mb_splash h1,
  #html-body .setpwd-container .field.note, 
  #html-body .forgot-container .field.note,
 #html-body .setpwd-container .actions-toolbar .primary a, 
 #html-body .forgot-container .actions-toolbar .primary a {
    color: var(--p_m_bg_login_primary_font) !important;
 }
 #html-body .setpwd-container .actions-toolbar .submit span{
    color: var(--p_m_bg_login_primary_font) !important;
 }
  #html-body .forgot-container .actions-toolbar .submit span{
    color: var(--p_m_login_primary_btn_font) !important;
 }

  #html-body .login-container .block.block-customer-login .block-content .actions-toolbar .primary a,
  #html-body .login-container .block.block-customer-login .block-title,
  #html-body .login-container .block.block-customer-login .block-content,
  #html-body .login-container .secondary .action.remind span {
    color: var(--p_m_bg_login_primary_font) !important;
 }
 #html-body .login-container .block.block-customer-login .block-content .actions-toolbar{
  background: var(--p_m_bg_login_primary);
 }
 #html-body main section.prx_mb_splash,
  #html-body .setpwd-container, 
  #html-body .forgot-container,
 #html-body .login-container{
  background: radial-gradient(479.51% 84.6% at 50% 106.69%, var(--p_m_bg_login_primary) 0%, var(--p_m_bg_login_primary) 100%);
   }

 /* END  ----------------- LOGIN --------------------- */

 /* START  ----------------- primary color --------------------- */

 #html-body main section.prx_main .prx_content h2>span a {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content p.cntr a {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .search-bar label {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .prx_favourites ul li .prx_details p.prx_pricerange,
 #html-body main section.prx_main .prx_content .prx_productbox ul li .prx_details p.prx_pricerange {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content h2>span a,
 #html-body main section.prx_main .prx_content p.breadcrumb a {
   color: var(--p_m_bg_primary_font);
 }

 #html-body .loader {
    border: 8px solid #f3f3f3;
    border-top: 8px solid var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .prx_prdbox .tab button.active {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .prx_prdbox .tabcontent#Properties ul li p.price span {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content p.breadcrumb {
   color: var(--p_m_bg_primary_font);
 }

 #html-body .prx_popup .prx_projectbox p.price span {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .tab button.active {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .tab button.active:after {
   background-color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .accordion .accordion-item h2.accordion-header button,
 #html-body main section.prx_main .prx_content h2.accordion-header button {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .accordion .accordion-item h2.accordion-header span,
 #html-body main section.prx_main .prx_content h2.accordion-header span {
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .accordion .accordion-item h2.accordion-header span:not(.accordion-property-tick,.grntick-accordion),
 #html-body main section.prx_main .prx_content h2.accordion-header span:not(.accordion-property-tick,.grntick-accordion){
   background-color: var(--p_m_bg_primary);
   color: var(--p_m_bg_primary_font);
 }

 #html-body .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
   background-color: var(--p_m_bg_primary);
   color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content .accordion .accordion-item.four .prx_whtbx h3 {
   color: var(--p_m_bg_primary_font);
 }
 
  #html-body main section.prx_main .prx_content h2.accordion-header label {
    color: var(--p_m_bg_primary_font);
  }
  #html-body a:hover, #html-body .alink:hover{
    color: var(--p_m_bg_primary_font);
  }
  #html-body .txt__primary{
    color: var(--p_m_bg_primary_font);
  }
  #html-body.rokanthemes-onepagecheckout #opc-sidebar .actions-toolbar > .primary > .btn-placeorder.btn-primary{
    background-color: var(--p_m_primary_btn);
    color: var(--p_m_primary_btn_font);
  }
  #html-body ._keyfocus *:focus, 
  #html-body input:not([disabled],.select2-search__field):focus, 
  #html-body textarea:not([disabled],.select2-search__field):focus, 
  #html-body select:not([disabled],.select2-search__field):focus{
    box-shadow: 0 0 3px 1px var(--p_m_bg_primary_font);
  }
  #html-body #mobile_checkout_success_page_container .btn.btn-round {
    background-color: var(--p_m_primary_btn);
    color: var(--p_m_primary_btn_font);
  }
  #html-body a:visited, #html-body .alink:visited{
    color: var(--p_m_primary_btn_font);
  }
  #html-body main section.prx_main .prx_content .accordion .accordion-item .accordion-body ul.prx_form li.document p span.add{
    color: var(--p_m_bg_primary_font);
  }
 /* END ----------------- primary color --------------------- */

 /* START ----------------- Secondary color --------------------- */

 #html-body button.secondary,
 #html-body input[type="file"].secondary,
 #html-body input[type="button"].secondary,
 #html-body input[type="submit"].secondary {
   background-color: var(--p_m_secondary_btn);
   color: var(--p_m_secondary_btn_font);
 }

 #html-body main section.prx_main .prx_content .accordion .accordion-item .accordion-body ul.prx_form_list li button.secondary {
   background-color: var(--p_m_secondary_btn);
   color: var(--p_m_secondary_btn_font);
 }

 /* END ----------------- Secondary color --------------------- */

 /* START ------------------  button color ---------------------- */

 #html-body:not(.customer-account-forgotpassword) button.primary:not(.login),
 #html-body input[type="file"].primary,
 #html-body input[type="button"].primary,
 #html-body input[type="submit"].primary,
 #html-body .request_type_sample {
   background-color: var(--p_m_primary_btn);
   color: var(--p_m_primary_btn_font);
 }

 #html-body main section.prx_main .prx_content p button.btn {
   background-color: var(--p_m_primary_btn);
   color: var(--p_m_primary_btn_font);
 }

 #html-body main section.prx_main .prx_content h2.update span button {
   background-color: var(--p_m_secondary_btn);
   color: var(--p_m_secondary_btn_font);
 }

 #html-body main .prx_searchbox p.filters span.active {
   background-color: var(--p_m_primary_btn);
   color: var(--p_m_primary_btn_font);
 }

 #html-body main section.prx_main .prx_content ul.notice li::before {
   background-color: var(--p_m_bg_primary_font);
 }

 #html-body main section.prx_main .prx_content p.filter button.secondary.active {
   background-color: var(--p_m_primary_btn);
   color: var(--p_m_primary_btn_font);
 }

 #html-body main section.prx_main .prx_popup .prx_popup_content .prx-bg-txt {
   background-color: var(--p_m_secondary_btn);
   color: var(--p_m_secondary_btn_font);
 }

 #html-body main section.prx_main .prx_popup .prx-btns-grp .prx-btns {
   background-color: var(--p_m_secondary_btn);
   color: var(--p_m_secondary_btn_font);
 }

  #html-body button.inspect-primary,  #html-body input[type="file"].primary, 
  #html-body input[type="button"].primary, #html-body input[type="submit"].primary, #html-body .request_type_sample {
    background: var(--p_m_primary_btn);
    color: var(--p_m_primary_btn_font);
  }
  #html-body main section.prx_main .prx_content .prx_prdbox .tabcontent#Meeting ul li label{
    color: var(--p_m_primary_btn_font);
  }
  #html-body button.inspect-secondary, 
  #html-body input[type="file"].secondary, 
  #html-body input[type="button"].secondary, 
  #html-body input[type="submit"].secondary {
    background: var(--p_m_secondary_btn);
    color: var(--p_m_secondary_btn_font);
  }
  #html-body main section.prx_main .prx_content .prx_prdbox .tabcontent#Meeting ul li label {
    color: var(--p_m_secondary_btn_font);
  }
 /* END ------------------  button color ---------------------- */

 /* START ------------------  icon section ---------------------- */
 #html-body main section.prx_main .prx_content ul.notice li::after,
 #html-body main section.prx_main .prx_content h2.more-arrow > span.seeall::after,
  #html-body main section.prx_main .prx_content label.files-upload::before,
 #html-body main section.prx_main .prx_content ul.prx_reservations li p.profile span.btns button.arrow,
#html-body main section.prx_main .prx_content .prx_prdbox .tabcontent#Properties ul li p button.share,
 #html-body main section.prx_main .prx_content ul.prx_prdlist li h3::after,
 #html-body .prx_popup .prx_projectbox h4 button.share,
 #html-body main section.prx_main .prx_content ul.prx_reservedetails li.location::after,
  #html-body main section.prx_main .prx_content ul.prx_prdhighlight li p.prx_location::after, 
  #html-body main section.prx_main .prx_content ul.prx_prdhighlight li p.prx_location::after, 
  #html-body main section.prx_main .prx_content .prx_favourites ul li .prx_details p.prx_location::after, 
  #html-body main section.prx_main .prx_content .prx_productbox ul li .prx_details p.prx_location::after,
  #html-body main section.prx_main .prx_content p.cntr .down-arrow-img,
  #html-body main section.prx_main .prx_search .search-img,
  #html-body main section.prx_main .prx_mb_mainMenu ul li:after{
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    background-size: 0px;
    display: inline-block;
    position: relative;
 }
 #html-body main section.prx_main .prx_content h2.more-arrow > span.seeall,
 #html-body main section.prx_main .prx_content ul.prx_prdlist li h3,
 #html-body main section.prx_main .prx_content ul.prx_reservedetails li.location,
 #html-body main section.prx_main .prx_content ul.prx_prdhighlight li p.prx_location, 
#html-body main section.prx_main .prx_content ul.prx_prdhighlight li p.prx_location, 
#html-body main section.prx_main .prx_content .prx_favourites ul li .prx_details p.prx_location, 
#html-body main section.prx_main .prx_content .prx_productbox ul li .prx_details p.prx_location,
#html-body main section.prx_main .prx_mb_mainMenu ul li{
    position: relative;
    background: none;
}
 #html-body main section.prx_main .prx_search .search-img {
    -webkit-mask-size: 40px;
    mask-size: 40px;
    background-color: var(--p_m_bg_primary_font);
    -webkit-mask-image: url(../images/search.svg);
    mask-image: url(../images/search.svg);
    background-image: url(../images/search.svg);
 }
  #html-body main section.prx_main .prx_mb_mainMenu ul li:after {
    content: "";
    -webkit-mask-size: 33px;
    mask-size: 33px;
    position: absolute;
    padding: 20px;
    inset: 0;
    background-color: #323232;
  }
  #html-body main section.prx_main .prx_mb_mainMenu ul li.hm-menu:after{
    -webkit-mask-image: url(../images/mn_home.svg);
    mask-image: url(../images/mn_home.svg);
    background-image: url(../images/mn_home.svg);
  }
  #html-body main section.prx_main .prx_mb_mainMenu ul li.pro-menu::after {
    -webkit-mask-image: url(../images/mn_projects.svg);
    mask-image: url(../images/mn_projects.svg);
    background-image: url(../images/mn_projects.svg);
  }
    #html-body main section.prx_main .prx_mb_mainMenu ul li.property-menu::after {
    -webkit-mask-image: url(../images/property.svg);
    mask-image: url(../images/property.svg);
    background-image: url(../images/property.svg);
  }
  #html-body main section.prx_main .prx_mb_mainMenu ul li.list-menu::after {
    -webkit-mask-image: url(../images/list-m.svg);
    mask-image: url(../images/list-m.svg);
    background-image: url(../images/list-m.svg);
  }
   #html-body main section.prx_main .prx_mb_mainMenu ul li.cli-menu::after {
    -webkit-mask-image: url(../images/mn_clients.svg);
    mask-image: url(../images/mn_clients.svg);
    background-image: url(../images/mn_clients.svg);
  }
   #html-body main section.prx_main .prx_mb_mainMenu ul li.acc-menu::after {
    -webkit-mask-image: url(../images/mn_account.svg);
    mask-image: url(../images/mn_account.svg);
    background-image: url(../images/mn_account.svg);
  }
  #html-body main section.prx_main .prx_mb_mainMenu ul li.offered-menu::after {
    -webkit-mask-image: url(../images/offered.svg);
    mask-image: url(../images/offered.svg);
    background-image: url(../images/offered.svg);
  }
  #html-body main section.prx_main .prx_mb_mainMenu ul li.res-menu::after {
    -webkit-mask-image: url(../images/mn_reserved.svg);
    mask-image: url(../images/mn_reserved.svg);
    background-image: url(../images/mn_reserved.svg);
  }
  #html-body main section.prx_main .prx_content p.cntr .down-arrow-img{
    -webkit-mask-size: 25px;
    mask-size: 25px;
    background-color: var(--p_m_bg_primary_font);
    -webkit-mask-image: url(../images/down-arrow.svg);
    mask-image: url(../images/down-arrow.svg);
    background-image: url(../images/down-arrow.svg);
    display:block;
  }
  #html-body  main#maincontent section.prx_main .prx_mb_mainMenu ul li.active::after{
    /* background-color: var(--p_m_bg_primary_font); */
    background-color: var(--p_m_menu_active_color);
  }
  #html-body  main#maincontent section.prx_main .prx_mb_mainMenu ul li.active{
    /* color: var(--p_m_bg_primary_font); */
    color: var(--p_m_menu_active_color);
  }
  main section.prx_main .prx_content p.cntr .down-arrow-img{
    -webkit-mask-size: 40px;
    mask-size: 40px;
    background-color: var(--p_m_bg_primary_font);
    -webkit-mask-image: url(../images/down-arrow.svg);
    mask-image: url(../images/down-arrow.svg);
    background-image: url(../images/down-arrow.svg);
  }
  
    #html-body #maincontent .prx_mb_mainMenu ul.more_menu_list li{
      padding-right: 11.82051vw  !important;
    }
    #html-body #maincontent .prx_mb_mainMenu ul.more_menu_list li::after{
      right: 0;
      left: unset;
    }
    #html-body main section.prx_main .prx_content ul.prx_reservedetails li.location::after,
      #html-body main section.prx_main .prx_content ul.prx_prdhighlight li p.prx_location::after, 
      #html-body main section.prx_main .prx_content .prx_favourites ul li .prx_details p.prx_location::after, 
      #html-body main section.prx_main .prx_content .prx_productbox ul li .prx_details p.prx_location::after{
        content: "";
        -webkit-mask-image: url(../images/prx_location.svg);
        mask-image: url(../images/prx_location.svg);
        background-image: url(../images/prx_location.svg);
        -webkit-mask-size: 4.87179vw auto;
        mask-size: 4.87179vw auto;
        position: absolute;
        padding: 0 7px;
        left: 0;
        top: 0;
        bottom: 0;
        background-color: var(--p_m_bg_primary_font);
  }
  #html-body .prx_popup .prx_projectbox h4 button.share{
        -webkit-mask-image: url(../images/shareblue.svg);
        mask-image: url(../images/shareblue.svg);
        background-image: url(../images/shareblue.svg);
        position: absolute;
        background-color: var(--p_m_bg_primary_font);
  }
  #html-body main section.prx_main .tabcontent.share-file-link ul.share-mobile li input[type="checkbox"],
  #html-body main section.prx_main .tabcontent.share-file-link ul[data-bind="foreach: shareLink"] li input[type="checkbox"], 
  #html-body main section.prx_main .tabcontent.share-file-link ul[data-bind="foreach: shareFile"] li input[type="checkbox"]{
      accent-color: var(--p_m_bg_primary_font);
  }
   #html-body main section.prx_main .prx_content ul.prx_prdlist li h3::after{
    content: "";
    -webkit-mask-image: url(../images/rightarrow.svg);
    mask-image: url(../images/rightarrow.svg);
    background-image: url(../images/rightarrow.svg);
    -webkit-mask-size: 6.15385vw auto;
    mask-size: 6.15385vw auto;
    background-color: var(--p_m_bg_primary_font);
    position: absolute;
    padding: 7px 4px;
    right: 8px;
    top: 0;
    bottom: 0;
   }
   #html-body main section.prx_main .prx_content ul.prx_reservations li p.profile span.btns button.arrow{
            -webkit-mask-image: url(../images/rightarrow.svg);
            mask-image: url(../images/rightarrow.svg);
            background-image: url(../images/rightarrow.svg);
            -webkit-mask-size: 7.15385vw auto;
            mask-size: 7.15385vw auto;
            background-color: var(--p_m_bg_primary_font);
   }

   #html-body .main section.prx_main .prx_content .prx_prdbox .tabcontent#Properties ul li p button.share{
        -webkit-mask-image: url(../images/shareblue.svg);
        mask-image: url(../images/shareblue.svg);
        background-image: url(../images/shareblue.svg);
        -webkit-mask-size: 24px auto;
        mask-size: 24px auto;
        background-color: var(--p_m_bg_primary_font);
   }
    #html-body main section.prx_main .prx_content label.files-upload::before{
        content: "";
        -webkit-mask-image: url(../images/paperclip.svg);
        mask-image: url(../images/paperclip.svg);
        background-image: url(../images/paperclip.svg);
        -webkit-mask-size: 24px auto;
        mask-size: 24px auto;
        padding: 12px;
        background-color: var(--p_m_bg_primary_font);
    }
    #html-body main section.prx_main .prx_content h2.more-arrow > span.seeall::after{
        content: "";
        -webkit-mask-image: url(../images/rightarrow.svg);
        mask-image: url(../images/rightarrow.svg);
        background-image: url(../images/rightarrow.svg);
        -webkit-mask-size: 6.15385vw auto;
        mask-size: 6.15385vw auto;
        background-color: var(--p_m_bg_primary_font);
        position: absolute;
        padding: 7px 6px;
        right: 0;
        top: 0;
    }
    #html-body main section.prx_main .prx_content ul.notice li::after{
      position: absolute;
        content: "";
        -webkit-mask-image: url(../images/rightarrow.svg);
        mask-image: url(../images/rightarrow.svg);
        background-image: url(../images/rightarrow.svg);
        -webkit-mask-size: 25px auto;
        mask-size: 25px auto;
        background-color: var(--p_m_bg_primary_font);
    }
 /* END ------------------  icon section ---------------------- */
