.image-font {
  height: 100px;
  width: 100px;
  margin-left: 5%;
  margin-top: 5%;
}

.card-bg {
  background-color: darkgoldenrod;
  color: ghostwhite;
  opacity:0.8;
}

.image-font1 {
  height: 150px;
  width: 200px;
  margin-left: 5%;
  margin-top: 5%;
}

.logo-small {
  color: #51575D;
  font-size: 80px;
}

.panel {
  border: 1px solid #888C8F;
  border-radius: 0 !important;
  transition: box-shadow 0.5s;
}

  .panel:hover {
    box-shadow: 5px 0px 40px rgba(0,0,0, .2);
  }

.panel-footer .btn:hover {
  border: 1px solid #888C8F;
  background-color: #fff !important;
  color: #888C8F;
}

.link-color {
  color: #141010 !important;
  /*  color: #1b2e2ad4 !important;
*/
}

.panel-heading {
  padding: 25px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.panel-footer {
  background-color: white !important;
}

  .panel-footer h3 {
    font-size: 32px;
  }

  .panel-footer h4 {
    color: #aaa;
    font-size: 14px;
  }

  .panel-footer .btn {
    margin: 15px 0;
    background-color: #888C8F;
    color: #fff;
  }

.carousel-settings {
  padding-top: 20px;
  height: 20rem;
}

.panel-header {
  color: #f78b39;
  font-family: var(--bs-btn-font-family) !important;
  padding: 1%;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 50px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 0px;
}

  .panel-header:hover {
    color: crimson !important;
    font-family: var(--bs-btn-font-family) !important;
    padding: 25px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 50px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 0px;
  }

.panel {
  border: 1px solid #4d82ab;
  border-top-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  border-top-right-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
}

  .panel:hover {
    color: crimson !important;
    border: 1px solid #4d82ab;
    border-top-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
    border-top-right-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
    box-shadow: 5px 0px 0px 0px #E61954;
  }

.img-background-row1 {
  height: 100%;
  width: 100%;
  border-radius: 10px !important;
}

.img-background-aboutus {
  height: 90%;
  width: 100%;
  border-radius: 10px !important;
  aspect-ratio: 2/1;
}

.img-background-service {
  height: 100%;
  width: 100%;
}

.img-background-row2 {
  background-image: url("../../assets/images/Gather.PNG");
  background-color: #cccccc;
  height: auto;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  opacity: 0.6;
}

.txt-col {
  color: #458497 !important;
}

.animation {
  position: relative;
  animation: animation 2s ease-out;
}

#slide-in {
  
}

@keyframes animation {
  0% {
    opacity: 0;
    left: -100px;
  }

  100% {
    opacity: 1;
    left: 0;
  }
}

.card-img-top1{
    width:25% !important;
}


.card-img-top2 {
  width: 45% !important;
}
.footer {
  bottom: 0;
  width: 100%;
  background-color: #d9d9d9;
}

.dropdown-menu {
  --bs-dropdown-bg: darkgoldenrod;
  --bs-dropdown-border-radius: 0.0rem;
  font-weight:500;
}


.container {
  display: flex;
  flex-direction: column;
}

/* animation class and keyframes */
.overflow-hidden {
  overflow: hidden;
}

.drop-in {
  animation: drop-in 1s ease 200ms backwards;
}

.drop-in-2 {
  animation: drop-in 1200ms ease 500ms backwards;
}

@keyframes drop-in {
  from {
    opacity: 0;
    transform: translateY(-100px);
  }

  to {
    opacity: 1;
    transform: translate(0px);
  }
}


/*=== Basic box styling  ===*/
.box {
  background: #23a3d3;
  width: 90px;
  height: 70px;
  padding: 20px;
  text-align: center;
  color: white;
  border-radius: 7px;
  float: left;
  margin: 4px;
  font-size: 12px;
  font-family: 'Arial';
  text-transform: uppercase;
}


/*=== Trigger  ===*/
.animate {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/*=== Optional Delays, change values here  ===*/
.one {
  -webkit-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

.two {
  -webkit-animation-delay: 1.7s;
  -moz-animation-delay: 1.7s;
  animation-delay: 1.7s;
}

.three {
  -webkit-animation-delay: 2.3s;
  -moz-animation-delay: 2.3s;
  animation-delay: 2.3s;
}

.four {
  -webkit-animation-delay: 3.3s;
  -moz-animation-delay: 3.3s;
  animation-delay: 3.3s;
}

/*=== Animations start here  ===*/
/*=== FADE IN  ===*/
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}


/*=== FADE IN DOWN ===*/
@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

/*==== FADE IN UP ===*/
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

/*=== FADE IN LEFT ===*/
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}


/*==== FADE IN RIGHT ===*/
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

.dropdown-item.active, .dropdown-item:active {
  background-color: white;
  color:black
}
.dropdown-item:focus, .dropdown-item:hover {
  color: #e10f50;
  background-color: white;
}

.container-background {
    background-color: #f5c100 !important;

/*  background-color: #f5c10030 !important
*/}

.heading-color {
  color: #1c187c;
}
.p-text {
  font-size: 1.3vw;
}

.p-head {
  font-size: 3vw;
}

.p-card{
    font-size: 2vw;
}

@media screen and (min-width:100px) and (max-width:819px) {
  .p-card {
    font-size: 2vw;
    font-weight: 700;
  }

  .p-text {
    font-size: 3vw;
  }

  .p-head {
    font-weight: 800;
    font-size: 5vw;
  }
  .p-head-mob {
    font-weight: 800;
    font-size: 2vw !important;
  }
  .p-head-mob-councelling {
    font-weight: 800;
    font-size: 4vw !important;
  }
  .p-core-text {
    font-size: 3.5vw;
  }
  .p-core-padding{
      padding:2%;
  }
  .truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4; /* number of lines to show */
    line-clamp: 4;
    -webkit-box-orient: vertical;
  }
  .img-background-aboutus {
    height: 100%;
    width: 100%;
    border-radius: 10px !important;
  }
  .image-font{
      width:90% !important;
  }
  .padding-above-1-mob {
    padding-top: 1%;
  }
  .logo-mob {
    height: 6.5rem;
    width: 22rem !important;
  }
  .padding-mob{
      padding:3%;
  }
}

@media screen and (min-width:1181px) and (max-width:1280px) {
  .p-head {
    font-weight: 600;
    font-size: 1.7vw;
  }
}
  @media screen and (min-width:820px) and (max-width:1180px) {
    .p-card {
      font-size: 2vw;
      font-weight: 700;
    }

    .p-text {
      font-size: 2vw;
    }

    .p-head {
      font-weight: 800;
      font-size: 3vw;
    }

    .p-core-text {
      font-size: 2vw;
    }

    .p-core-padding {
      padding: 2%;
    }

    .truncate {
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 4; /* number of lines to show */
      line-clamp: 4;
      -webkit-box-orient: vertical;
    }

    .img-background-aboutus {
      height: 100%;
      width: 100%;
      border-radius: 10px !important;
      aspect-ratio: 2/1;
    }
    .image-font {
      width: 90% !important;
    }
  }
.padding-above-4 {
  padding-top: 4%;
}
.padding-above-3 {
  padding-top: 3%;
}
  .padding-above-2{
      padding-top:2%;
  }
.padding-above-1 {
  padding-top: 1%;
}

.bg-light {
  --bs-bg-opacity: 1;
  background-color: lemonchiffon !important;
}

.img-bg {
  background-color: #e2af0b;
}