@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Devanagari:wght@100..900&family=Vesper+Libre:wght@400;500;700&display=swap');
body{font-family: 'Poppins', sans-serif;color: #222528;font-size:15px;line-height:26px;font-weight:300;overflow-x: hidden; text-align: center}
.h-txt{font-family: "Noto Sans Devanagari", serif; font-size:120%}
a{outline:none !important; cursor: pointer; color: #333; text-decoration: none;}
a:hover{text-decoration: underline;color: #333; cursor: pointer}
h1,h2,h3,h4,h5{font-family: 'Poppins', monospace; font-weight: bold;}
b, strong{font-weight: 700}
img{max-width: 100%;}
p{line-height:28px;font-size: 18px;font-weight:400;}

/*
::selection {background:#444; color:#fff}
::-moz-selection {background:#444; color:#fff}
*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type=number] { -moz-appearance:textfield;}x
select{cursor: pointer}

/*Custom buttons*/
.btn{transition:.3s all; border-width: 1px; font-size: 16px; border-color:transparent; padding:8px 18px; text-decoration: none !important; letter-spacing: .02em;}
.btn-lg{font-size: 18px; margin: 0 3px; line-height: 32px;}
.btn-lg .bx{font-size: 22px; position: relative; top: 2px;}
.btn-dark{background: #cf4520;color: #ffffff;}
.btn-dark:hover, .btn-dark:focus{color:#fff; background: #bf320d}

/*Box section*/
.wbox{border: 1px solid #eee; box-shadow: 0 2px 12px rgba(0,0,0,.1); border-radius: 10px; background: #fafafa; padding: 25px; min-height: 100px}
.wbox.white{background: #fff}

/*Banner*/
.banner{padding-top: 80px; min-height: 300px; text-align: left; background: url(../images/bg.jpg); background-size: cover; background-position: bottom; position: relative}
.banner .col-6{padding: 0}
.banner h3{color:#44333b;font-size: 35px;font-weight: 900; margin-top: 50px}
.banner img{max-width: 400px}

/*donate via*/
.yagya {margin-top:-20px; padding-bottom: 25px; bottom: 0; width: 100%;}
.yagya .wbox{padding: 40px; text-align: center; margin-top: -160px}
.yagya h4{display: inline-block; color: #222528;font-size: 26px; padding: 0 0 12px; width: max-content; margin: 30px 10px 20px; max-width: 100%; line-height: 36px}
.yagya h5{font-size: 1.2rem;color: #000;}
.yagya .container{padding-top: 20px}
.select-center{width: 100%; font-size: 20px; padding: 15px; max-width: 611px; margin: 0 0 10px !important; border-radius: 8px; height: 60px; margin-top: 20px; font-weight: 600; cursor: pointer}

/**/
input.raad {
  display: none;
}

.rd-label {
  cursor: pointer;
  position: relative;
  font-size: 1.4rem;
    font-weight: 600;
    transition: .4s all; 
    pointer-events: none;
    top: 22px;color:#000
}

.rd-label::before {
  content: "";
  position: absolute;
  width: 30px;
  height: 30px;
  background-color: transparent;
  border: 2px solid #cf4520;
  border-radius: 50%;
  top: -15px;
  left: 0;
  transform: translateY(-50%);
  transition: border-color 400ms ease;
  pointer-events: none;
}

.rd-label::after {
  content: "";
  position: absolute;
  width: 30px;
  height: 30px;
  background-color: #cf4520;
  border: 2px solid #cf4520;
  border-radius: 50%;
  top: -15px;
  left: 0;
  transform: translateY(-50%) scale(0);
  transition: transform 400ms ease;
  pointer-events: none
}

input.raad:checked ~ label::after {
  transform: translateY(-50%) scale(0.55);
}
input.raad:checked ~ label{color:#000}

.radio-buttons div, .radio-buttons img, .radio-buttons label{display: inline-block;}
.radio-buttons .btn{position: relative; margin: 0 15px; border: 1px solid #cf4520; border-radius: 7px !important; padding:12px 20px; box-shadow: 0 2px 4px rgba(0,0,0,.05); text-align: left}
.select-center, .form-control, .radio-card{box-shadow: 0 2px 4px rgba(0,0,0,.05);}
.radio-buttons .btn:hover, .select-center:hover, .radio-card:hover{box-shadow: 0 2px 6px rgba(0,0,0,.1);}
.radio-buttons .btn:hover label{color:#000}
.radio-buttons .btn:hover .rd-label::before{border-color:#2972df}
.radio-buttons .radio-card .btn{margin:0 10px 10px 0}
.radio-buttons .radio-card{position:relative; max-width: 900px; margin: 0 auto 20px;padding: 20px; background: #eee;border-radius: 10px;text-align: left; display:block; cursor:pointer; transition:.3s all}
.radio-buttons .radio-card p{font-size: 14px;text-align: left;line-height: 25px;margin-bottom: 0px;}
.radio-card.active{border:2px solid #3057d5; box-shadow:0 5px 15px rgba(0,0,0,.3);animation: popout .3s ease; -webkit-animation: popout .3s ease; border-radius:10px 10px 0 0; z-index:1;}
@keyframes popout {from{transform:scale(1)} 60%{transform:scale(1.05)} to{transform:scale(1)}}
@-webkit-keyframes popout {from{-webkit-transform:scale(1)} 60%{-webkit-transform:scale(1.05)} to{-webkit-transform:scale(1)}}
.radio-card.active + .radio-card{margin-top: -19px; border-radius: 0 0 10px 10px;}
.radio-card .check-icon { width: 20px; height: 20px; display: inline-block; border: solid 2px #ccc; border-radius: 50%; transition: 200ms linear; position: absolute; z-index: 1; left: 12px; top: 12px; background:#fff;} 
.radio-card .check-icon:before { content: ""; position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.93552 4.58423C0.890286 4.53718 0.854262 4.48209 0.829309 4.42179C0.779553 4.28741 0.779553 4.13965 0.829309 4.00527C0.853759 3.94471 0.889842 3.88952 0.93552 3.84283L1.68941 3.12018C1.73378 3.06821 1.7893 3.02692 1.85185 2.99939C1.91206 2.97215 1.97736 2.95796 2.04345 2.95774C2.11507 2.95635 2.18613 2.97056 2.2517 2.99939C2.31652 3.02822 2.3752 3.06922 2.42456 3.12018L4.69872 5.39851L9.58026 0.516971C9.62828 0.466328 9.68554 0.42533 9.74895 0.396182C9.81468 0.367844 9.88563 0.353653 9.95721 0.354531C10.0244 0.354903 10.0907 0.369582 10.1517 0.397592C10.2128 0.425602 10.2672 0.466298 10.3112 0.516971L11.0651 1.25003C11.1108 1.29672 11.1469 1.35191 11.1713 1.41247C11.2211 1.54686 11.2211 1.69461 11.1713 1.82899C11.1464 1.88929 11.1104 1.94439 11.0651 1.99143L5.06525 7.96007C5.02054 8.0122 4.96514 8.0541 4.90281 8.08294C4.76944 8.13802 4.61967 8.13802 4.4863 8.08294C4.42397 8.0541 4.36857 8.0122 4.32386 7.96007L0.93552 4.58423Z' fill='white'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-size: 12px; background-position: center center; transform: scale(1.6); transition: 200ms linear; opacity: 0; } 
.radio-card input[type=radio] {opacity:0; position:absolute}                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           
.radio-card input[type=radio]:checked + .card-content-wrapper .check-icon { background: #3057d5; border-color: #3057d5; transform: scale(1.2); }                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  
.radio-card input[type=radio]:checked + .card-content-wrapper .check-icon:before { transform: scale(1); opacity: 1; }                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       
.radio-card input[type=radio]:focus + .card-content-wrapper .check-icon { box-shadow: 0 0 0 4px rgba(48, 86, 213, 0.2); border-color: #3056d5; }
.radio-buttons .radio-card .act_btns{display:block}
.cc_info{line-height:22px; margin:5px 0} .cc_info hr{margin:5px 0}
.cc_info label{margin:0; font-weight:bold; font-size:14px}
.cc_info div{vertical-align:top}
.cc_info .row{width:100%;}
.pdf_info div {display:block; font-weight:600; line-height:36px}
.hdsel-sec{width:100%;}
/*.radio-buttons > label > input{display:none}*/
.radio-buttons .radio-card:hover{box-shadow:0 5px 15px rgba(0,0,0,.3)}
.radio-buttons .radio-card label:hover{cursor:pointer}
.radio-buttons.inst aside.btn{margin:0 20px 0 0;text-align: center;float: left; background:#fff}
.radio-buttons.inst small{display: block; margin: 5px 0 10px}
.radio-buttons.inst small span{font-size:17px; font-weight:bold; color:#cf4520;}
.radio-buttons.inst .card-content-wrapper,.radio-buttons.inst .card-content-wrapper small{margin-bottom: 0}
.radio-buttons.inst label.btn{background:#fff}
.radio-buttons.inst h3{display: none; margin: -20px 0 30px}
.radio-buttons.noimg .rd-label{font-size: 1rem; padding-left: 30px; top:5px}
.radio-buttons.noimg .rd-label:before, .radio-buttons.noimg .rd-label:after{top: 10px; left: -7px;}
.radio-buttons ~ h3{display: none; margin: 20px 0 0}
.radio-buttons .btn i{background: green; display: block; position: absolute; top: -10px; right: -10px; border-radius: 100%; color: #fff; font-size: 25px; padding: 1px 2px 1px 0; display: none;}
input.raad:checked ~ i{display: block;}

.form-row label{font-weight: 500; margin-bottom: 0; width: 100%; text-align: left; font-weight: 600}
.donor-det .form-control{padding: 10px 0; margin-bottom: 20px; border-width:0 0 2px 0; border-style: solid; border-color:#bbb; border-radius:0;}
.donor-det .form-control:focus{border-color:#cf4520;}
.form-row .radio-buttons .rd-label{font-size: 16px;}
.form-row .radio-buttons .rd-label::before, .form-row .radio-buttons .rd-label::after{left:-31px; top:50%; width:20px; height:20px}
.form-row .radio-buttons .btn{padding: 6px 12px 6px 40px; margin: 10px 15px 0 0; display: inline-block; width: max-content;}
.radio-buttons.don-amt .rd-label{font-size: 15px}
.donate-div{display: inline-block; position: relative; width: 100%;}
.donate-field{width: 100%; font-size: 34px; font-weight: 600; padding: 15px 21px 15px 50px; position: relative; text-align: center; line-height: 68px; border: 2px solid #cf4520; transition: .6s all; color: #000;}
.donate-field:focus{border-color:#cf4520; background-color: #f2f2f2 !important; box-shadow: 0 0 11px 3px rgba(214, 214, 214, .51); }
.donate-div b{font-size: 34px; position: absolute; top: 36px; bottom: 0; margin: auto; left: 22px; color:#000}
.donate-field::placeholder{font-size:20px; color:#aaa; position: relative; top: -2px}
.form-row.mobile .btn{position: absolute; right: 11px; top: 27px; height:37px; font-size: 14px}
.form-row.donate{margin-top: 20px}
.don-amt .rd-label{top:0}
.dack .bxs-check-circle{color:green;font-size: 70px;}
.dack .bxs-error-alt{color:crimson;font-size: 70px;}
.dack a.link{font-size: 24px; color: #135fbd; font-weight: 600;}
.otpMsg {margin: -14px 0 10px;}
.otpMsg a{color: #cf4520; text-decoration: underline}
#divDisplayWords{display: inline-block; line-height: 23px; font-size: 16px; font-weight: 600; margin-top: 5px;}
span.star{color:crimson}

.h-txt{display:none}
.steps-bar{margin: -50px 0 40px; position: relative;}
.steps-bar aside{
    display: inline-block;
    padding: 10px 20px;
    border-bottom: 6px solid #ddd; text-align: center; margin: 0 -3px; opacity: .3; color:#cf4520;
    min-width: 150px
}
.steps-bar i{display: block; width: 60px; height: 60px; border: 1px solid #cf4520; color: #cf4520; font-size: 35px; border-radius: 100%; padding-top: 13px; margin: 0 auto 12px;}
.steps-bar aside.active{opacity: 1; border-bottom-color: #cf4520}
#formLang {position: absolute; right: 30px; bottom: -20px;}
.e-txt span, .h-txt span{font-size: 11px; display: block; line-height: 12px;}
.radio-buttons.inst .btn.m-txt{padding:4px 15px 8px}
/*responsive*/

@media (min-width:767px) {
    .yagya{min-height: calc(100vh - 390px);}
    .form-row.donate .col-md-3 label{margin: 26px 10px 0 0;}
    .cc_info .row{max-width:300px}
}
@media (max-width:767px) {
    body{font-size: 14px; text-align: center}
    .yagya{ margin-top: 30px}
    .banner{padding-top: 20px; text-align:center;}
    .banner h3{font-size: 28px;}
    .banner .row{margin: 0}
    p{font-size: 14px; line-height: 18px}
    .banner img{max-width:100%}
    .radio-buttons .btn{margin:0; width:100%; padding-bottom: 20px}
    .radio-buttons.inst .btn, .radio-buttons.inst aside.btn{width: auto;}
    .dack a{font-size: 18px}
    .yagya h4{font-size: 20px; line-height: 30px; margin:0}
    .yagya .wbox{padding: 20px}
    .rd-label{width:66%}
    .radio-buttons img{vertical-align: top}
    .areyou .rd-label{width: 100%}
    .donate-div{margin-bottom: 0}
    .form-row .radio-buttons .btn{padding: 6px 8px 6px 40px; margin: 10px 5px 0 0;}
    #loadpdf{height:400px;}
    .radio-card .btn.btn-dark.btn-lg{padding-bottom:12px}
    .pdf_info ul{padding-left:20px}
    .pdf_info .pull-left, .pdf_info .pull-right{float:none; text-align:center}
    .radio-buttons.inst small{margin: 0 0 5px}
    .cc_info .row div{float:left}
}