.topmenu{background-color: #ffffff;}

.btn-outline-themecolor{background-color: transparent;border-color: #4D53FF;}
.btn-search-slt{border-radius: 5px!important;min-width: auto!important;}
.bg-search{background-color: #F8F8F8;}
.btn-search{border-radius: 5px!important;min-width: auto!important;margin-left: 0!important;height: 40px;float: left;}

/***** Banner Section *****/
.banner-section {position: relative;}
.banner-section {background-size: cover;width: 100%;height: 100vh;position: relative;background-position: right top;
  background-repeat: no-repeat;}
  .gradient-overlay {top: 0;left: 0;position: absolute;height: 100%;width: 100%; z-index:9; background: #b92b27;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #1565C0, #b92b27);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #1565C0, #b92b27); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    opacity: 0.65; }
    .banner-title {line-height: 1;}
    .banner-desc {font-size: .96rem;font-weight: 500;line-height: 1.4;margin-top: 5px;}
    .banner-section-list {position: absolute;bottom: 0;left: 0;right: 0;width: 100%;z-index: 0;}
    .banner-section-list-text-size {font-size: .85rem;}
    .banner-section-list-text-size a:hover{color:#fff; opacity:0.7;}
    .list-desc {padding: .2rem 1.5rem;}
    .list-content {position: relative;z-index:99;}
    #smoothstart {background: #fff;display: flex;align-items: flex-end;height: 100vh;overflow: hidden;position: absolute;width: 100%; z-index:-2;}
    #smoothstart img {position: absolute;min-width: 100%;min-height: 100%;height: 100%;width: 100%;background: #000;
      -webkit-backface-visibility: hidden;backface-visibility: hidden;opacity: 1;-webkit-transform: scale(1);transform: scale(1);
      object-fit: cover;}
      .banner-taglines{position: absolute; bottom:0; left: 50%; transform: translateX(-50%);padding: 10px 30px 05px; background-color: rgba(23,24,76,.5); border-radius: 40px 40px 0 0}
      .banner-taglines li{padding: 0 20px;}
      .banner-taglines li span{padding: 0 5px;}
      .topcatelisting {display: inline-block; position: relative; max-width:600px}
      .topcatelisting ul {margin: 0 auto;width: 600px;position: relative;display: inline-block;padding: 40px 0px 0;overflow: hidden;}
      .topcatelisting li{padding: 0 10px; width: 20%;}
      .topcatelisting li span{padding: 5px; display: block;}
      .topcatelisting li span.icon{height: 35px;}



      .topcatelisting:after, .topcatelisting:before {right: -100px;background: linear-gradient(to left,transparent 0,rgba(255,255,255,.3) 100%);}
      .topcatelisting:after, .topcatelisting:before {content: '';display: block;position: absolute;width: 100px;height: 1px;bottom: 6px;}
      .topcatelisting:before {left: -100px;background: linear-gradient(to right,transparent 0,rgba(255,255,255,.3) 100%);}
      .topcatelisting2 {position: relative;overflow: hidden;}
      .arrowanimate {display: inline-block;position: relative;-ms-transition: all 600ms ease;-o-transition: all 600ms ease;
        -webkit-transition: all 600ms ease;transition: all 600ms ease;}
        .arrowanimate:before, .arrowanimate:after {content: '';height: 1px;width: 500px;background: rgba(255,255,255,0.4);
        position: absolute;bottom: 6px;right: 100%;}
        .arrowlinks:hover, .arrowlinks:focus{color:#fff;}
        .arrowanimate:after {left: 100%;}

        /*second banner-page css*/
        .custom-white-border{border:3px solid #ffffff;border-radius: 5px;padding:1rem;transition: all .3s linear;}
        .mw-400{  max-width: 500px;}
        .custom-white-border a.clr-white { display: block;}
        .topcatelisting-1 li a:hover{color:#fff;}
        .topcatelisting-1 li:hover .custom-white-border{border-color:#1a237e;}

        /**********  homepage content  ************/
        .oveflowscroll {padding: 0px;}
        .sidebarlist{padding: 0 10px 20px 10px; max-height: 400px; overflow-y: auto;scrollbar-width: thin; scrollbar-color: #1a237e lightgray;
          scrollbar-width: 5px; scrollbar-face-color: #1a237e; scrollbar-track-color:#1a237e;}
          .sidebarlist::-webkit-scrollbar {width:2px; background:lightgray; border-radius: 15px;}

          .sidebarlist::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2); 
            border-radius: 15px;
          }

          .sidebarlist::-webkit-scrollbar-thumb {
            border-radius: 15px;
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2); 
            background:#1a237e;
          } 

          .sidebarlist li a{color: #333; padding: 5px 20px; display: block; font-size: 1.08em;-ms-transition: all 200ms ease;
            -o-transition: all 00ms ease;
            -webkit-transition: all 00ms ease;
            transition: all 00ms ease;}
            .sidebarlist li.active a {
              background: #1a237e;
              color: #fff;
              margin:0 -10px; 
              padding: 5px 30px;
              -ms-transition: all 100ms ease;
              -o-transition: all 100ms ease;
              -webkit-transition: all 100ms ease;
              transition: all 100ms ease;
            }


            /****  categories slider  ****/
            .frame {
              height: 240px;
              overflow: hidden;
            }

            .frame ul.main-news__items-wrapp {
              list-style: none;
              margin: 0;
              padding: 0;
              height: 100%;
              position: relative;
            }

            .frame ul.main-news__items-wrapp li {
              float: left;
              width: 240px;
              min-width: 240px;
              height: 100%;
              margin: 0 0 0 20px;
              cursor: pointer;
              border-radius: 3px;
            }

            .frame ul.main-news__items-wrapp li.active {
              box-shadow: none;
            }

            .scrollbar {
              margin: 1em 0 1em 0;
              height: 10px;
              background: #ffffff;
              line-height: 0;
              border-radius: 20px;
            }

            .scrollbar .handle {
              width: 100px;
              height: 100%;
              background: #1a237e;
              cursor: pointer;
              border-radius: 20px;
            }

            .scrollbar .handle .mousearea {
              position: absolute;
              top: -9px;
              left: 0;
              width: 100%;
              height: 20px;
            }

            .news-slider__item {
              position: relative;
              transition: all .3s linear;
              background-color: #ffffff;
            }

            .news-slider__item:last-child {
              margin-right: 0;
            }

            .news-slider__item:hover {
              cursor: pointer;
              box-shadow: none;
              background-color: #1a237e;
              color: #ffffff;
            }

            .news-slider__item:hover .circle-rounded{
              background-color: rgba(255,255,255,.2);
            }
            .news-slider__item:hover .circle-img:before{
              background: none;
            }
            .news-slider__item .news-slider__link {
             position: absolute;
             top: 0;
             left: 0;
             right: 0;
             bottom: 0;
             height: 100%;
             width: 100%;
             display: block;
             z-index: 99;
           }

           .news-slider__item .news-slider__media {
             background-size: cover;
             width: 100%;
             height: 180px;
             position: relative;
             transition: all 0.5s;
           }
           .circle-img:before{
            content: '';
            background: rgba(0,0,0,.4);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 50%;

          }
          .circle-img{
            width: 150px;
            height: 150px;
            border-radius: 50%;
            margin: 0 auto;
            background-color: #4f4f4f;
            position: relative;
            overflow: hidden;
          }
          .circle-img-2{
           position: absolute;
         }
         .slide-img-icon{
          object-fit: cover;
          height: 100%;
        }
        .form-banner-content{
          background-color: #1a237e;
          color: #fff;
          position: absolute;
          bottom: 0;
          width: 100%;
          margin-bottom: 2rem;
        }
        .banner-content{
          position: relative;
        }

        @media(max-width:1200px) {
          .news-slider__item {
            width: 314px;
          }
        }


        /*material-city-section css*/
        .title3 h2{
          overflow: hidden;
          text-align: center;
        }
        .title3 h2:before,
        .title3 h2:after {
          background-color: #1a237e;
          content: "";
          display: inline-block;
          height: 2px;
          position: relative;
          vertical-align: middle;
          width: 10%;
        }

        .title3 h2:before {
          right: 1em;
          margin-left: -10%;
        }

        .title3 h2:after {
          left: 1em;
          margin-right: -10%;
        }
        .cat-count {
          position: relative;
          z-index: 99;
        }  
        .material-banner-section {position: relative;}
        .material-banner-section {
          width: 100%;
          height: 300px;
          margin: 0 auto;
          background-color: #4f4f4f;
          position: relative;
          overflow: hidden;
          z-index: 1;
          border-radius: 5px;
        }
        .material-img{
          object-fit: cover;
          height: 100%;
          width: 100%;
        }
        .bottom-underline{
          position: relative;
          padding-bottom: 1rem;
        }
        #smoothstart-material-banner{
          position: absolute;
          width: 100%;
          height: 100%;
        }
        .bottom-underline:after {
          border-bottom: 2px solid #ffffff;
          content: '';
          position: absolute;
          left: 0;
          right: 0;
          width: 15%;
          bottom: 0;
        }
        #smoothstart-material-banner img {
          transform: scale(1);
          -ms-transition: all 400ms ease;
          -o-transition: all 400ms ease;
          -webkit-transition: all 400ms ease;
          transition: all 400ms ease;
        }
        a.cityhover:hover #smoothstart-material-banner img {
          transform: scale(1.05);
          -ms-transition: all 400ms ease;
          -o-transition: all 400ms ease;
          -webkit-transition: all 400ms ease;
          transition: all 400ms ease;
        }
        a.cityhover:hover .gradient-overlay {
          opacity: 0.5;
          -ms-transition: all 400ms ease;
          -o-transition: all 400ms ease;
          -webkit-transition: all 400ms ease;
          transition: all 400ms ease;
        }


        /*******  Featured products  *******/

        .featured-img {
          height: 485px;
          overflow: hidden;
          border-radius: 5px;
          position: relative;
        }
        .featured-img img.the {
          height: 100%;
          width: 100%;
          object-fit: cover;
        }

        .featured-text {
          position: absolute;
          top: 50%;
          left: 0;
          transform: translateY(-50%);
          padding: 30px;
          z-index: 99;
        }
        .featured-text h2{padding:10px 0 20px;}
        .featured-text a{color: #fff;}
        .bg-overlay {
          position: absolute;
          top: 0;
          left: 0;
          height: 100%;
          width: 100%;
          opacity: 0.5;
        }

        .featured-img .featured-banner {
          height: 100%;
          width: 100%;
          object-fit: cover;
          }/******* Supplierbox  ********/

          .supplier-box{
           min-height: 130px;
         }

         /******** Add your listing **********/
         .addyourlisting{position: relative;}
         .banner0flist {
          position: relative;
          height: 500px;
          overflow: hidden;
        }
        .banner0flist img {
          height: 100%;
          width: 100%;
          object-fit: cover;
        }
        .listing-text {
          position: absolute;
          z-index: 99;
          top: 50%;
          left: 10%;
          transform: translateY(-50%);
          color: #fff;
          max-width: 575px;
        }

        .listing-text h2 {
          font-size: 3em;
          padding:0 0 20px 0;
        }
        .listing-text a {
          padding: 10px 30px;
        }
        span.pluslink {
          background: rgba(255,255,255,0.2);
          width: 20px;
          height: 20px;
          padding: 4px 10px;
          border-radius: 50%;
          margin-right: 10px;
        }
        .listing-text a:hover {
          color: #fff;
          opacity: 0.9;
        }
        /****** Searchbox css *****/


        .search-slt{
          display: block;
          width: 100%;
          font-size: 0.875rem;
          line-height: 1.5;
          height: calc(2.4rem + 2px) !important;
          border-radius:5px;
          border:0;
        }
        .wrn-btn{
          width: 100%;
          border:1px solid #ffffff;
        }
        .mw-800{
          max-width: 800px;
        }

        /*listing-banner-section css*/

        .listing-banner-content{position: relative;}
        .banner-listing-text {
          position: absolute;
          z-index: 99;
          top: 62%;
          left: 50%;
          transform: translate(-50%,-50%);
          color: #fff;
          max-width: 1000px;
          padding: 1em;
          width: 100%;
        }
        .font-weight-medium{
          font-weight: 600;
        }
        .list-banner0flist {
          position: relative;
          height: 450px;
          overflow: hidden;
        }
        .list-banner0flist img {
          height: 100%;
          width: 100%;
          object-fit: cover;
        }
        .custom-breadcrumb .breadcrumb-item+.breadcrumb-item::before {
          color: #ffffff;
          content: ">";
        }
        .category-section {
          max-width: 1000px;
          margin: 0 auto;
          margin-left: 27px;
        }
        .text-tline{
          /*font-size: 1.5em;*/
        }

/*.arrow:after {
    border: solid #fff;
    border-width: 0 2px 2px 0;
    top: 3px;
    right: -30px;
    position: absolute;
    padding: 6px;
    transform: rotate(-45deg);
    content: "";
    }*/
    .arrow{
      position: relative;
    }

    .viewallbutton a.btn {
      background: none;
      color: #1a237e !important;
      border: 1px solid #1a237e;
    }
    /*after develpoment header responsive css*/
    @media (max-width: 576px){
      .navbar-brand {margin: 0!important;}
    }


    a.btn-white.clr-white.d-block:after {
      font-family: "untitled-font-1";
      content: "\4c";
      right: 35%;
      top: 0;
      color: #ffffff;
      cursor: pointer;
      margin-top: 14px;
      transition: all .3s linear;
      font-size: 10px;
      font-weight: normal;
      vertical-align: middle;
    }
    .menu-item:last-child .menu-item-wrapper:after{
      display:none;
    }
    .sidebarlist{min-height: 400px;}