.donate-banner {
    width: 100%;
    height: 500px;
    background-repeat: no-repeat;
    background-size: contain;
}
.box-wrapper-container { 
    /*margin: auto;
     /*margin-top: -60px;*/
    z-index: 9;
    /*max-width: 1300px;*/ 
    background: #f5f5f5;
    margin-bottom: 5rem;
} 
.header-title h5 {
    font-size: 20px;
    font-weight: 700;
    color: #617c94;
}
.header-title {
    padding: 10px 20px 5px;
    border-bottom: 1px dashed #cdcdcd;
}
.box-heeder-wrapper {
    background: #fff;
    margin-bottom: 2rem;
}
.sub-breadcums {
    padding: 0px;
    font-size: 14px;
    color: #123f46;
    display: flex;
    align-items: center;
    gap: 0;
    border-bottom: 1px dashed #dededd;
    overflow: auto;
    width: 100%;
}
.sub-breadcums span {
    color: #306e9d;
    padding: 7px 10px;
    border: 1px solid #e9e9e9;
    background: #fff;
    white-space: normal;
    display: grid;
    align-items: center;
    justify-content: center;
    flex: 1 1 16.66%;
    min-width: 150px;
    box-sizing: border-box;
    padding: 10px;
    border: 1px solid #ccc;
    min-height: 140px;
}
.sub-breadcums span.active {
    background: #e8e8e8; 
} 
.sub-breadcums span img {
    width: 35px;
    min-width: 35px;
}
.sub-breadcums span a {
    /*color: #306e9d;*/
    color:#626264 !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    white-space: normal;     
    text-align: center; 
    font-size: 14px;
    font-weight: 700;
}
.sub-breadcums span img {
    margin-bottom: 10px;
    top: 55px;
}
.steps-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.step-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
}   
.step-no {
    background: #656565;
    padding: 10px;
    border: 2px solid #ffffff;
    color: white;
    border-radius: 50px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1px;
    outline: 2px solid #656565;
}
.step-no.active {
    background: #113f43; 
    border: 2px solid #ffffff;
    color: white; 
    outline: 2px solid #113f43;
}
.step-title {
    margin-top: 10px;
    font-size: 13px;
    color: #5c5c5c;
}
.icon-step-wrap img {
    width: 35px;
}


.button-group-pills .btn {
    border-radius: 0px;
    line-height: 1.2;
    margin-bottom: 15px;
    margin-left: 10px;
    border-color: #e8e8e8;
    background-color: #e8e8e8;
    color: #306e9d;
    min-width: 152px;
    font-size: 14px;
    padding-block: 12px;
    display: flex;
    font-weight: 700;
    align-items: center;
    position: relative;
  } 
  .button-group-pills .btn:before {
    content: '';
    background: #ffffff;
    width: 15px;
    height: 15px;
    border-radius: 50px;
    position: absolute;
    top: 11px;
    left: -10px;
}
span.circle-border { 
    border: 2px solid #306e9d;
    width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 50px;
    min-width: 15px;
    margin-right: 10px;
}
.button-group-pills .btn:after {
    content: '';
    background: #ffffff;
    width: 15px;
    height: 15px;
    border-radius: 50px;
    position: absolute;
    top: 11px;
    right: -10px;
}
  .button-group-pills .btn.active {
    border-color: #306e9d;
    background-color: #306e9d;
    color: #FFF;
    box-shadow: none;
}
.button-group-pills .btn.active .circle-border {
    border: 2px solid white;
}
  [data-toggle=buttons]>.btn input[type=checkbox], [data-toggle=buttons]>.btn input[type=radio], [data-toggle=buttons]>.btn-group>.btn input[type=checkbox], [data-toggle=buttons]>.btn-group>.btn input[type=radio] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}
.button-group-pills {
    display: flex;
    flex-wrap: wrap; 
} 
.card-boxer {
    margin: auto; 
    background: white;
    max-width: 1200px; 
    border-bottom: 1px dashed #c8c8c8;
}
.card-header-box {
    padding: 10px 15px;
    background: #e8e8e8;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.card-price-list {
    padding: 20px 30px 20px;
}
.other-card-amount .form-control {
    background: white;
    border-bottom: 2px solid #bbc0c1;
    max-width: 355px;
    margin: auto;
    border-radius: 0px;
    font-size: 15px;
    margin-block: 10px;
    text-align: center;
}
.form-control-checkbox {
    display: flex;
    align-items: center;
    justify-content: center;
}
.form-control-checkbox input.form-control {
    margin: 0;
    max-width: max-content;
}
.form-control-checkbox label {
    margin-bottom: 0px;
    margin-left: 10px;
    font-size: 12px;
    font-weight: 800;
}
.card-header-box h5 {
    margin-bottom: 0px;
    font-size: 15px;
    font-weight: 600;
    color: #306e9d;
}
  .wrapper-radio .title{
    color: #fff;
    line-height: 65px;
    text-align: center;
    background: #333;
    font-size: 25px;
    font-weight: 500;
    border-radius: 10px 10px 0 0;
  }
  .wrapper-radio .box{
    padding: 20px 30px;
    border-radius: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    border-bottom: 1px dashed #cecece;
  }
  .wrapper-radio .box label{
    display: flex;
    height: auto;
    width: auto;
    align-items: center;
    border: 1px solid #e8e8e8;
    border-radius: 50px;
    padding: 4px 10px;
    cursor: default;
    transition: all 0.3s ease;
    margin-bottom: 0px;
    background: #e8e8e8;
    min-width: 180px;
  }
  #option-1:checked ~ .option-1,
  #option-2:checked ~ .option-2,
  #option-3:checked ~ .option-3,
  #option-4:checked ~ .option-4,
  #option-5:checked ~ .option-5,
  #option-6:checked ~ .option-6,
  #option-7:checked ~ .option-7{
    background: #306e9d;
    border-color: #306e9d;
  }
  .wrapper-radio .box label .dot{
    height: 15px;
    width: 15px;
    background: #fff;
    border-radius: 50%;
    position: relative;
    transition: all 0.3s ease;
    border: 2px solid #306e9d;
  }
  #option-1:checked ~ .option-1 .dot,
  #option-2:checked ~ .option-2 .dot,
  #option-3:checked ~ .option-3 .dot,
  #option-4:checked ~ .option-4 .dot,
  #option-5:checked ~ .option-5 .dot,
  #option-6:checked ~ .option-6 .dot,
  #option-7:checked ~ .option-7 .dot{
    background: #fff;
  }
  .box label .dot::before{
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(2);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    transition: all 0.3s ease;
  }
  #option-1:checked ~ .option-1 .dot::before,
  #option-2:checked ~ .option-2 .dot::before,
  #option-3:checked ~ .option-3 .dot::before,
  #option-4:checked ~ .option-4 .dot::before,
  #option-5:checked ~ .option-5 .dot::before,
  #option-6:checked ~ .option-6 .dot::before,
  #option-7:checked ~ .option-7 .dot::before{
    background: #306e9d;
    transform: translate(-50%, -50%) scale(1);
  }
  .wrapper-radio .box label .text{
    color: #306e9d;
    font-size: 14px;
    font-weight: 600;
    padding-left: 10px;
    transition: color 0.3s ease;
  }
  #option-1:checked ~ .option-1 .text,
  #option-2:checked ~ .option-2 .text,
  #option-3:checked ~ .option-3 .text,
  #option-4:checked ~ .option-4 .text,
  #option-5:checked ~ .option-5 .text,
  #option-6:checked ~ .option-6 .text,
  #option-7:checked ~ .option-7 .text{
    color: #fff;
  }
  .wrapper-radio .box input[type="radio"]{
    display: none;
  }
  .wrapper-radio-label label {
    font-size: 14px;
    padding-left: 30px;
    margin-top: 15px;
    color: #306e9d;
    font-weight: 800;
}
.wrapper-form .form-group {
    display: flex;
    align-items: center;
}
.wrapper-form label {
    margin-bottom: 0px;
    min-width: 100px;
    color: #416e9d;
    font-weight: 700;
    font-size: 14px;
} 
.wrapper-form select {
    background: #ffffff;
    color: #2e2e2e;
    border: none !important;
    padding: 5px 10px;
    font-size: 13px;
    border-radius: 0;
    min-width: 100px;
    border-bottom: 1px solid #afbec0 !important;
}
.wrapper-form .form-control {
    background: #ffffff;
    border-radius: 0 !important;
    font-size: 13px;
    border: none !important;
    border-bottom: 1px solid #afbec0 !important;
    padding-left: 0px !important;
    color: #606061 !important;
    box-shadow: none;
    outline: none;
}
.wrapper-form .form-control::placeholder {
    color: #d7d8da !important;
    font-weight: 600;
}
.radio-button-wrap.wrapper-form .form-group {
    display: flex;
    align-items: center; 
}   
.font-10 { 
    font-size: 10px;
}   
.font-14 { 
    font-size: 14px;
}   
.h5-title-card h5 {
    font-size: 14px;
    color: #306e9d;
    font-weight: 700;
}
.capcha-form {
    display: flex;
    align-items: center;
    gap: 20px;
}
.capcha-wrapper {
    display: flex;
    gap: 15px;
    font-size: 14px;
    font-weight: 600;
    color: #306e9d;
}
.capcha-form input.form-control {
    border: 1px solid #dcdcdc;
    border-radius: 50px;
    text-align: center;
    color: black !important;
}
.card-price-footer {
    background: #efefef;
    padding-block: 1rem;
    padding-inline: 40px;
    border-top: 1px dashed #d8d8d8;
    border-bottom: 1px dashed #d4d9dc;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
button.btn.btn-green {
    font-size: 16px;
    background: #24a845;
    color: white;
    border-radius: 40px;
    padding-inline: 30px;
    padding-block: 10px;
}
.certificates-wrapper .slick-prev:before, .certificates-wrapper .slick-next:before {
    color: #cbcbcd !important;
}
.equipmentdiv {
    margin-top: 25px;
    background: #fff;
    margin-inline: 30px;
    padding-bottom: 20px;
}
.notes-wrapper .donation-note {
    font-size: 12px;
    color: #306d9b;
    font-weight: 500;
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
}
.notes-wrapper .donation-note:before {
    content: '';
    background: #306d9b;
    width: 6px;
    min-width: 6px;
    height: 6px;
    border-radius: 50px;
    display: inline-block;
}
h2.wire-heading {
    font-size: 20px;
    font-weight: 700;
    color: #306e9d;
}
section.notes-wrapper {
    color: #306d9b;
}
.model-image-card .img-responsive {
    width: 100px;
}
.model-image-card {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.modal-footer button.btn.btn-primary {
    background-color: #24a845;
    border-color: #24a845;
}
.modal-footer button.btn.btn-secondary {
    background-color: #ffffff;
    border-color: #24a845;
    color: #24a845;
}
.check-icon {
    width: 13px;
}
.model-image-card .certificate-card-wrapper.certificate-item {
    border: 1px solid #eeeeee;
}
.wrapper-form .form-control:focus {
    box-shadow: none;
    outline: none;
    border: none;
    border-bottom: 1px solid #3b719b;
}
.display-image.popup-model {
    position: absolute;
    top: 0;
    z-index: 9;
}
.preview-cards-model .close {
    z-index: 99;
    margin: 10px;
    position: absolute;
    top: 0;
    right: 0;
}
.preview-wrapper {
    z-index: 99;
    position: relative;
    text-align: left;
    margin: 20rem 5rem;
}
/*.preview-item {
    color: green;
    font-weight: 600;
} */

.certificate-single .img-responsive {
    width: 105px;
    z-index: 9;
    position: relative;
}

.certificate-card-wrapper {
    margin-inline: 10px;
    background: white;
    padding: 10px;
}

.carousel.certificates-carousel.slick-initialized.slick-slider.slick-dotted {
    background: #f3f3f3;
    padding: 10px;
}

figure.certificate-single {
    margin-bottom: 0px;
}

.certificates-carousel .slick-prev.slick-arrow {
    left: -15px;
}

.certificates-wrapper {
    background: #e6f2fe;
    padding: 10px;
}

.view-all-text {
    font-size: 14px;
    color: #3b719b;
    margin-top: 15px;
    margin-bottom: 10px;
    font-weight: 600;
}

.certificates-carousel .slick-prev.slick-arrow {
    left: 0;
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    border: 2px solid #cbcbcd;
    width: 30px;
    height: 30px;
}

.certificates-carousel .slick-next.slick-arrow {
    right: 0;
    z-index: 99;
    border: 2px solid #cbcbcd;
    width: 30px;
    height: 30px;
    background: white;
}

.edit-card-form-wrapper {
    padding: 20px 10px;
}

.btn-primary-preview {} 

.input-with-select {
    display: flex;
    gap: 10px;
}

@media (min-width: 576px) {
    .preview-cards-model .modal-dialog {
        max-width: 700px; 
    } 
	
}
.amount_text_child{text-align: center;}

@media(max-width:576px) {
    .radio-button-wrap.wrapper-form .form-group.checkbox-input-form {
        flex-wrap: nowrap;
    }
    .button-group-pills .btn { 
        min-width: 45%;
        margin: 0 auto 10px;
        font-size: 12px;
      } 
      .donate-banner { 
          height: 300px; 
      }
      .card-price-list .wrapper-radio .box {
        padding: 0;
        justify-content: flex-start !important;
     }
     .card-price-footer { 
        gap: 20px;    
        flex-wrap: wrap;
    }
    .card-price-footer button {
        margin-bottom: 1rem;
    }
    .capcha-wrapper { 
        flex-direction: column;
    } 
    .radio-button-wrap.wrapper-form .form-group {  
        flex-wrap: wrap;
    }
    .equipmentdiv { 
        margin-inline: 10px; 
    }
    .sub-breadcums span a { 
        font-size: 12px; 
    }
    }
    
    
  @media (min-width: 576px) and (max-width: 767px) { 
    .radio-button-wrap.wrapper-form .form-group.checkbox-input-form {
        flex-wrap: nowrap;
    }
    .button-group-pills .btn { 
        min-width: 45%;
        margin: 0 auto 10px;
        font-size: 12px;
      } 
      .donate-banner { 
          height: 300px; 
      }
      .card-price-list .wrapper-radio .box {
        padding: 0;
        justify-content: flex-start !important;
     }
     .card-price-footer { 
        gap: 20px;    
        flex-wrap: wrap;
    }
    .card-price-footer button {
        margin-bottom: 1rem;
    }
    .capcha-wrapper { 
        flex-direction: column;
    } 
    .radio-button-wrap.wrapper-form .form-group {  
        flex-wrap: wrap;
    }
    .equipmentdiv { 
        margin-inline: 10px; 
    }
    .sub-breadcums span a { 
        font-size: 12px; 
    }
}
.error, label.error {
    float: none;
    font-weight: 400;
    border: none;
    background: none;
    color: red;
}
.main_wrapper_s{display: none;}
.spclbtn{font-size: 24px !important;}

 @media only screen and (max-width: 767px){
	.preview-item {
		font-size: 9px !important;
	}
	.preview-wrapper{
		margin: 36% 11% !important;
		width: 50%;
	}
}
.preview-item {
    color: #c91552;
    font-weight: 600;
    margin-top: -25%;
    text-align: center;
}
.crt_occasion{
	font-weight:bolder;
	
}
.crt_donate_amt{
	font-weight:bolder;
}
.crt_honor_name{
	font-weight:bolder;
}
.preview-wrapper {
    z-index: 99;
    position: relative;
    text-align: left;
    margin: 40% 11%;
	width: 45%;
}
/*added by laxmi*/
#option-dt1:checked ~ .option-dt1, #option-dt2:checked ~ .option-dt2, #option-dt3:checked ~ .option-dt3, #option-dt4:checked ~ .option-dt4, #option-dt5:checked ~ .option-dt5, #option-dt6:checked ~ .option-dt6, #option-dt7:checked ~ .option-dt7 {
    background: #306e9d;
    border-color: #306e9d;
}
#option-dt1:checked ~ .option-dt1 .dot, #option-dt2:checked ~ .option-dt2 .dot, #option-dt3:checked ~ .option-dt3 .dot, #option-dt4:checked ~ .option-dt4 .dot, #option-dt5:checked ~ .option-dt5 .dot, #option-dt6:checked ~ .option-dt6 .dot, #option-dt7:checked ~ .option-dt7 .dot
{
    background: #fff;
}
#option-dt1:checked ~ .option-dt1 .text, #option-dt2:checked ~ .option-dt2 .text, #option-dt3:checked ~ .option-dt3 .text, #option-dt4:checked ~ .option-dt4 .text, #option-dt5:checked ~ .option-dt5 .text, #option-dt6:checked ~ .option-dt6 .text, #option-dt7:checked ~ .option-dt7 .text
{
    color: #fff;
}
#option-dt1:checked ~ .option-dt1 .dot::before, #option-dt2:checked ~ .option-dt2 .dot::before, #option-dt3:checked ~ .option-dt3 .dot::before, #option-dt4:checked ~ .option-dt4 .dot::before, #option-dt5:checked ~ .option-dt5 .dot::before, #option-dt6:checked ~ .option-dt6 .dot::before, #option-dt7:checked ~ .option-dt7 .dot::before
{
    background: #306e9d;
    transform: translate(-50%, -50%) scale(1);
}
.sub-breadcums span:hover{
	/*background: #e6f5ff;*/
	background:#21a743;
	color:#024e92 !important;
}
.sub-breadcums span a:hover{
    color:#fff !important;
}
.btn:hover
 {
    color: #fff !important;
    text-decoration: none;
    background: #24a845 !important;
    border: 2px solid #24a845;
}