body{margin: 0px; padding: 0px; font-family: 'Yantramanav', sans-serif;}
*{-webkit-box-sizing: border-box; box-sizing: border-box;}
.attendancecontainer{padding: 30px 15px; background: #E9F6FB; min-height: 100vh; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; align-items: center; text-align: center;}
.attendancecontainer .form-control{display: block; width: 100%; height: calc(1.5em + .75rem + 2px); padding: .375rem .75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: .25rem; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;}
.attendancecontainer .form-control{height: 50px; border: 1px solid #909496; outline: none; padding: 4px 10px 4px 20px; background: #fff; font-size: 15px; color: #495057; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;}
.attendancecontainer .form-group{position: relative; margin: 0px 0px 15px 0px;}
.attendancecontainer .form-control:focus{border-color: #df2466;}
.attendancecontainer select.form-control::-ms-expand{display: none;}  
.attendancecontainer select.form-control{background-image: url(../images/drop-icon.png); background-position: center right; background-repeat: no-repeat;}
.attendancecontainer .attendancebox{display: block; background: #fff; padding: 70px 70px; width: 100%; max-width: 600px; -webkit-box-shadow: 0px 74px 144px rgb(215 221 228 / 70%); box-shadow: 0px 74px 144px rgb(215 221 228 / 70%); -webkit-border-radius: 20px; border-radius: 20px;}
.attendancecontainer .attendancebox .atlogo{display: block; text-align: center; margin: 0px 0px 25px 0px;}
.attendancecontainer .attendancebox .atlogo img{max-width: 100%; max-height: 100%;}
.attendancecontainer .attendancebox h2{color: #052033; font-size: 25px; font-weight: 600; margin: 0px 0px 30px 0px; text-transform: uppercase;}
.attendancecontainer .attendancebox p{color: #052033; font-size: 16px; font-weight: 400; margin: 0px 0px 30px 0px;}
.attendancecontainer .attendancebox .subtn{width: 100%; height: 50px; cursor: pointer; text-align: center; border: none; outline: none; background: #df2466; border: none; margin: 0; color: #fff; text-transform: uppercase; font-size: 22px; font-weight: 400; -webkit-border-radius: .25rem; border-radius: .25rem; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.attendancecontainer .attendancebox .subtn:hover{background: #2f1b56;}
.attendancecontainer .attendancebox .form-group label{display: block; color: #052033; font-size: 16px; margin: 0px 0px 2px 0px; text-align: left; line-height: 100%;}
.attendancecontainer .attendancebox .btn-link{color: #2f1b56; text-decoration: none; font-size: 15px; display: inline-block;margin-top: 20px; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;}
.attendancecontainer .attendancebox .btn-link:hover{color: #df2466; text-decoration: underline;}
.attendancecontainer .form-group .invalid-feedback{/*position: absolute; */left: 0px; top: 100%; color: #f44336; font-size: 14px;}
.attendancecontainer .form-group .invalid-feedback strong{font-weight: 400;}
.attendancecontainer .form-group .suggesstionbx{position: absolute; left: 0px; right: 0px; top: 100%; z-index: 5;}
.attendancecontainer .form-group .suggesstionbx ul{display: block; margin: 0px; background: #fff; max-height: 280px; overflow: auto; padding: 10px 0px; -webkit-box-shadow: 0px 9px 15px rgb(0 0 0 / 33%); box-shadow: 0px 9px 15px rgb(0 0 0 / 33%); -webkit-border-radius: 7px; border-radius: 7px;}
.attendancecontainer .form-group .suggesstionbx ul li{display: block; text-align: left; cursor: pointer; margin: 0px; padding: 7px 15px; list-style: none; color: #444; font-size: 16px; font-weight: 400; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;}
.attendancecontainer .form-group .suggesstionbx ul li:hover{background: #df2466; color: #fff;}
.attendancecontainer .attendancebox .resetbtn{font-size: 18px;}
.alert-success{position: relative; padding: 8px 10px; margin-bottom: 1rem; border: 1px solid #c3e6cb; border-radius: .25rem; color: #155724; background-color: #d4edda;}
.alert-alert{position: relative; padding: 8px 10px; margin-bottom: 1rem; border: 1px solid #f5c6cb; border-radius: .25rem; color: #721c24; background-color: #f8d7da;}
.attendancecontainer .attendancebox form{text-align: left;}

.attendancecontainer .attendancebox .response p{ margin: 0px 0px 10px 0px;}
.attendancecontainer .attendancebox .response p.empname{ font-weight: 500;}

@media (max-width: 767px){
.attendancecontainer .attendancebox h2{font-size: 20px;}
.attendancecontainer .attendancebox{padding: 40px 20px;}
}
@media (max-width: 575px){
.attendancecontainer .form-control{height: 40px;}
.attendancecontainer .attendancebox .subtn{height: 40px; font-size: 17px;}
.attendancecontainer .attendancebox .resetbtn{font-size: 15px;}
}

/*
font-family: 'Yantramanav', sans-serif;
*/