@font-face {
  font-family: fontRegular;
  src: url("../assets/fonts/djr-font/FormaDJRDeck-Regular-Testing.woff");
}
@font-face {
  font-family: futura;
  src: url("../assets/fonts/futura-font/futura\ medium\ bt.ttf");
}
@font-face {
  font-family: fontMedium;
  src: url("../assets/fonts/djr-font/FormaDJRDeck-Medium-Testing.woff");
}
@font-face {
  font-family: fontBold;
  src: url("../assets/fonts/djr-font/FormaDJRDeck-Bold-Testing.woff");
}
.container{
   max-width: calc(100vw - 5%) !important;
}

h1 {
  font-size: calc(26.0px + (50.0 - 26.0) * ((100vw - 1001px) / (2000 - 1001))) !important;
}

p, a, .btn{
  font-size: calc(17.0px + (20.0 - 17.0) * ((100vw - 1001px) / (2000 - 1001))) !important;
}
h5{
  font-size: calc(23.0px + (25.0 - 23.0) * ((100vw - 1001px) / (2000 - 1001))) !important;
}
.custom-h p{
  font-size: calc(18.0px + (22.0 - 18.0) * ((100vw - 1001px) / (2000 - 1001))) !important;
}


.button{
  padding-left: 1rem !important;
  padding-right: 1rem  !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.container {
  font-family: fontRegular;
}
.max-container{
   max-width: 1550px;
}
.font-medium {
  font-family: fontMedium;
}
.text-red {
  color: #e94724;
}
.text-yellow {
  color: #edaa20;
}
.text-green {
  color: #30a981;
}
.text-bold {
  font-family: fontBold;
}

.btn-green-white {
  background-color: #30a981;
  color: #ffff;
  margin-left: 8px;
}

.btn-green-white:hover {
  background-color: #ffff;
  box-shadow: 1px 1px 10px 3px rgba(0, 0, 0, 0.4);
  color: #30a981;
}

/* navbar css start */
/*  */
.nav-inner{
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}
.navbar-color {
  background-color: #ffff;
  height: 100px;
  /* max-width: 100%; */
}
.bg-drop{
   background-color: #ffff;
}
.nav-link {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
.nav-login {
  margin-top: -3px !important;
}
.login-padding:hover {
  background-color: #30a981;
  color: white !important;
  border: 1px solid #30a981 !important;
}
/*  */
/* navbar css end */


.carousel-box {
   min-height: calc(90vh - 100px) !important;;
}
.carousel-text{
  gap: 50% !important;
}
.img-fluid-header{
  max-width: 70%;
}
.img-fluid-nav{
  max-width: 90%;
}
.img-fluid {
  max-width: 80% !important;
}
.img-fluid-slick{
  max-width: 90% !important;
}
.img-fluid-custom {
  width: 4% !important;
}
.img-fluid-custom-1 {
  width: 6% !important;
}

.banner-bottom-border {
  width: 60%;
  height: 10px;
  background-color: #edaa20;
  margin-left: -130px;
}

.indicators-arrows{
   min-height: 10vh;
   width: 100% !important;
}

.carousel-indicators button {
  border: 2px solid #ea4722 !important;
  background-color: #ea4722 !important;
  height: 10px !important;
  width: 10px !important;
  border-radius: 100%;
}
.carousel-indicators {
  position: initial !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  margin-bottom: 0 !important;
}
.carousel-control-prev,
.carousel-control-next {
  position: initial !important;
  background-color: #d9d9d9;
  width: auto !important;
}
.fa-angle-left,
.fa-angle-right {
  font-size: 25px !important;
  padding-left: 23px;
  padding-right: 20px;
  padding-top: 16px;
  padding-bottom: 16px;
}
.fa-angle-left:hover,
.fa-angle-right:hover {
   background-color: #ffff;
   box-shadow: 1px 1px 10px 3px rgba(0, 0, 0, 0.4);
   border-radius: 100% ;
}
/* header banner end */

/* learn more start */

.learn-more-custom-height{
   height: 110px;
}
.scroll-card-width{
  width: 500px !important;
  padding: 30px !important;
  padding-right: 10px !important;
  margin: 17px;

}
.scroll-card-width:hover{
  border-radius: 0 0 0 25px;
  box-shadow: 1px 1px 10px 3px rgba(0, 0, 0, 0.4);
}
.hover-green-btn {
  padding-right: 9px ;
  padding-left: 9px ;
  font-weight: 500;
  border: 2px solid black;
  padding-top: 0.0000001px !important;
  padding-bottom: 2px !important;
}
.hover-green-btn:hover{
background-color: #30a981;
color: white;
border: 2px solid #30a981;
}
/* learn more end */

/* edu inst start */
.edu-inst {
  background-color: #f8f7f7;
  z-index: 2;
}
.edu-end {
  margin-bottom: -5%;
}
.edu-start {
  margin-top: -5%;
}
.custom-h {
  height: 90px;
}
/* edu inst end */

/* slick slider start */
.responsive{
  height: 250px !important;

}
.slick-single{
  height: 140px;
  display: flex;;
  align-items: center;
  justify-content: center;
}
/* slick slider end */

/* institute upgrade start */
.bottom-img {
  border-radius: 100% 0 0 0;
  max-width: 100%;
  height: auto;
  margin-bottom: -93px;
  z-index: -1;
}
.margin-left{
  margin-left: 4%;
}

/* institute upgrade end */

/* trust us section start */
.number-trust {
  font-size: 3.8em;
}
/* trust us section end */

/* marque section start */
.border-right {
  width: 30%;
  height: 10px;
  background-color: #e94724;
}
/* marque section end */
/* footer */
.vr-line-footer {
  width: 25%;
  height: 3px;
  background-color: #e94724;
}

.grapdes-design{
  font-weight: 400 !important;

}
/* footer */

/* horizontal scrollbar */


/* media query breakpoint */


.grapdes{
  font-family: futura; 
  font-weight: 500;
  text-decoration: none;
  color: black;
}
.grapdes:hover{
  text-decoration: underline;
  color: black;
}


@media (max-width: 991px) {
   .img-fluid{
    max-width: 65% !important;
   }
   .img-fluid-header{
    max-width: 60% !important;
   }
   .earn-more-custom-height{
    height: 220px;
 }

 .learn-more-custom-height{
  height: 113px;
}
.scroll-card-width{
 width: 440px !important;
 padding: 30px !important;
 padding-right: 7px !important;
 margin: 15px;

}
 }
@media (max-width: 470px) {
  .learn-more-custom-height{
    height: 120px;
 }
 .scroll-card-width{
   width: 310px !important;
   padding: 20px !important;
   padding-right: 10px !important;
   margin: 15px;
 
 }
 .img-fluid{
  max-width: 90% !important;
 }
 .img-fluid-header{
  max-width: 85% !important;
 }
 }
 @media (max-width: 1001px) and (min-width: 750px) {
  h1 {
    font-size: calc(28.0px + (40.0 - 28.0) * ((100vw - 750px) / (1001 - 750))) !important;
  }
  p, a, .btn{
    font-size: calc(17.0px + (20.0 - 17.0) * ((100vw - 750px) / (1001 - 750))) !important;
  }
  h5{
    font-size: calc(23.0px + (25.0 - 23.0) * ((100vw - 750px) / (1001 - 750))) !important;
  }
  .custom-h p{
    font-size: calc(18.0px + (20.0 - 18.0) * ((100vw - 750px) / (1001 - 750))) !important;
  }
}
@media (max-width: 1000px) and (min-width: 991px) {
  h1 {
    font-size: calc(24.0px + (26.0 - 24.0) * ((100vw - 992px) / (1000 - 992))) !important;
  }
  p, a , .btn{
    font-size: calc(16.0px + (17.0 - 16.0) * ((100vw - 992px) / (1000 - 992)))!important;
  }
  h5{
    font-size: calc(20.0px + (23.0 - 20.0) * ((100vw - 992px) / (1000 - 992))) !important;
  }
  .custom-h p{
    font-size: calc(14.0px + (19.0 - 14.0) * ((100vw - 992px) / (1000 - 992))) !important;
  }
}
@media (max-width: 749px) and (min-width: 300px) {
  h1 {
    font-size: calc(26.0px + (30.0 - 26.0) * ((100vw - 300px) / (749 - 300))) !important;
  }
  p, a , .btn{
    font-size: calc(16.0px + (18.0 - 16.0) * ((100vw - 300px) / (749 - 300)))!important;
  }
  h5{
    font-size: calc(18.0px + (20.0 - 18.0) * ((100vw - 300px) / (749 - 300))) !important;
  }
  .custom-h p{
    font-size: calc(15.0px + (18.0 - 15.0) * ((100vw - 300px) / (749 - 300))) !important;
  }

}
/* media query breakpoint */
