
/* ---------------------------------------------------
    API key page
----------------------------------------------------- */
.d2c_reset_button{
    color: var(--secondary_shade_3);
    border-color: var(--secondary_shade_3);
}
.d2c_reset_button:hover{
    background: var(--bs-danger);
    color: var(--bs-white);
}

/* ---------------------------------------------------
    Reports page
----------------------------------------------------- */
.d2c_reports_card p{
    font-size: 0.875rem;
    color: var(--secondary_shade_3);
}
.d2c_reports_card p span{
    font-size: 1.75rem;
    font-weight: 500;
}
.d2c_reports_card h6{
    font-weight: 500;
    color: var(--secondary_shade_1);
}
/* user reports count */
@media screen and (min-width: 92.5rem) {
    .d2c_user_reports{
        width: 80%;
    }
}

/* ---------------------------------------------------
    settings page
----------------------------------------------------- */
/* profile image upload */
.d2c_image_upload label {
    border: 0.125rem dashed #e5e5e5;
    border-radius: 0.625rem;
    font-size: 0.8125rem;
    color: var(--secondary_shade_3);
    width: 8.75rem;
    height: 8.75rem;
    word-break: break-all;
    padding: 0.625rem;
}
.d2c_image_upload label span{
    display: block;
    font-size: 1.5625rem;
}
.d2c_image_upload label:hover{
    cursor: pointer;
}

.d2c_setting_option p{
    color: var(--secondary_shade_3);
    font-size: 0.9375rem;
}


/* ---------------------------------------------------
    security page
----------------------------------------------------- */
.d2c_distribution_para{
    color: var(--secondary_shade_3);
}
#d2c_area_distribution_chart .apexcharts-bar-area:hover {
    fill: #0F98B8;
}
.d2c_summary_and_complain .nav-link{
    font-size: 1.5rem;
    color: var(--bs-secondary);
    font-weight: 600;
    border-bottom: 0.125rem solid var(--primary_border);
    border-radius: 0rem;
}
.d2c_summary_and_complain .nav-link.active{
    background: transparent;
    color: var(--bs-secondary);
    border-color: var(--bs-primary);
}


/* ---------------------------------------------------
    support page
----------------------------------------------------- */
.d2c_progressbar_title{
    font-size: 0.875rem;
    font-family: var(--primary_font);
}

/* ---------------------------------------------------
    visualization page
----------------------------------------------------- */
.d2c_cashflow_filter{
    margin-bottom: -2rem;
}

/* ---------------------------------------------------
    trends page
----------------------------------------------------- */
#trends_world_map svg path{
    fill: #4D5D76;
}
#trends_world_map svg path:hover{
    fill: var(--bs-primary);
}

/* ---------------------------------------------------
    performance page
----------------------------------------------------- */
.d2c_user_performance_card p{
    font-size: 0.875rem;
    font-family: var(--primary_font);
}
.d2c_progress_status p{
    font-weight: 500;
}
.d2c_progress_header p{
    font-weight: 500;
}
/* multi step progressbar */

.d2c_multi_steps_progress {
  display: table;
  table-layout: fixed;
  width: 100%;
}
.d2c_multi_steps_progress > li {
  text-align: center;
  display: table-cell;
  font-size: 0.9375rem;
  position: relative;
  color: var(--secondary_shade_3);
}
.d2c_multi_steps_progress > li:before {
  content: '';
  display: block;
  margin: 0 auto 0.75rem;
  background-color: var(--bs-primary);
  width: 3.125rem;
  height: 3.125rem;
  text-align: center;
  font-weight: bold;
  border: 0.9375rem solid var(--primary_shade_2);
  border-radius: 50%;
  position: relative;
  z-index: 99;
}
.d2c_multi_steps_progress li:after {
  content: "";
  height: 1rem;
  width: 100%;
  background-color: var(--primary_shade_2);
  position: absolute;
  top: 1.0625rem;
  left: -50%;
  /* z-index: -1; */
}
.d2c_multi_steps_progress > li:nth-child(even)::before{
    top: -0.75rem;
    width: 3.75rem;
    height: 3.75rem;
    background: var(--primary_shade_2);
}
.d2c_multi_steps_progress > li:first-child::after {
  display: none;
}
.d2c_multi_steps_progress li.active::before{
    border-color: var(--bs-primary);
    background: var(--bs-white);
}
.d2c_multi_steps_progress li span{
    display: block;
    position: absolute;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--bs-primary);
    top: 0.75rem;
    z-index: 99;
    left: 50%;
    transform: translateX(-50%);
}
.d2c_multi_steps_progress > li:nth-child(even).active:before{
    background: var(--bs-primary);
    border-color: var(--bs-primary);
}
.d2c_multi_steps_progress > li:nth-child(even).active span{
    color: var(--bs-white);
}
.d2c_multi_steps_progress > li.active:after {
    background-color: var(--bs-primary);
}
/*

/* ---------------------------------------------------
    home page
----------------------------------------------------- */

.d2c_assets_inventory .nav-link{
    font-size: 1rem;
    color: var(--bs-secondary);
    font-weight: 500;
    border-bottom: 0.125rem solid var(--primary_border);
    border-radius: 0rem;
}
.d2c_assets_inventory .nav-link.active{
    background: transparent;
    color: var(--bs-primary);
    border-color: var(--bs-primary);
}
.d2c_assets_inventory_content .d2c_small_icon_wrapper i{
    width: 2.0625rem;
    height: 2.0625rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--primary_shade_2);
    color: var(--bs-primary);
    margin-right: 0.625rem;
}
.d2c_assets_inventory_content .d2c_small_icon_wrapper p{
    color: var(--secondary_shade_1);
}
.d2c_assets_inventory_content .card{
    padding: 0.75rem;
}

/* ---------------------------------------------------
    profile page
----------------------------------------------------- */
.d2c_user_card .d2c_card_img_top{
    height: 9.375rem;
    border-radius: 0.625rem 0.625rem 0rem 0rem;
    background: linear-gradient(0deg, rgba(15, 152, 184, 0.93) 0%, rgba(15, 152, 184, 0.93) 100%), url("../images/profile_top_bg.png"), lightgray -3.3651rem -3.1808rem / 119.053% 158.566% no-repeat;
}
.d2c_user_card .d2c_user_profile_image{
    width: 6.25rem;
    height: 6.25rem;
    object-fit: cover;
    padding: 0.25rem;
    margin-bottom: 1.25rem;
}
.d2c_user_card .d2c_user_details{
    margin-top: -3.125rem;
}
.d2c_user_details .d2c_designation{
    font-family: var(--primary_font);
    font-size: 1.125rem;
}
.d2c_user_achievement p{
    font-size: 0.9375rem;
}
.d2c_contact_details .d2c_contact_details_heading{
    font-size: 0.875rem;
    margin-bottom: 0rem;
}
.d2c_contact_details a,.d2c_contact_details .d2c_address{
    color: var(--bs-secondary);
    font-weight: 500;
}

/* you can change progressbar value change here */
@keyframes progress_1 {
    to { --progress-value: 75; }
}
  
@keyframes progress_2 {
    to { --progress-value: 55; }
}
.d2c_progress_bar {
    width: 7.5rem;
    height: 7.5rem;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.188rem;
}
  
.d2c_progress_bar::before {
    counter-reset: percentage var(--progress-value);
    content: counter(percentage) '%';
    color: var(--bs-secondary);
    font-size: 1.5rem;
    font-weight: 400;
    font-family: var(--secondary_font);
}
  
.d2c_progressbar_1 {
    background: radial-gradient(closest-side, white 79%, transparent 80% 100%),conic-gradient(#0F98B8 calc(var(--progress-value) * 1%), #4D5D76 0);
    animation: progress_1 2s 1 forwards;
}
  
.d2c_progressbar_1::before {
    animation: progress_1 2s 1 forwards;
}
  
.d2c_progressbar_2 {
    background: radial-gradient(closest-side, white 79%, transparent 80% 100%, white 0),conic-gradient(#0F98B8 calc(var(--progress-value) * 1%), #4D5D76 0);
    animation: progress_2 2s 1 forwards;
}
  
.d2c_progressbar_2::before {
    animation: progress_2 2s 1 forwards;
} 

@property --progress-value {
    syntax: '<integer>';
    inherits: false;
    initial-value: 0;
}

/* ---------------------------------------------------
    landing page
----------------------------------------------------- */

/* navbar start */
.navbar-brand{
    max-width: 12.25rem;
}
.d2c_navbar{
    padding-top: 1.25rem;
    /* background: linear-gradient(90deg, rgb(80 214 162) 0%, rgb(83 192 249) 100%); */
}
.d2c_navbar .navbar-nav .nav-item{
    margin: 0rem 0.9375rem;
    display: flex;
    align-items: center;
}
.d2c_navbar .navbar-nav .nav-item:last-child{
    margin-right: 0;
}
.d2c_navbar .navbar-nav .nav-link{
    color: var(--secondary_shade_1);
    font-weight: 500;
    font-size: 1rem;
    transition: .4s all ease;
    padding: 0.4375rem 0rem 0.4375rem 0rem;
}
.d2c_navbar .navbar-nav .nav-link:hover{
    color: var(--bs-primary);
    transition: .4s all ease;
}
.navbar{
    padding: 1rem 1.25rem;
    border-radius: var(--border-radius);
    border: 0.125rem solid #0a95b414;
    background: var(--bs-white);
    box-shadow: 0rem 0rem 1.875rem 0rem rgba(0, 0, 0, 0.06);
}
/* Nav Item Show from Side */
body .d2c_mobile_view {
    position: fixed;
    height: 100vh;
    inset: 0;
    opacity: 1;
}
.navbar-nav .d2c_btn{
    padding-left: 1.875rem !important;
    padding-right: 1.875rem !important;
}
.navbar.d2c_mobile_view_body .navbar-nav {
    width: 100%;
}

.navbar.d2c_mobile_view_body .nav-item {
    margin-right: 0;
}

.d2c_mobile_view .show_width {
    max-width: 14.625rem;
    width: 100%;
    height: 100vh;
    position: absolute;
    right: -23.75rem;
    top: 0;
    transition: 0.5s;
    padding: 1.25rem 0.9375rem;
    background-color: #d1f5f4;
    overflow: scroll;
    z-index: 9999;
    box-shadow: 0rem 0rem 0.625rem rgb(0 0 0 / 15%);
}

.d2c_mobile_view.show .show_width {
    right: 0;
    transition: 0.5s;
}
.hide_width{
    max-width: 15.625rem;
    width: 100%;
    height: 100vh;
    position: absolute;
    right: -23.75rem !important;
    top: 0;
    transition: 0.5s !important;
    padding: 1.25rem 0.9375rem;
    background-color: #D9F0F3;
    overflow: scroll;
    z-index: 9999;
}

.navbar-toggler:focus{
    box-shadow: none;
}
.navbar-toggler {
    border: 0.0625rem solid #25266661;
    color: var(--secondary_color);
    padding: 0.3125rem 0.625rem;
    width: 2.75rem;
    margin-left: 0.9375rem;
    transition: .4s all ease;
}
.navbar-toggler:hover{
    background: var(--bs-primary);
    color: var(--bs-white);
    transition: .4s all ease;
    border-color: var(--bs-white);
}
.d2c_cross_btn{
    width: auto;
    border: none;
}
@media only screen and (min-width:61.9375rem) {
    body .d2c_mobile_view {
        opacity: 0;
        transition: .5s;
    }
}

.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link {
    color: var(--bs-primary) !important;
}
.navbar-nav .nav-link.active::after{
    opacity: 1;
    width: 100%;
    transition: .4s all ease;
}
/* navbar end */

/* hero section */
.d2c_hero_section{
    height: 100vh;
    padding-top: 7.5rem;
    margin-top: -7.5rem;
    background-image: url("../images/hero_bg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.d2c_hero_content .d2c_hero_title{
    font-size: 3.375rem;
    font-weight: 500;
    margin-bottom: 1.25rem;
}
.d2c_hero_content .d2c_hero_para{
    width: 80%;
    color: var(--bs-secondary);
    font-size: 1.125rem;
    margin-bottom: 1.25rem;
}
.d2c_hero_content .btn{
    margin-bottom: 1.25rem;
}

.d2c_rating_text{
    color: var(--bs-secondary);
    font-family: var(--primary_font);
    font-weight: 500;
}
.d2c_rating i{
    color: var(--bs-warning);
}

/* about us section */
.d2c_about{
    padding: 6.25rem 0rem;
    background-image: url("../images/single_triangle_left.png"),url("../images/double_triangle_right.png");
    background-repeat: no-repeat, no-repeat;
    background-position: 0% 90%, right center;
}
.d2c_icon_wrapper{
    width: 3.125rem;
    height: 3.125rem;
    margin-right: 1rem;
    background: var(--primary_shade_2);
    border-radius: 0.3125rem;
    font-size: 1.125rem;
    font-size: 1.6875rem;
}
.d2c_about .d2c_about_right{
    padding: 3.75rem 0rem;
    background-image: url("../images/dots_image.png"),url("../images/arrow_image.png");
    background-repeat: no-repeat, no-repeat;
    background-position: 0% 17%, top center;
    background-size: auto , contain;
}
.d2c_about_content .d2c_subtitle{
    font-weight: 500;
    font-size: 1.25rem;
}
/* choose us section */
.d2c_choose_us{
    padding: 6.25rem 0rem 9.375rem 0rem;
    background-image: url("../images/wave_bg.png");
    background-position: bottom;
    background-size: cover;
}
.d2c_features_card{
    background: var(--bs-white);
    padding: 2.5rem 1.875rem;
}
.d2c_features_card img{
    margin-bottom: 1.25rem;
    max-width: 5.625rem;
    max-height: 5.625rem;
    object-fit: cover;
}
.d2c_features_card h4{
    font-size: 1.375rem;
    font-weight: 500;
}
.d2c_features_card p{
    font-size: 1.125rem;
}
/* video section */
.d2c_video_section{
    padding: 6.25rem 0rem;
}
.d2c_video_section video{
    width: 90%;
    object-fit: cover;
}
/* features section */
.d2c_features{
    padding: 6.25rem 0rem;
    background-image: url("../images/double_triangle_left.png"),url("../images/single_triangle_right.png");
    background-repeat: no-repeat, no-repeat;
    background-position: left center, 100% 90%;
}
.d2c_features_right{
    background-image: url("../images/circle.png"),url("../images/circle.png");
    background-repeat: no-repeat, no-repeat;
    background-position: bottom center, top center;
    background-size: auto , auto;
}
.d2c_left_button{
    margin-left: 4.125rem;
}
/* pricing section */
.d2c_pricing{
    padding: 6.25rem 0rem 8.75rem 0rem;
    background-image: url("../images/wave_bg_1.png");
    background-repeat: no-repeat;
    background-position: bottom;
}
.d2c_pricing_card{
    background: var(--bs-white);
    padding: 2.8125rem 1.875rem;
    background-image: url("../images/wave_top.png");
    background-repeat: no-repeat;
    background-position: top;
    border: 0.0625rem solid rgba(77, 93, 118, 0.10);
    box-shadow: 0rem 0rem 1.875rem 0rem rgba(0, 0, 0, 0.06);
    border-radius: 0.625rem;
    transition: .4s all ease;
}
.d2c_pro_plan{
    background-color: rgba(15, 152, 184, 1);
    background-image: url("../images/wave_top_1.png");
}
.d2c_pricing_card .d2c_plan_name{
    font-weight: 500;
    margin-bottom: 2.5rem;
}
.d2c_pricing_card .d2c_price{
    font-size: 2.75rem;
    font-family: var(--secondary_font);
    color: var(--bs-primary);
    font-weight: 300;
    margin-bottom: 1.875rem;
}
.d2c_pricing_card ul{
    padding-left: 3.75rem;
}
.d2c_pricing_card ul li{
    font-family: var(--secondary_font);
    font-size: 1.125rem;
    font-weight: 400;
    display: flex;
    align-items: center;
    margin: 0.5rem 0rem;
    color: var(--bs-secondary);
}
.d2c_pricing_card ul li span{
    font-size: 0.875rem;
    display: inline-block;
    width: 1.375rem;
    color: var(--bs-success);
}
.d2c_pricing_card ul li span .fa-times{
    color: var(--bs-danger);
}
.d2c_pricing_card .btn{
    margin-top: 1.25rem;
    font-weight: 600;
    padding: 0.625rem 1.875rem 0.5625rem 1.875rem;
}
.d2c_pro_plan li,.d2c_pro_plan li span,.d2c_pro_plan .d2c_plan_name,.d2c_pro_plan .d2c_price{
    color: var(--bs-white) !important;
}
.d2c_pro_plan .btn{
    background: var(--bs-white);
}
.d2c_pro_plan .btn:hover{
    background: var(--bs-secondary);
}
/* contact section */
.d2c_contact{
    padding: 6.25rem 0rem;
    background-image: url("../images/double_triangle_left.png"),url("../images/single_triangle_right.png");
    background-repeat: no-repeat, no-repeat;
    background-position: left center, 100% 90%;
}

/* call to action section */
.d2c_CTA_content{
    padding: 6.25rem 0rem;
    background-color: rgba(15, 152, 184, 1);
    background-image: url("../images/call_to_action_bg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.d2c_CTA_content .btn{
    background: var(--bs-white);
    color: var(--bs-primary);
    font-weight: 600;
    padding: 0.625rem 2.1875rem 0.5625rem 2.1875rem;
}
.d2c_CTA_content p{
    font-size: 1.125rem;
}
/* newsletter section */
.d2c_newsletter_content{
    padding: 3.75rem 3.125rem;
    margin: 6.25rem 0rem;
}
.d2c_newsletter_content form .form-control{
    padding: 0.75rem 1rem;
}
/* footer section */
.d2c_footer{
    padding-top: 4.375rem;
    background-color: rgba(15, 152, 184, 1);
    background-image: url(../images/top_bottom_double_triangle.png),url(../images/bottom_up_double_triangle.png);
    background-repeat: no-repeat;
    background-position: top left,bottom right;
}
.d2c_footer_logo_wrapper{
    border: 0.125rem solid #31a1bc !important;
    padding: 0.9375rem 5rem;
    background: rgb(15 152 184);
}
.d2c_footer .d2c_footer_title{
    font-size: 1.25rem;
    margin-bottom: 1.25rem;
}
.d2c_footer ul li{
    font-family: var(--primary_font);
    margin: 0.375rem 0rem;
}
.d2c_footer ul li img{
    margin-right: 0.3125rem;
}
.d2c_footer ul li a{
    font-size: 1rem;
    font-weight: 400;
    color: #cfe5eb;
    transition: .4s all ease;
}
.d2c_footer ul li a:hover{
    color: var(--bs-white);
    transition: .4s all ease;
}
/* copyright */
.d2c_copyright{
    padding: 1rem 0rem;
    margin-top: 1.875rem;
}
.d2c_copyright .d2c_copyright_text{
    font-size: 0.875rem;
    font-family: var(--primary_font);
    color: #cfe5eb;
}
.d2c_copyright .d2c_copyright_text a{
    font-weight: 600;
    color: var(--bs-white);
}
.d2c_copyright .d2c_copyright_text a:hover{
    color: #212529;
}
.d2c_social_link a{
    background: var(--primary_shade_2);
    color: var(--bs-primary);
    display: inline-flex;
    width: 1.875rem;
    height: 1.875rem;
    align-items: center;
    justify-content: center;
    margin-left: 0.25rem;
    border-radius: var(--bs-border-radius);
    font-size: 0.875rem;
}
.d2c_social_link a:hover{
    background: var(--bs-secondary);
    color: var(--bs-white);
}
.d2c_copyright{
    border-color: #31a1bc !important;
}
/* ---------------------------------------------------
    advanced table page
----------------------------------------------------- */
#d2c_table_with_pagination_wrapper .dataTables_length,#d2c_table_with_pagination_wrapper .dataTables_filter,
#d2c_table_with_pagination_wrapper .dataTables_info,#d2c_table_with_pagination_search_wrapper .dataTables_info,
#d2c_table_with_pagination_search_wrapper .dataTables_length{
    display: none;
}
#d2c_table_with_pagination_wrapper div.dataTables_paginate ul.pagination{
    justify-content: flex-start;
}

@media only screen and (min-width: 0rem) and (max-width: 47.9375rem){
    .dataTables_filter{
        margin-top: 0.9375rem;
    }
    
}

.dt-button{
    background: transparent !important;
    border-color: var(--bs-primary) !important;
    color: var(--bs-primary) !important;
}
.dt-button:focus{
    box-shadow: none !important;
    outline: none !important;
}
.dt-button-active{
    box-shadow: none !important;
    outline: none !important;
    background: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
}

/*---------------------------------------------------
    invoice page
-----------------------------------------------------*/

.d2c_invoice_list {
    box-shadow: none;
}
.d2c_invoice_header hr {
    border-color: rgb(56 56 56 / 25%);
}
.d2c_invoice_header img {
    max-width: 9.375rem;
    object-fit: cover;
}
.d2c_invoice_content p {
    margin-bottom: 0.5rem;
}

/*---------------------------------------------------
    invoice page
-----------------------------------------------------*/
.d2c_card_subheading{
    font-size: 1.125rem;
    font-weight: 500;
}
.d2c_complain_right_column{
    width: 45%;
}

/*---------------------------------------------------
    create invoice page
-----------------------------------------------------*/
.d2c_product_form .form-check .form-control {
    width: max-content;
    background: var(--bs-white);
}

/*---------------------------------------------------
    advanced form page
-----------------------------------------------------*/

#d2c_form_step {
    max-width: 100%;
}
#d2c_form_step .d2c_step_form_header {
    gap: 0.3125rem;
    text-align: center;
    font-size: 0.9em;
}
#d2c_form_step .d2c_step_form_header .stepIndicator {
    position: relative;
    flex: 1;
    padding-bottom: 1.25rem;
}
#d2c_form_step .d2c_step_form_header .stepIndicator.active {
    font-weight: 700;
    color: var(--bs-primary);
}
#d2c_form_step .d2c_step_form_header .stepIndicator.finish {
    font-weight: 600;
    color: var(--bs-secondary);
}
#d2c_form_step .d2c_step_form_header .stepIndicator::before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    z-index: 9;
    width: 1.25rem;
    height: 1.25rem;
    background-color: #d7ddf6;
    border-radius: 50%;
    border: 0.1875rem solid #ecf5f4;
}
#d2c_form_step .d2c_step_form_header .stepIndicator.active::before {
    background-color: var(--bs-primary);
}
#d2c_form_step .d2c_step_form_header .stepIndicator.finish::before {
    background-color: var(--bs-success);
    border: 0.1875rem solid #bef2da;
}
#d2c_form_step .d2c_step_form_header .stepIndicator::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0.5rem;
    width: 100%;
    height: 0.0625rem;
    background-color: #f3f3f3;
}
#d2c_form_step .d2c_step_form_header .stepIndicator.active::after {
    background-color: var(--bs-primary);
}
#d2c_form_step .d2c_step_form_header .stepIndicator.finish::after {
    background-color: var(--bs-success);
}
#d2c_form_step .d2c_step_form_header .stepIndicator:last-child:after {
    display: none;
}
#d2c_form_step input,
#d2c_form_step textarea {
    width: 100%;
    background-color: rgba(246, 245, 255, 0.5);
    border: 0.063rem solid rgba(229, 227, 242, 0.5);
    border-radius: 0.313rem;
    padding: 0.5rem 1.25rem;
    color: rgba(56, 56, 56, 0.6);
    font-size: 0.875rem;
    font-weight: 400;
}
#d2c_form_step input:focus,
#d2c_form_step textarea:focus {
    border: 0.0625rem solid #009688;
    outline: 0;
}
#d2c_form_step input.invalid,
#d2c_form_step textarea.invalid {
    border-color: #ffaba5 !important;
}
#d2c_form_step .step {
    display: none;
}
#d2c_form_step .form-footer {
    overflow: auto;
    gap: 1.25rem;
}
#d2c_form_step .form-footer #prevBtn {
    background-color: #fff;
    color: var(--bs-primary);
}
.ck-editor__editable{
    height: 15.625rem;
}

/* multi step form validation */
.stepwizard-step p {
    margin-top: 0.625rem;
}
.stepwizard-row {
    display: table-row;
}
.stepwizard {
    display: table;
    position: relative;
}
.stepwizard-row:before {
    top: 1.25rem;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 0.0625rem;
    background-color: #ccc;
    z-index: 0;
}               
.stepwizard-step {                             
    display: table-cell;
    text-align: center;
    position: relative;
}
.btn-circle {
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    background: var(--bs-primary);
}

/* editor */
#editor {
    height: 25rem;
}

/*---------------------------------------------------
    timeline page start
-----------------------------------------------------*/
.d2c_timeline_upper {
    margin-bottom: 8.75rem;
}
.d2c_timeline_upper:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 0.125rem;
    background: var(--bs-primary);
    bottom: -4.375rem;
}
.d2c_timeline_content {
    width: 20%;
    position: relative;
}
.d2c_timeline_content::before {
    content: '';
    width: 0.0625rem;
    height: 3.125rem;
    position: absolute;
    left: 0rem;
    background: rgba(166, 170, 180, 0.3);
}
.d2c_timeline_upper .d2c_timeline_content::before {
    bottom: -3.3125rem;
}
.d2c_timeline_wrapper {
    padding: 1.875rem;
}
.d2c_timeline_wrapper .d2c_timeline_content::after {
    position: absolute;
    width: 1.5625rem;
    height: 1.5625rem;
    bottom: -5.125rem;
    left: -0.75rem;
    background: var(--bs-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--bs-white);
}
.d2c_timeline_upper .d2c_timeline_content:first-child::after {
    content: '2';
}
.d2c_timeline_upper .d2c_timeline_content:last-child::after {
    content: '4';
}
.d2c_timeline_down .d2c_timeline_content::before {
    top: -3.3125rem;
}
.d2c_timeline_down .d2c_timeline_content::after {
    top: -5.25rem;
    left: -0.75rem;
}
.d2c_timeline_down .d2c_timeline_content:first-child::after {
    content: '1';
}
.d2c_timeline_down .d2c_timeline_content:nth-child(2)::after {
    content: '3';
}
.d2c_timeline_down .d2c_timeline_content:last-child::after {
    content: '5';
}

/* web journey timeline */
.d2c_web_journey_timeline {
    padding: 1.875rem;
}
.d2c_web_timeline_content {
    position: relative;
}
.d2c_web_timeline_content .d2c_years {
    font-weight: 500;
    font-size: 1rem;
    line-height: 150%;
    position: absolute;
    top: 1.25rem;
    right: -1.75rem;
}
.d2c_web_timeline_content p i {
    font-size: 0.5rem;
    border: 0.0625rem solid var(--bs-primary);
    color: var(--bs-primary);
    border-radius: 3.125rem;
    padding: 0.1875rem;
}
.d2c_web_timeline_content p sup {
    top: -0.1875rem;
    z-index: 11;
}
.d2c_web_timeline_content .d2c_card_wrapper {
    padding: 1.25rem;
    padding-left: 6.25rem;
    padding-right: 6.25rem;
    position: relative;
}
.d2c_web_journey_timeline .d2c_web_timeline_content:first-child::after,
.d2c_web_journey_timeline .d2c_web_timeline_content:nth-child(3)::after {
    content: '';
    width: 0.0625rem;
    height: 100%;
    background: var(--bs-primary);
    position: absolute;
    right: -0.5rem;
    top: 1.875rem;
    z-index: 0;
}
.d2c_web_journey_timeline .d2c_web_timeline_content:nth-child(4) .d2c_years {
    left: -0.75rem;
}
/*---------------------------------------------------
    timeline page end
-----------------------------------------------------*/

/*---------------------------------------------------
    button page
-----------------------------------------------------*/
.d2c_hover_btn {
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 0.5rem 1.25rem;
    border-radius: 0.938rem;
    text-align: center;
    border: 0.0625rem solid var(--bs-primary);
    color: var(--bs-primary);
    z-index: 0;
    background: var(--bs-white);
} 
.d2c_hover_btn:hover{
    color: var(--bs-white);
    border-color: var(--bs-primary);
}
.d2c_hover_btn::before,.d2c_hover_btn::after{
    position: absolute;
    content: "";
    background: var(--bs-primary);
    transition-duration: 0.3s;
    z-index: -1;
    opacity: 1;
}
/* top */
.btn_fill_top::before {
    inset: auto auto 0rem 0rem;
    width: 100%;
    height: 0rem;
} 
.btn_fill_top:hover::before {
    width: 100%;
    height: 100%;
    opacity: 1;
} 
/* right */
.btn_fill_right::before {
    inset: 0rem auto auto 0rem;
    width: 0rem;
    height: 100%;
} 
.btn_fill_right:hover::before {
    width: 100%;
    height: 100%;
    opacity: 1;
} 
/* down */
.btn_fill_down::before {
    inset: 0rem auto auto 0rem;
    width: 100%;
    height: 0rem;
} 
.btn_fill_down:hover::before {
    width: 100%;
    height: 100%;
    opacity: 1;
} 
/* left */
.btn_fill_left::before {
    inset: 0rem 0rem auto auto;
    width: 0rem;
    height: 100%;
} 
.btn_fill_left:hover::before {
    width: 100%;
    height: 100%;
    opacity: 1;
} 
/* middle */
.btn_fill_middle::before {
    inset: auto auto 0rem 0rem;
    width: 100%;
    height: 0rem;
} 
.btn_fill_middle:hover::before {
    width: 100%;
    height: 50%;
    opacity: 1;
} 
.btn_fill_middle::after {
    inset: 0rem auto auto 0rem;
    width: 100%;
    height: 0rem;
} 
.btn_fill_middle:hover::after {
    height: 50%;
} 
/* horizontal middle */
.btn_fill_middle_horizontal::before {
    inset: 0rem 0rem auto auto;
    width: 0rem;
    height: 100%;
} 
.btn_fill_middle_horizontal:hover::before {
    width: 50%;
    height: 100%;
    opacity: 1;
} 
.btn_fill_middle_horizontal::after {
    inset: 0rem auto auto 0rem;
    width: 0rem;
    height: 100%;
} 
.btn_fill_middle_horizontal:hover::after {
    width: 50%;
} 

/* details button css */
/* detail top */
.d2c_detail_btn {
    position: relative;
    box-sizing: border-box;
    display: inline-block;
    overflow: hidden;
    padding: 0.5rem 1.25rem;
    margin: 0rem 0.1875rem 0.375rem;
    text-align: center;
    border: none;
    text-decoration: none;
    background: var(--bs-white);
    color: var(--bs-primary);
    white-space: nowrap;
    border-radius: 0.25rem;
    z-index: 0;
} 
.d2c_detail_btn::after{
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 0.25rem;
    content: "";
    border: 0.125rem solid var(--bs-primary);
    z-index: 2;
    margin: 0rem;
    transition: border-bottom-width 0.1s ease 0.2s, height 0.2s ease 0.1s, width 0.2s ease 0s, margin 0.2s ease 0s;
}
.d2c_detail_top {
    position: relative;
    transition-duration: 0.3s;
    overflow: visible;
    box-sizing: border-box;
    border: none;
    padding: 0.625rem 1.375rem;
} 
.d2c_detail_top::after {
    top: 0rem;
    right: 0rem;
    border-bottom-width: 0.125rem;
} 
.d2c_detail_top:hover::after {
    width: 60%;
    height: 0rem;
    border-width: 0.125rem 0.125rem 0rem;
    margin: 0rem 20%;
    transition: border-bottom-width 0.1s ease 0s, height 0.2s ease 0.1s, width 0.2s ease 0.2s, margin 0.2s ease 0.2s;
} 
/* detail right */ 
.d2c_detail_right::after{
    bottom: 0rem;
    right: 0rem;
    border-left-width: 0.125rem;
    transition: border-left-width 0.1s ease 0.2s, width 0.2s ease 0.1s, height 0.2s ease 0s, margin 0.2s ease 0s;
}
.d2c_detail_right:hover::after {
    width: 0rem;
    height: 60%;
    border-width: 0.125rem 0.125rem 0.125rem 0rem;
    margin: 5% 0rem;
    transition: border-left-width 0.1s ease 0s, width 0.2s ease 0.1s, height 0.2s ease 0.2s, margin 0.2s ease 0.2s;
} 
/* detail bottom */
.d2c_detail_bottom::after{
    left: 0rem;
    bottom: 0rem;
    border-top-width: 0.125rem;
    transition: border-top-width 0.1s ease 0.2s, height 0.2s ease 0.1s, width 0.2s ease 0s, margin 0.2s ease 0s;
}
.d2c_detail_bottom:hover::after {
    width: 60%;
    height: 0rem;
    border-width: 0rem 0.125rem 0.125rem;
    margin: 0rem 20%;
    transition: border-top-width 0.1s ease 0s, height 0.2s ease 0.1s, width 0.2s ease 0.2s, margin 0.2s ease 0.2s;
} 
/* detail bottom */
.d2c_detail_left::after{
    bottom: 0rem;
    left: 0rem;
    border-right-width: 0.125rem;
    transition: border-right-width 0.1s ease 0.2s, width 0.2s ease 0.1s, height 0.2s ease 0s, margin 0.2s ease 0s;
}
.d2c_detail_left:hover::after {
    width: 0rem;
    height: 60%;
    border-width: 0.125rem 0rem 0.125rem 0.125rem;
    margin: 5% 0rem;
    transition: border-right-width 0.1s ease 0s, width 0.2s ease 0.1s, height 0.2s ease 0.2s, margin 0.2s ease 0.2s;
} 
/*---------------------------------------------------
    Map page
-----------------------------------------------------*/
.d2c_map {
    width: 80% !important;
    height: 21.875rem;
    margin: 0 auto;
}
.d2c_map svg path {
    fill: var(--bs-primary);
}

/* ---------------------------------------------------
    faq page
----------------------------------------------------- */

.d2c_faq_main {
    box-shadow: 0px 0px 0.5rem rgba(0, 0, 0, 0.07);
    border-radius: 0.313rem;
    margin-bottom: 20px;
}
.accordion-button {
    font-size: 1.125rem;
    font-weight: 500;
    color: var(--bs-secondary);
    border-radius: 0.625rem 0.625rem 0rem 0rem;
    box-shadow: none !important;
    padding-right: 2.813rem;
}
.accordion-button:focus {
    box-shadow: none;
}
.accordion-button:not(.collapsed) {
    background: var(--bs-white);
    color: var(--bs-primary);
}
.accordion-item {
    border: 0.063rem solid rgba(229, 227, 242, 0.5) !important;
    border-radius: 0.625rem;
    overflow: hidden;
    background: rgba(246, 245, 255, 0.5);
}
.accordion-body {
    border-top: 0.063rem solid rgba(229, 227, 242, 0.5);
}
.accordion .accordion-item:last-child {
    margin-bottom: 0rem !important;
}
.accordion-item .accordion-button::after {
    content: '\002B';
    background-image: none;
    font-weight: 600;
    color: var(--primary_color);
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    border: 1.008px solid var(--bs-secondary);
    background: #fff;
    text-align: right;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 15.008px;
    border-radius: 50%;
}
.accordion-item .accordion-button:not(.collapsed)::after {
    content: '\002D';
    color: var(--text_color);
    background-image: none;
    border-color: var(--text_color);
}

/*---------------------------------------------------
    login system(login,registration,forget),lock-screen page
-----------------------------------------------------*/

.d2c_login_system {
    height: 100vh;
}
.d2c_sign_up{
    height: auto;
}
.d2c_login_wrapper {
    padding: 3.75rem 4.6875rem;
    background: var(--bs-white);
}
.d2c_login_wrapper h4 {
    font-weight: 600;
    color: var(--bs-primary);
}
.d2c_login_wrapper .d2c_link {
    font-weight: 600;
}
.d2c_login_wrapper .input-group .btn {
    border: none;
    font-size: 0.875rem;
    padding: 11.008px 15.008px;
    color: var(--bs-secondary);
}
.d2c_login_left,.d2c_login_right_image{
    min-height: 100vh;
}
.d2c_login_right_image{
    background-color: rgba(15, 152, 184, 1);
    background-image: url(../images/login_bg_shape.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.d2c_login_wrapper .input-group .btn:active {
    border-color: rgba(111, 106, 248, 0.1) !important;
    background: rgba(246, 245, 255, 0.5);
}
.d2c_login_wrapper .input-group {
    border: 0.0625rem solid var(--primary_border);
    border-radius: var(--bs-border-radius);
}
.d2c_login_wrapper .input-group:focus {
    border-color: rgb(13 16 36 / 20%);
}
.d2c_login_wrapper .input-group .btn {
    z-index: 10;
}
.d2c_login_wrapper .btn {
    border-radius: var(--border-radius);
    padding: 0.625rem 0.625rem 0.5625rem 0.625rem;
}
.d2c_login_wrapper .d2c_link_btn {
    border-radius: 0.313rem;
    padding: 0.5rem 1.25rem;
    border: 0.0625rem solid var(--primary_border);
    color: var(--bs-secondary);
    font-size: 0.938rem;
    font-weight: 500;
    border-radius: var(--border-radius);
}
.d2c_login_wrapper .d2c_link_btn:hover {
    color: var(--bs-primary) !important;
}
.d2c_login_wrapper .d2c_link_btn:active {
    border-color: rgba(166, 170, 180, 0.3) !important;
}
.d2c_lockscreen {
    background-color: rgba(15, 152, 184, 1);
    background-image: url(../images/login_bg_shape.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 100vh;
}
.d2c_lockscreen .d2c_user_avatar {
    width: 7.5rem;
    height: 7.5rem;
    border-radius: 50%;
    margin: 0rem auto 1.25rem auto;
}
.d2c_lockscreen_content .form-control {
    background: rgba(255, 255, 255, 0.1);
    border: 0.0625rem solid rgba(255, 255, 255, 0.3);
    backdrop-filter: blur(0.1563rem);
    color: var(--bs-white);
}
.d2c_lockscreen_content .btn {
    border-radius: var(--border-radius);
    padding: 0.625rem 0.625rem 0.5625rem 0.625rem;
}
.d2c_lockscreen_content .form-control::placeholder {
    color: rgba(255, 255, 255, 0.8);
}
.form-control.is-invalid,
.was-validated .form-control:invalid {
    border-color: var(--primary_border);
}

/* ---------------------------------------------------
    error page
----------------------------------------------------- */

.d2c_error {
    background-color: rgba(15, 152, 184, 1);
    background-image: url(../images/login_bg_shape.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 100vh;
}
.d2c_error_content h1 {
    font-size: 9.375rem;
}
.d2c_error_content h3 {
    font-size: 2.5rem;
    font-weight: 600;
    color: var(--secondary_shade_1);
}
.d2c_error_content p {
    font-size: 1.125rem;
}

/*---------------------------------------------------
    ammChart page
-----------------------------------------------------*/
.d2c_am_charts{
    height: 21.875rem;
}

/*---------------------------------------------------
    card page
-----------------------------------------------------*/

.d2c_nft_card {
    border-radius: 0.5rem;
    background: var(--bs-white);
}
.d2c_nft_card .card-body{
    border-radius: 0rem 0rem 0.5rem 0.5rem;
}
.d2c_nft_card .d2c_small_btn{
    padding: 0.1875rem 0.625rem 0.1875rem;
    border-radius: 0.5rem;
    font-weight: 400;
    font-size: 0.875rem;
}
.d2c_nft_card_image_top {
    height: 17.1875rem;
    width: 100%;
    border-radius: 0.5rem;
    overflow: hidden;
}
.d2c_nft_card_image_top img {
    transform: scale(1.0);
    object-fit: cover;
    transition: all ease 0.4s;
}
.d2c_nft_card:hover .card-img-top {
    transform: scale(1.1);
    transition: all ease 0.4s;
}
.d2c_author_description img {
    width: 3.5rem;
    height: 3.5rem;
    object-fit: cover;
    border-radius: 0.5rem;
}
.d2c_author_description h6 {
    font-weight: 500;
    font-size: 0.875rem;
    display: inline;
    margin-left: 0.625rem;
}

/* upcoming card item */
.d2c_upcoming_nft_card {
    padding: 1.875rem;
}
.d2c_nft_img_wrapper {
    height: 18.75rem;
    border-radius: 0.5rem;
}
.d2c_nft_img_wrapper img {
    border-radius: 0.5rem;
    object-fit: cover;
}
.d2c_upcoming_btn {
    position: absolute;
    top: 0.625rem;
    left: 0.625rem;
    transition: all ease 0.4s;
}
.d2c_upcoming_nft_card .card-body {
    margin-top: 3.5rem;
}
.d2c_countdown_wrapper{
    display: flex;
    margin-top: -0.625rem;
    gap: 0.625rem;
    justify-content: center;
}
.d2c_counter_element {
    width: max-content;
    display: flex;
    flex-direction: column;
    position: relative;
}
.d2c_number_wrapper {
    background-color: var(--bs-primary);
    border-radius: 0.25rem;
    width: 3.125rem;
    height: 2.5rem;
    margin-bottom: 0.25rem;
    overflow: hidden;
}
.counter-animate {
    animation: slideInFromTop 0.5s ease-in-out;
}
.show {
    opacity: 1;
}

@keyframes slideInFromTop {
    from {
        transform: translateY(-80%);
        opacity: 0;
    }
    to {
        transform: translateY(0%);
        opacity: 1;
    }
}
/* nft collection card item 4 */

.d2c_collection_img_wrapper {
    overflow: hidden;
    max-height: 14.375rem;
}
.d2c_collection_img_wrapper img {
    object-fit: cover;
    transform: scale(1.0);
    transition: all ease 0.4s;
}
.d2c_collection_card:hover .d2c_collection_img_wrapper img {
    transform: scale(1.1);
    transition: all ease 0.4s;
}
.d2c_collection_card .card-body img {
    width: 6.25rem;
    height: 6.25rem;
    display: block;
    margin: -4.8125rem auto 0.625rem;
    border-radius: 50%;
    position: relative;
}

/* live action card item */
.d2c_live_action_card {
    padding: 1.875rem;
}
.d2c_live_action_card .card-body{
    margin-top: 3.5rem;
}
.d2c_author_description a img{
    width: 1.875rem;
    height: 1.875rem;
    object-fit: cover;
    margin-left: -0.9375rem;
}
.d2c_author_description a img:hover{
    z-index: 9999;
}
.d2c_author_description a:first-child img{
    margin-left: 0rem;
}

/* creator card item */
.d2c_creator_card{
    background: #f6f5ff;
    border: 0.0625rem solid rgba(255, 255, 255, 0.12);
    padding: 1.25rem;
}
.d2c_creator_card img{
    object-fit: cover;
    width: 3.75rem;
    height: 3.75rem;
}


/* ========================== bottom to top scroll start ============================ */
#scrollToTopBtn{
    display: none;

}
#scrollToTopBtn a{
    text-decoration: none;
}
#scrollToTopBtn a i{
    background: var(--bs-primary);
    box-shadow: 0rem 0rem 1.25rem rgb(0 0 0 / 15%);
    font-size: 1.25rem;
    color: var(--bs-white);
    border-radius: 4px;
    width: 2.188rem;
    height: 2.188rem;
    position: fixed;
    z-index: 9999;
    bottom: 6.5%;
    right: 5%;
    transition: 0.4s all ease;
    display: flex;
    align-items: center;
    justify-content: center;
}
#scrollToTopBtn a i:hover{
    background: var(--bs-secondary);
    transition: 0.4s all ease;
}

/* 
Template Name: {{AIinsights - Data Insights Dashboard Template}}
Template URL: {{https://www.designtocodes.com/product/aiinsights-data-insights-dashboard-template/}}
Description: {{AIinsights is a professional and developer-friendly data insights dashboard template. The insights dashboards help you turn raw data from users into meaningful insights. }}
Author: DesignToCodes
Author URL: https://www.designtocodes.com
Text Domain: {{ Aiinsights }}
*/