@font-face {
    font-family: roboto;
    src: url(/font/roboto/Roboto-Regular.ttf);
  }
  @font-face {
    font-family: roboto-black;
    src: url(/font/roboto/Roboto-Black.ttf);
  }

.font-weight-heavy{
    font-family: roboto-black;
}

.university-section {
  /* display: grid; */
  row-gap:54px ;
}
.university-card img {
  max-height: 277px;
}
.university-details p {
  font-size: 17px;
  color: #BAC8C8;
}
.university-details h6 {
  font-family: Avenir;
  font-size: 20px;
}
.university-details small {
  font-family: roboto;

}


/* Card grid */

.card-grid{

  display: grid;    
  /* fit as 2 columns , 50% width wide each: */
  grid-template-columns: repeat(6, 1fr);
  /* each row is 20px high -- we always span 2+ */
  grid-row-gap: 16px;
  grid-column-gap: 20px;
  grid-auto-rows: 20px;
  justify-content: center;
  transition:0.8s;

}

/* card grid for mobile  */



.grid-item {
  height: auto;
  grid-row-end: span 15;
}
@media only screen and (max-width: 600px) {

  .university-details p {
    font-size: 12px;
    color: #BAC8C8;
  }
  .university-details h6 {
    font-family: Avenir;
    font-size: 15px;
  }
  .card-grid {
      display: grid;
      grid-column-gap: 12px;
      grid-row-gap: 6px;
      grid-template-columns: repeat(2, 1fr);
      /* each row is 20px high -- we always span 2+ */
      grid-auto-rows: 20px;
      justify-content: center;
      transition:0.8s;
  }
  .details-1__secondary {
    font-family: AvenirRoman;
    font-size: 15px;
}
.grid-item {
  height: auto;
  grid-row-end: span 19;
}
}
.first-grid {
  grid-row-end: span 3;
}
.grid-container {
  position: relative;
  display: inline-block;
  width: 100%;
}
.send-box {
  border-radius: 50%; border:1px solid white;
}
.send-box img {
  width: 21.67px;
  height: 18.18px;
}
.call-box {
  cursor: pointer; border-radius:24px; border:1px solid white;
  padding: 0px 28px;
}
.call-box p {
  font-size: 17px!important;
}
.alumini-details {
  margin-top: 1rem!important;
}
.details-1__primary {
  font-family: Avenir;
  font-size: 17px;
}
.details-1__secondary {
  font-family: AvenirRoman;
  font-size: 14px;
}


.grid-item__image {
  border-radius: 14px;
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
}


.lp-inp {
  border-radius: 1px!important;
  border: 0.8px solid #2F3031;
  height: 42px!important;
}
.lp-label {
color: black;
}

.btn-register {
  font-family: AvenirRoman;
  color: white;
    font-size: var(--fmge-btn);
    width: 100%;
    background: #4BBF28 0% 0% no-repeat padding-box;
    border: 0px solid #707070;
    border-radius: 0px;
    opacity: 1;

}


* modal style */
.modal-content{
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #707070;
  border-radius: 18px;
  opacity: 1;
}
.loginText{
  text-align: left;
  font: normal normal 900 28px Avenir;
  letter-spacing: 0px;
  color: #707070;
  opacity: 1;
  margin-bottom: 15px;
}
.enterPhoneNoText{
  text-align: left;
  font: normal normal normal 16px AvenirRoman;
  letter-spacing: 0px;
  color: #707070;
  opacity: 1;
  margin-bottom: 30px;
}
.consultModalText{
  text-align: left;
  font: normal normal normal 24px AvenirRoman;
  letter-spacing: 0px;
  color: #707070;
  opacity: 1;
  margin-bottom: 64px;
}
.free-text {
  text-align: left;
  font: normal normal normal 24px Avenir;
  letter-spacing: 0px;
  color: #707070;
  opacity: 1;
  margin-bottom: 64px;
}
.input-for-mobile{
  min-height: 46px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #707070;
  border-radius: 14px;
  opacity: 1;
  text-align: left;
  font: normal normal normal 18px AvenirRoman;
  margin-bottom: 30px;
}
.input-for-mobile-home {
  min-height: 46px;
  background: #FFFFFF 0% 0% no-repeat padding-box;
  border: 1px solid #707070;
  border-radius: 14px;
  opacity: 1;
  text-align: left;
  font: normal normal normal 18px AvenirRoman;
  /* margin-bottom: 30px; */
}
.otp-button{
  min-height: 46px;
  background: #000000 0% 0% no-repeat padding-box;
  border: 1px solid #000000;
  border-radius: 14px;
  opacity: 1;
  text-align: center;
  color: white;
  font: normal normal normal 18px AvenirRoman;
  margin-top: 50px;
  margin-bottom: 20px;
}
.otp-button:hover {
  min-height: 46px;
  background: #272626 0% 0% no-repeat padding-box;
  border: 1px solid #000000;
  border-radius: 14px;
  opacity: 1;
  text-align: center;
  color: white;
  font: normal normal normal 18px AvenirRoman;
  margin-top: 50px;
  margin-bottom: 20px;
}
.otpInfoText{
  text-align: center;
  font: normal normal normal 16px/22px AvenirRoman;
  letter-spacing: 0px;
  color: #707070;
  opacity: 1;
}
/* end of modal style */

/* otp input style*/
.card {
  border: none;
  box-shadow: none;
  display: flex;
  justify-content: center;
  align-items: center
}

.card h6 {
  color: rgb(30, 255, 0);
  font-size: 20px
}

#otp .form-control {
padding: 0 0 !important;
}
.inputs input {
  width: 30px;
  height: 40px
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0
}

.card-2 {
  background-color: #fff;
  padding: 10px;
  width: 350px;
  height: 100px;
  bottom: -50px;
  left: 20px;
  position: absolute;
  border-radius: 5px
}

.card-2 .content {
  margin-top: 50px
}

.card-2 .content a {
  color: rgb(0, 255, 64)
}

.form-control:focus {
  box-shadow: none;
  border: 2px solid rgb(0, 255, 0)
}



.resend-btn {
    border: none;
    background: none;
}

/* end of otp input style*/