/* * University of Houston * Style sheet for the College of Technology * Created Spring 2016 by the UH College of Technology Web Team * Contact Sarah Borders or Ashley Leiva for more information. * * This style sheet is for the homepage. * * Table of Contents: * ------------------ * Imported Stylesheets * Headers, Text, Buttons * Features * Overview * Address * sugar-land * Quick Links * Did you know? * Social Media Bar * Events * Articles * Video background */
/* ======================================================================== Imported Stylesheets ======================================================================== */

/* ======================================================================== Headers, Text, Buttons ======================================================================== */

body {
  margin: auto;
  overflow: initial;
}

.nav-breadcrumb {
  display: none;
}

.uh-header .nav-primary a {
    /*font-weight: normal;*/
}
abbr[title] {
  text-decoration: none;
}

#main-content {
    overflow: initial;
}

.navbar-nav {
    margin: 0px;
}

.navbar {
    border-radius: 0px;
}

.bg-brick, .site-nav {
    background-color: #960C22;
}

h2 {
  color: #888B8D;
}

#affliation:before {
  content: '';
  position: absolute;
  display: block;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  background: #000; 
  opacity: .7;
}

#affliation {
  position: relative;
  padding: 100px 0;
}

#affliation, #affliation h2 {
    color: #FFF9D9;
}

.nav-link {
  color:#FFF9D9;
  border-radius: 10px;
}
.nav-link:hover {
 background-color: #640817;
  border-radius: 10px;
}

.nav-link.active {
 background-color: #640817;
  border-radius: 10px;
}

.icon-box {
  min-height: 300px;
}
.division{
  height:100%;
/*   width:150px; */
}


.icon-box .hover-text{

  height:0px;
  transition: height .75s;
  overflow:hidden;
  
}
.icon-box:hover .hover-text{
  
  height:300px;
}

 /*-------------------------------------------------------------- # Hero Section --------------------------------------------------------------*/
   #spotlights {
     width: 100%;
     position: relative;
    /*! background: var(--color-primary);
     */
  }
   @media (min-width: 1365px) {
     #spotlights {
/*        background-attachment: fixed; */
       background-size: cover;
    }
  }



 #spotlights h1 {
   margin: 0px;
   padding: 0px;
   line-height: 1em;
   font-family: "League Gothic",sans-serif;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-size: 3.75rem;
}

 #spotlights p {
   margin: 5px 0px 15px 0px;
   font-size: 1.5rem;
   line-height: 1.2em;
   margin-bottom: 30px;
   color:#fff;
}

   #spotlights h2 {
     font-size: 48px;
     font-weight: 700;
     margin-bottom: 20px;
     color: #fff;
  }

@media (max-width: 768px) {
     #spotlights h1 {
       font-size: 2em;
    }
  }
  
   #spotlights .btn-get-started {
     font-family: var(--font-primary);
     font-weight: 500;
     font-size: 15px;
     letter-spacing: 1px;
     display: inline-block;
     padding: 14px 40px;
     border-radius: 50px;
     transition: 0.3s;
     color: #fff;
     background: rgba(255, 255, 255, 0.1);
     box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
     border: 2px solid rgba(255, 255, 255, 0.1);
  }
   #spotlights .btn-get-started:hover {
     border-color: rgba(255, 255, 255, 0.5);
  }
   #spotlights .btn-watch-video {
     font-size: 16px;
     transition: 0.5s;
     margin-left: 25px;
     color: #fff;
     font-weight: 600;
  }
   #spotlights .btn-watch-video i {
     color: rgba(255, 255, 255, 0.5);
     font-size: 32px;
     transition: 0.3s;
     line-height: 0;
     margin-right: 8px;
  }
   #spotlights .btn-watch-video:hover i {
     color: #fff;
  }
   #spotlights .wysiwyg-content .col-auto, #spotlights .row.columns .col-auto {
     padding: 0px;
  }
   #spotlights .row {
     /*! --bs-gutter-x:0rem; */
  }
   #spotlights .container {
     /*! --bs-gutter-x:0rem; */
  }
   @media (max-width: 640px) {
     #spotlights h2 {
       font-size: 36px;
    }
     #spotlights .btn-get-started, #spotlights .btn-watch-video {
       font-size: 14px;
    }
  }

#spotlights.page-section{
  padding: 0px;
  margin-top:-1px
}

 #spotlights div.container {
   width: 100%;
   max-width: 100%;
   padding: 0px;
   margin: 0px;
   color: #fff;
}
 #spotlights a {
   color: #fff;
   
}

 #spotlights .owl-carousel div.container {
   margin: 0px auto;
}
 #spotlights .owl-carousel img {
   position: relative;
}
 #spotlights .owl-carousel div.item {
   height: 100%;
   overflow: hidden;
}
#spotlights div.container .figcaption {
       position: relative;
       background: transparent;
       padding: 50px;
   position: absolute;
   bottom: 0;
   text-shadow: 3px 3px 5px #333;
  
/*   margin-left: 300px; */
}
 #spotlights .owl-carousel .owl-dots {
   list-style: none;
   margin: auto;
   padding: 15px 0px 0px 0px;
   /*! width: 50%; */
   text-align: center;
}
 #spotlights .owl-carousel div.owl-dots .owl-dot {
   display: inline-block;
   padding: 5px;
}
 #spotlights .owl-carousel div.owl-dots .owl-dot.active span {
   background: #C8102E;
}
 #spotlights .owl-carousel div.owl-dots .owl-dot span {
   width: 15px;
   height: 15px;
   display: block;
   background: #666;
   background: rgba(0, 0, 0, 0.3);
   cursor: pointer;
   text-indent: -9999px;
   -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
   -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
   -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
   box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
}
 #spotlights .owl-carousel .owl-nav {
   display: none;
}
 @media screen and (max-width: 2500px) {
   #spotlights div.container figcaption {
     /*! width: 63%; */
  }
}
   @media screen and (max-width: 1500px) {
     #spotlights div.container figcaption {
       width: 70%;
    }
  }
   @media screen and (max-width: 1200px) {
     #spotlights div.container figcaption {
       width: 77%;
    }
  }
   @media screen and (max-width: 992px) {
     #spotlights div.container .figcaption {
       top: 0;
    }
  }

   @media screen and (max-width: 599px) {
     #spotlights div.container {
       background: #e9e9e9;
      /*padding-top: 30px;
       padding-bottom: 15px;
       */
    }
     #spotlights .owl-carousel div.item {
       max-height: none;
       overflow: visible;
    }
     #spotlights .owl-carousel .owl-dots {
       padding: 15px 0px;
    }
  }

  /* ======================================================================== Social Media Bar ======================================================================== */
   #social-media {
     background: #e9e9e9;
  }
   #social-media div.container {
     margin: 0px auto;
     padding-top: 0px;
     padding-bottom: 0px;
  }
   #social-media #content-info {
     background: transparent;
     height: 40px;
  }
   #social-media #content-info .social-media {
     margin: 0px;
     padding: 3px 15px;
     float: right;
     display: inline-block;
     background: #888B8D;
     border-radius: 0px 0px 10px 10px;
  }
   #social-media #content-info .social-media a:hover {
     background-color: #54585A;
  }
  
  /*============================================================= video background ===============================================================*/
   #spotlights div.item video {
     width:100%;
/*      height:; */
  }
   @media screen and (max-width: 2500px) {
     #spotlights div.video-item, #spotlights .item {
       height:750px;
    }
  }
   @media screen and (max-width: 1500px) {
     #spotlights div.video-item, #spotlights .item {
       height:700px;
       width:1500px;
    }
  }
   @media screen and (max-width: 1200px) {
     #spotlights div.video-item, #spotlights .item {
       height:562px;
       width:1200px;
    }
  }
   @media screen and (max-width: 992px) {
     #spotlights div.video-item, #spotlights .item {
       height:665px;
       width:992px;
    }
  }
   @media screen and (max-width: 768px) {
     #spotlights div.video-item, #spotlights .item {
       height:360px;
       width:768px;
    }
  }
  /*hide video when screen is small*/
   @media screen and (max-width: 599px) {
     #spotlights div.item video {
       display: none 
    }
  }
  
     #spotlights div.item figcaption {
       float:left;
       width:25em;
    }
  }
   @media screen and (max-width: 481px) {
     #spotlights div.video-item, #spotlights .item {
       width:481px!important;
       height:270px;
    }
     #spotlights div.item figcaption {
       float:left;
       width:14em;
    }
  }
  /** * Template Name: Impact * Updated: May 30 2023 with Bootstrap v5.3.0 * Template URL: https://bootstrapmade.com/impact-bootstrap-business-website-template/ * Author: BootstrapMade.com * License: https://bootstrapmade.com/license/ */
  /*-------------------------------------------------------------- # Set main reusable colors and fonts using CSS variables # Learn more about CSS variables at https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties --------------------------------------------------------------*/
  
  /* Smooth scroll behavior */
   :root {
     scroll-behavior: smooth;
  }
   
  /*-------------------------------------------------------------- # Sections & Section Header --------------------------------------------------------------*/

   .sections-bg {
     background-color: #f6f6f6;
  }
   .section-header {
     text-align: center;
     padding-bottom: 60px;
  }
   .section-header h2 {
     font-size: 32px;
     font-weight: 600;
     margin-bottom: 20px;
     padding-bottom: 20px;
     position: relative;
  }
   .section-header h2:after {
     content: "";
     position: absolute;
     display: block;
     width: 50px;
     height: 3px;
     background: var(--color-primary);
     left: 0;
     right: 0;
     bottom: 0;
     margin: auto;
  }
   .section-header p {
     margin-bottom: 0;
     color: #6f6f6f;
  }

  /*-------------------------------------------------------------- # Scroll top button --------------------------------------------------------------*/
   .scroll-top {
     position: fixed;
     visibility: hidden;
     opacity: 0;
     right: 15px;
     bottom: -15px;
     z-index: 99999;
     background: var(--color-secondary);
     width: 44px;
     height: 44px;
     border-radius: 50px;
     transition: all 0.4s;
  }
   .scroll-top i {
     font-size: 24px;
     color: #fff;
     line-height: 0;
  }
   .scroll-top:hover {
     background: rgba(248, 90, 64, 0.8);
     color: #fff;
  }
   .scroll-top.active {
     visibility: visible;
     opacity: 1;
     bottom: 15px;
  }
  /*-------------------------------------------------------------- # Preloader --------------------------------------------------------------*/
   #preloader {
     position: fixed;
     inset: 0;
     z-index: 999999;
     overflow: hidden;
     background: #fff;
     transition: all 0.6s ease-out;
  }
   #preloader:before {
     content: "";
     position: fixed;
     top: calc(50% - 30px);
     left: calc(50% - 30px);
     border: 6px solid #fff;
     border-color: var(--color-primary) transparent var(--color-primary) transparent;
     border-radius: 50%;
     width: 60px;
     height: 60px;
     animation: animate-preloader 1.5s linear infinite;
  }
   @keyframes animate-preloader {
     0% {
       transform: rotate(0deg);
    }
     100% {
       transform: rotate(360deg);
    }
  }
  /*-------------------------------------------------------------- # Disable aos animation delay on mobile devices --------------------------------------------------------------*/
   @media screen and (max-width: 768px) {
     [data-aos-delay] {
       transition-delay: 0 !important;
    }
  }
  
  /*-------------------------------------------------------------- # Stats Counter Section --------------------------------------------------------------*/
   .stats-counter {
     padding: 40px 0;
  }
   .stats-counter .stats-item {
     padding: 20px 0;
     border-bottom: 1px solid #e4e4e4;
  }
   .stats-counter .stats-item .purecounter {
     min-width: 90px;
     padding-right: 15px;
  }
   .stats-counter .stats-item i {
     font-size: 44px;
     line-height: 0;
     margin-right: 15px;
  }
   .stats-counter .stats-item span {
     font-size: 40px;
     display: block;
     font-weight: 700;
     color: var(--color-primary);
     line-height: 40px;
  }
   .stats-counter .stats-item p {
     margin: 0;
     font-family: var(--font-primary);
     font-size: 14px;
  }
  
  /*-------------------------------------------------------------- # Portfolio Section --------------------------------------------------------------*/
   .portfolio .portfolio-flters {
     padding: 0 0 20px 0;
     margin: 0 auto;
     list-style: none;
     text-align: center;
  }
   .portfolio .portfolio-flters li {
     cursor: pointer;
     display: inline-block;
     padding: 0;
     font-size: 18px;
     font-weight: 500;
     margin: 0 10px;
     line-height: 1;
     transition: all 0.3s ease-in-out;
  }
   .portfolio .portfolio-flters li:hover, .portfolio .portfolio-flters li.filter-active {
     color: var(--color-primary);
     padding-bottom: 5px;
     border-bottom: 2px solid #c8102e;
     
     
  }
   .portfolio .portfolio-flters li:first-child {
     margin-left: 0;
  }
   .portfolio .portfolio-flters li:last-child {
     margin-right: 0;
  }
   @media (max-width: 575px) {
     .portfolio .portfolio-flters li {
       font-size: 14px;
       margin: 0 5px;
    }
  }
   .portfolio .portfolio-wrap {
     box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
     border-radius: 10px;
     height: 100%;
     overflow: hidden;
  }
   .portfolio .portfolio-wrap img {
     transition: 0.3s;
     position: relative;
     z-index: 1;
  }
   .portfolio .portfolio-wrap .portfolio-info {
     padding: 25px 20px;
     background-color: #fff;
     position: relative;
     border-top: 1px solid #f3f3f3;
     z-index: 2;
  }
   .portfolio .portfolio-wrap .portfolio-info h4 {
     font-size: 18px;
     font-weight: 600;
     padding-right: 50px;
  }
   .portfolio .portfolio-wrap .portfolio-info h4 a {
     color: var(--color-default);
     transition: 0.3s;
  }
   .portfolio .portfolio-wrap .portfolio-info h4 a:hover {
     color: var(--color-primary);
  }
   .portfolio .portfolio-wrap .portfolio-info p {
     color: #6c757d;
     font-size: 14px;
     margin-bottom: 0;
     padding-right: 50px;
  }
   .portfolio .portfolio-wrap:hover img {
     transform: scale(1.1);
  }
  /*-------------------------------------------------------------- # Portfolio Details Section --------------------------------------------------------------*/
   .portfolio-details .portfolio-details-slider img {
     width: 100%;
  }
   .portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet {
     width: 12px;
     height: 12px;
     background-color: rgba(255, 255, 255, 0.7);
     opacity: 1;
  }
   .portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet-active {
     background-color: var(--color-primary);
  }
   .portfolio-details .swiper-button-prev, .portfolio-details .swiper-button-next {
     width: 48px;
     height: 48px;
  }
   .portfolio-details .swiper-button-prev:after, .portfolio-details .swiper-button-next:after {
     color: rgba(255, 255, 255, 0.8);
     background-color: rgba(0, 0, 0, 0.2);
     font-size: 24px;
     border-radius: 50%;
     width: 48px;
     height: 48px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: 0.3s;
  }
   .portfolio-details .swiper-button-prev:hover:after, .portfolio-details .swiper-button-next:hover:after {
     background-color: rgba(0, 0, 0, 0.6);
  }
   @media (max-width: 575px) {
     .portfolio-details .swiper-button-prev, .portfolio-details .swiper-button-next {
       display: none;
    }
  }
   .portfolio-details .portfolio-info h3 {
     font-size: 22px;
     font-weight: 700;
     margin-bottom: 20px;
     padding-bottom: 20px;
     position: relative;
  }
   .portfolio-details .portfolio-info h3:after {
     content: "";
     position: absolute;
     display: block;
     width: 50px;
     height: 3px;
     background: var(--color-primary);
     left: 0;
     bottom: 0;
  }
   .portfolio-details .portfolio-info ul {
     list-style: none;
     padding: 0;
     font-size: 15px;
  }
   .portfolio-details .portfolio-info ul li {
     display: flex;
     flex-direction: column;
     padding-bottom: 15px;
     font-size: 16px;
  }
   .portfolio-details .portfolio-info ul strong {
     text-transform: uppercase;
     font-weight: 400;
     color: #9c9c9c;
     font-size: 12px;
  }
   .portfolio-details .portfolio-info .btn-visit {
     padding: 8px 40px;
     background: var(--color-primary);
     color: #fff;
     border-radius: 50px;
     transition: 0.3s;
  }
   .portfolio-details .portfolio-info .btn-visit:hover {
     background: #009d8b;
  }
   .portfolio-details .portfolio-description h2 {
     font-size: 26px;
     font-weight: 700;
     margin-bottom: 20px;
  }
   .portfolio-details .portfolio-description p {
     padding: 0;
  }
   .portfolio-details .portfolio-description .testimonial-item {
     padding: 30px 30px 0 30px;
     position: relative;
     background: white;
     height: 100%;
     margin-bottom: 50px;
  }
   .portfolio-details .portfolio-description .testimonial-item .testimonial-img {
     width: 90px;
     border-radius: 50px;
     border: 6px solid #fff;
     float: left;
     margin: 0 10px 0 0;
  }
   .portfolio-details .portfolio-description .testimonial-item h3 {
     font-size: 18px;
     font-weight: bold;
     margin: 15px 0 5px 0;
     padding-top: 20px;
  }
   .portfolio-details .portfolio-description .testimonial-item h4 {
     font-size: 14px;
     color: #6c757d;
     margin: 0;
  }
   .portfolio-details .portfolio-description .testimonial-item .quote-icon-left, .portfolio-details .portfolio-description .testimonial-item .quote-icon-right {
     color: #009d8b;
     font-size: 26px;
     line-height: 0;
  }
   .portfolio-details .portfolio-description .testimonial-item .quote-icon-left {
     display: inline-block;
     left: -5px;
     position: relative;
  }
   .portfolio-details .portfolio-description .testimonial-item .quote-icon-right {
     display: inline-block;
     right: -5px;
     position: relative;
     top: 10px;
     transform: scale(-1, -1);
  }
   .portfolio-details .portfolio-description .testimonial-item p {
     font-style: italic;
     margin: 0 0 15px 0 0 0;
     padding: 0;
  }
  
  /*-------------------------------------------------------------- # Frequently Asked Questions Section --------------------------------------------------------------*/
   .faq .content h3 {
     font-weight: 400;
     font-size: 34px;
  }
   .faq .content h4 {
     font-size: 20px;
     font-weight: 700;
     margin-top: 5px;
  }
   .faq .content p {
     font-size: 15px;
     color: #6c757d;
  }
   .faq .accordion-item {
     border: 0;
     margin-bottom: 20px;
     box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.06);
     border-radius: 10px;
  }
   .faq .accordion-item:last-child {
     margin-bottom: 0;
  }
   .faq .accordion-collapse {
     border: 0;
  }
   .faq .accordion-button {
     padding: 20px 50px 20px 20px;
     font-weight: 600;
     border: 0;
     font-size: 18px;
     line-height: 24px;
     color: var(--color-default);
     text-align: left;
     background: #fff;
     box-shadow: none;
     border-radius: 10px;
  }
   .faq .accordion-button .num {
     padding-right: 10px;
     font-size: 20px;
     line-height: 0;
     color: var(--color-primary);
  }
   .faq .accordion-button:not(.collapsed) {
     color: var(--color-primary);
     border-bottom: 0;
     box-shadow: none;
  }
   .faq .accordion-button:after {
     position: absolute;
     right: 20px;
     top: 20px;
  }
   .faq .accordion-body {
     padding: 0 40px 30px 45px;
     border: 0;
     border-radius: 10px;
     background: #fff;
     box-shadow: none;
  }
  
 
   #passion {
     
  }

   #passion_icon {
     position: relative;
     margin-top: -150px;
  }

   .icon-boxes {
     padding-bottom: 60px;
     font-family: milo;
  }

@media (min-width: 1200px){
     #passion_icon:before {
       content: "";
       position: absolute;
       bottom: 50%;
       left: 0;
       right: 0;
       height: 20px;
       background-color: #C8102E;
    }
  }
   .icon-box {
     padding: 30px 30px;
     position: relative;
     overflow: hidden;
     background: #f2f2f2 ;
/*      border: 1px solid #fff; */
     box-shadow: 0 0 29px 0 rgba(0, 0, 0, 0.08);
     transition: all 0.3s ease-in-out;
     border-radius: 8px;
     z-index: 1;
     height: 100%;
     width: 100%;
     text-align: center;
     color: #009786;
  }
   .icon-circle-box {
     padding: 60px 30px;
     position: relative;
     overflow: hidden;
     background: #fff;
    /* box-shadow: 0 0 29px 0 rgba(0, 0, 0, 0.08);
     */
     transition: all 0.3s ease-in-out;
     border-radius: 50%;
     z-index: 1;
     height: 10em;
     width: 10em;
     text-align: center;
     border: #888B8D solid 2px;
     display: flex;
     justify-content: center;
     align-content: center;
     font-weight: 700;
     margin-bottom: 15px;
     font-size: 24px;
  }

   .icon-no-box {
     padding: 60px 30px;
/*      background: #fff; */
     transition: all 0.3s ease-in-out;
     z-index: 1;
     height: 10em;
     width: 10em;
     text-align: center;
     display: flex;
     justify-content: center;
     align-content: center;
     margin-bottom: 15px;
     font-size: 24px;
  }

.impact-numb {
  font-size: 3em;
  font-weight: bold;
  color: #888B8D;
}
   .icon-circle-box .title a {
     color: #f9f9f9;
     transition: 0.3s;
  }
   .icon-box .icon {
     margin-bottom: 20px;
     padding-top: 10px;
     display: inline-block;
     transition: all 0.3s ease-in-out;
     font-size: 5em;
     line-height: 1;
     color: #C8102E;
  }
   .icon-circle-box .icon {
     display: inline-block;
     transition: all 0.3s ease-in-out;
     font-size: 5.5em;
     line-height: 1;
     color: #888B8D;
     margin-top:-10px;
  }

.icon-no-box .icon {
     display: inline-block;
     transition: all 0.3s ease-in-out;
     font-size: 5.5em;
     line-height: 1;
     color: #960C22;
     margin-top:-10px;
  }
   .icon-circle-box:hover, .icon-box:hover {
     background: #888B8D;
  }

   .icon-box:hover {
     background: #960C22;
  }
   .icon-circle-box:hover .title a, .icon-box:hover .title a, .icon-circle-box:hover .icon, .icon-box:hover .icon {
     color: #fff;
  }
.icon-boxes .title, .icon-boxes .title {
  font-family: 'Milo';
  font-weight: bold;
    color: #888B8D;
}

  /*-------------------------------------------------------------- # Bootstrap Mod --------------------------------------------------------------*/


.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #960C22;
  --bs-btn-border-color: #960C22;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #640817;
  --bs-btn-hover-border-color: #C8102E;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #C8102E;
  --bs-btn-active-border-color: #0a53be;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #960C22;
  --bs-btn-disabled-border-color: #960C22;
}

.btn-cougar {
  --bs-btn-color: #fff;
  --bs-btn-bg: #C8102E;
  --bs-btn-border-color:#C8102E;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #640817;
  --bs-btn-hover-border-color: #C8102E;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #C8102E;
  --bs-btn-active-border-color: #640817;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg:#C8102E;
  --bs-btn-disabled-border-color: #C8102E;
}


  /*-------------------------------------------------------------- # Impact --------------------------------------------------------------*/

#impact {
  background-color: #f2f2f2;
}
.progress {
      height: 3em;
}
[data-aos="progress-bar"] {
  width: 0%;
  transition-property: transform, width;
}

[data-aos="progress-bar-5"].aos-animate {
  width: 5%;
}

[data-aos="progress-bar-10"].aos-animate {
  width: 10%;
}

[data-aos="progress-bar-15"].aos-animate {
  width: 15%;
}

[data-aos="progress-bar-20"].aos-animate {
  width: 20%;
}

[data-aos="progress-bar-25"].aos-animate {
  width: 25%;
}

[data-aos="progress-bar-30"].aos-animate {
  width: 30%;
}

[data-aos="progress-bar-35"].aos-animate {
  width: 35%;
}

[data-aos="progress-bar-40"].aos-animate {
  width: 40%;
}
[data-aos="progress-bar-45"].aos-animate {
  width: 45%;
}
[data-aos="progress-bar-50"].aos-animate {
  width: 50%;
}
[data-aos="progress-bar-55"].aos-animate {
  width: 55%;
}
[data-aos="progress-bar-60"].aos-animate {
  width: 60%;
}
[data-aos="progress-bar-65"].aos-animate {
  width: 65%;
}
[data-aos="progress-bar-70"].aos-animate {
  width: 70%;
}
[data-aos="progress-bar-75"].aos-animate {
  width: 75%;
}
[data-aos="progress-bar-80"].aos-animate {
  width: 80%;
}
[data-aos="progress-bar-85"].aos-animate {
  width: 85%;
}
[data-aos="progress-bar-90"].aos-animate {
  width: 90%;
}
[data-aos="progress-bar-95"].aos-animate {
  width: 95%;
}
[data-aos="progress-bar-100"].aos-animate {
  width: 100%;
}

  
/* --- scroll top button -- */


.btn-top {
  display: none;
  cursor: pointer;
  position: fixed; 
  bottom: 20px;
  right: 30px;
  z-index: 99;
 width: 60px;
  height: 60px;
  border-radius: 15px;
  background-color: rgb(12, 12, 12);
  color: white;
  border: none;

}

.btn-top i {
 /*! margin: auto; */
     padding: 20px;
     display: inline-block;
     transition: all 0.3s ease-in-out;
     font-size: 1em;
     line-height: 1;
}

.collapse.in {
    display: block;
}

/* for NDC */

.deco-line {
  position: relative;
  max-width: 100%;
  margin-bottom: 12px;
  text-align: center;
}

.deco-line:before {
   content:" ";
  display: block;
  height: 3px;
  width: 45%;
  position: absolute;
  top: 50%;
  left: 0;
  background: #C8102E;
}

.deco-line:after {
  content:" ";
  display: block;
  height: 3px;
  width: 45%;
  position: absolute;
  top: 50%;
  right: 0;
  background: #C8102E;
}

.coogs {
    
    color: #C8102E;
}