/*application CSS
for ISR India
Author: Mindsight Web Technology */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400&display=swap');
.container1{min-height:75vh; display:flex; justify-content:center; align-items:center; background-image:url("../images/2019/11.JPG"); background-size:cover;}
.container1 .card{height:auto; width:800px; background-color:#304767; position:relative; box-shadow:0 15px 30px rgba(0,0,0,0.1); font-family: 'Poppins', sans-serif; border-radius:20px; margin-top:40px;}
.container1 .card .form{width:100%; height:100%; display:flex;}
.d-none{display:none;}
.main{padding:0 40px;}
.main small{display:flex; justify-content:center; align-items:center; margin-top:2px; height:30px; width:30px; background-color:#ccc; border-radius:50%; color:yellow; font-size:19px;}
.text{margin-top:20px; position: relative;}
.congrats{text-align:center;}
.text p{margin-top:10px; font-size:13px; font-weight:700; color:#737579;}
.input-text{margin:30px 0; display:flex; gap:20px;}
.input-text .input-div{width:100%; position:relative;}
input[type="text"], input[type="tel"], input[type="number"], input[type="email"], input[type="date"]{width:100%; height:40px; border:none; outline:0; border-radius:5px; border:1px solid #cbced4; gap:20px; box-sizing:border-box; padding:0px 10px;}
/* Chrome, Safari, Edge, Opera */
input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button{-webkit-appearance: none; margin: 0;}
/* Firefox */
input[type=number]{-moz-appearance: textfield;}
input[type="radio"]{height:20px; border:none; outline:0; border-radius:5px; border:1px solid #cbced4; gap:20px; box-sizing:border-box; padding:0px 10px; margin: 0;}
textarea{width:100%; border:none; outline:0; border-radius:5px; border:1px solid #cbced4; gap:20px; box-sizing:border-box; padding:0px 10px;}
input[type="file"]{width:auto; border:none; outline:0; border-radius:5px; border:1px solid #cbced4; gap:20px; box-sizing:border-box; padding:0px 10px;}
select{width:100%; height:40px; border:none; outline:0; border-radius:5px; border:1px solid #cbced4; gap:20px; box-sizing:border-box; padding:0px 10px;}
.input-text .input-div label{font-weight: 600;}
.input-text .input-div span{position:absolute; top:10px; left:10px; font-size:14px; transition:all 0.5s;}
.input-div input:focus ~ span, .input-div input:valid ~ span, .input-div textarea:focus ~ span, .input-div textarea:valid ~ span{top:-15px; left:6px; font-size:10px; font-weight:600;}
.input-div input[type="file"] ~ span{top:-30px; left:6px; font-size:10px; font-weight:600;}
.buttons button{height:40px; width:100px; border:none; border-radius:5px; font-size:12px;}
.button_space{display:flex; gap:20px;}
.user_card{margin-top:20px; margin-bottom:40px; height:200px; width:100%; border:1px solid #c7d3d9; border-radius:10px; display:flex; overflow:hidden; position:relative; box-sizing:border-box;}
.user_card span{height:80px; width:100%; background-color:#dfeeff;}
.circle{position:absolute; top:40px; left:60px;}
.circle span{height:70px; width:70px; background-color:#fff; display:flex; justify-content:center; align-items:center; border:2px solid #fff; border-radius:50%;}
.circle span img{width:100%; height:100%; border-radius:50%; object-fit:cover;}
.user_name{position:absolute; top:110px; margin:10px; padding:0 30px; display:flex; flex-direction:column; width:100%;}
.user_name h3{color:#4c5b68;}
.detail{display:flex; justify-content:space-between; margin-right:50px;}
.detail p{font-size:12px; font-weight:700;}
.detail p a{text-decoration:none; color:blue;}
.checkmark__circle{stroke-dasharray:166; stroke-dashoffset:166; stroke-width:2; stroke-miterlimit:10; stroke:#7ac142; fill:none; animation:stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;}
.checkmark{width:56px; height:56px; border-radius:50%; display:block; stroke-width:2; stroke:#fff; stroke-miterlimit:10; margin:10% auto; box-shadow:inset 0px 0px 0px #7ac142; animation:fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;}
.checkmark__check {transform-origin:50% 50%; stroke-dasharray:48; stroke-dashoffset:48; animation:stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;}
@keyframes stroke {
    100% {stroke-dashoffset:0;}
}
@keyframes scale {
    0%, 100% {transform:none;}
    50% {transform:scale3d(1.1, 1.1, 1);}
}
@keyframes fill {
    100% {box-shadow:inset 0px 0px 0px 30px #7ac142;}
}
.warning{border:1px solid red !important;}
#counter {bottom: 60px; position: absolute;}
.footer {bottom: 0; position: absolute;}
#apply2025 {visibility: hidden}
#dob::placeholder, #anniversary::placeholder {color: transparent}
#dob:focus::placeholder, #anniversary:focus::placeholder {color: #a9a9a9}
@media screen and (max-width: 1366px) {
	#counter {padding: 0; position: relative; bottom: auto}
	.footer {position: relative}
}
/*right-side-end*/
@media (max-width:750px) {
    .container1{height:scroll;}
    .container1 .card {max-width:350px; height:auto !important; margin:30px 0;}
    .container1 .card .right-side {width:100%;}
    .input-text{display:block;}
    .input-text .input-div{margin-top:20px;}
    .container1 .card .left-side {display:none;}
}
@media (min-width: 1200px) {
    .modal-lg {width:90%;}
}