/* dynamic.css.jinja2 */



body {
  line-height: 1.5;
  font-family: "Roboto Condensed", sans-serif;
  -webkit-font-smoothing: antialiased;
}

p {
  font-family: "Roboto Condensed", sans-serif;
  color: black;
  font-size: 1.8rem;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
}

ol, ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

/*navbar styles*/

.full-width-container {
  background-color: white;
  transition: background-color 0.3s ease;

}
.full-width-container:hover{
  background-color: white;
}

.full-width-container:hover .navbar a{
  color: ;
}

.navbar a,
.navbar {
  font-size: 16px !important;
  }

.navbar a:hover {
  background-color: #e3e3e3 !important;
  border-radius: 5%;
  color: #000000 !important;
}

.navbar .nav-item.active > a {
  background-color: #e3e3e3 !important;
  border-radius: 5%;
  color: #000000 !important;
}
.logo img{
  width:100px;
  height:90px;
  object-fit: contain;
}

/* Home page specific navbar styles */
body.home .full-width-container {
  background-color: transparent;
}

body.home .full-width-container:hover {
  background-color: white;
}

body.home .full-width-container:hover .navbar a,
body.home .full-width-container:hover .navbar {
  color: #000000;
}

body.home .navigation .navbar-nav > li > a {
  color: #e3e3e3;
  font-weight: 600;
}

body.home .full-width-container:hover .tf-ion-android-cart,
body.home .full-width-container:hover .cart-word,
body.home .full-width-container:hover .cart-number {
  color: #000000 !important;
}

body.home .tf-ion-android-cart,
body.home .cart-word,
body.home .cart-number {
    color: white ;
  }
body.home .hero-link {
    font-size: 2.5rem;
}

body.home .hero-link:hover {
    color: ;
}

/* Category Button styles */
.category-button {
    background-color: white;
    color: #000000;
    font-weight: 500;
}

.category-button::before {
    background-color: #000000;
}

.category-button:hover {
    color: white;
}

/* Product Category Styles */
.product-category .content h3.cat-label {
    font-size: 4.0rem;
    font-weight: 400;
    font-family: "Roboto Condensed", sans-serif;
    
}

.product-category .content p {
    font-size: 1.8rem;
    font-family: "Roboto Condensed", sans-serif;
    line-height: 1.6;
    
}

.product-category .content .btn-main {
    font-size: 2.5rem;
    background-color: #e3e3e3;
    border: 1px solid #000000;
    color: #000000;
    font-weight: 500;
}

.product-category .content .btn-main:hover {
    background-color: white;
    color: #000000;
    font-weight: 500;
}

#second-cat-section {
    background-color: white;
    
}
#first-cat-section{
    background-color: white;
    color: #000000;
}
#first-cat-section p{
  color: #000000;
}

#second-cat-section p{
   
    color: #000000;
}
.product-section{
    background-color: white;
}

#contact-info {
    background-color: #e3e3e3;
    color: black;
    
}
.product-item{
}


.product-item h3 {
    font-size: 3.5rem;

}

#inspirational-message h2 {
    font-size: 3.0rem;
    color: white; 
    line-height: 1.6;
}


#contact-info i,
#contact-info span {
    font-size: 1.8rem;
}

.product-item .btn,
.about-btn {
    font-size: 2.5rem;
    background-color: #e3e3e3;
    color: #000000;
    border: 1px solid #000000;
    font-weight: 500;
}


.product-item .btn:hover,
.about-btn:hover {
    background-color: white;
    color: #000000;
}

#about-message .content {
   color: white;
}

.contact-form {
   background-color: white;
}

.us{
  color: #e3e3e3; 
  font-weight: 500;
}
.contact-side-card {
  background-color: #e3e3e3;
  color: ; 
}

.contact-side-card p, h1 {
  color: black;
}
.contact-details {
 background-color:#e3e3e3;
}
 
.contact-short-info span{
    color: black;
    font-size: 1.8rem;
}

.contact-container{
border: 1px solid #e3e3e3; 
}

.faq-question {
background_color:#e3e3e3;
font-size:3.0rem
}
.faq-answer{
background_color:#000000;
font-size:1.8rem
}
.faq-container {
 background-color:white;
}
.faq-item{
background_color:#e3e3e3;
}



.products{
 background-color: white;
}


.product-item h3 {
    font-size: 4.0rem;
}

.product-item .btn {
    font-size: 2.5rem;
    background-color: #e3e3e3;
    border: 1px solid #000000;
    color: #000000;
    
}
.product-item .btn:hover {
    background-color: white;
    color: #000000;
}
#itemName {
    font-size: 4.0rem;
    color: black;
}

#itemPrice {
    font-size: 3.5rem;
    color: black;
}

.description-text{
  font-size: 1.8rem;
}

.show-more{
 font-size: 2.5rem;
}

 .product-item .col-md-8 {
    font-size: 4.0rem;
  }
  
  .product-item .col-md-8 #itemName {
    font-size: 4.0rem;
  }
  
  .product-item .col-md-8 #itemPrice {
    font-size: 4.0rem;
  }

  .col h3 {
    font-size: 4.0rem;
}

.description-style {
    color: black;
    font-size: 3.5rem;
}
.description-style a {
    color: black; 
}

.feature {
    background-color: #e3e3e3;
    color: black;
}
.hero-text p {
    color: white;
    font-size: 3.5rem;
}
.product-highlight {
  background-color: white;
}
#who-we-are{
  background_color: white;
}

.product-highlight .text h2 {
    color: black;
}

.product-highlight .text p {
    color: grey;
    font-size: 1.8rem;
    line-height: 1.6;
}

.page-wrapper{
    background-color: white;
}
.cart-title{
  color: black;
}
.cart-box{
 background-color: #e3e3e3;
}
.item-price,
.item-quantity,
.item-subtotal {
font-size: 1.8rem;
}
.item-price, .item-quantity, item-subtotal, .label{
 color: black;
}
.final-total{
font-size: 3.0rem;
}

.btn-continue {
  background-color: #e3e3e3;
  color: #000000;
}

.btn-checkout {

  color: #000000;
}
.btn-checkout:hover {
  background-color: white;
  color: #000000;
}

.btn-checkout:disabled {
  background-color: #cccccc;
 
}

.checkout-form input {
  color: #000000;

}

.btn-continue, .btn-checkout {
  font-size: 2.5rem;
}

.footer {
    background-color: #000000 !important;
}

.footer ul.footer-menu,
.footer ul.footer-menu li,
.footer ul.footer-menu li a,
.footer p.copyright-text,
.footer p.copyright-text a {
    color: white !important;
}

.footer ul.footer-menu li a,
.footer p.copyright-text a {
    text-decoration: underline;
}

.footer ul.footer-menu li a:hover,
.footer p.copyright-text a:hover {
    color: white !important;
    opacity: 0.8;
}


@media (max-width: 768px) {
  .full-width-container {
    background-color: white;
  }
  
  .full-width-container:hover {
    background-color: white;
  }
  
  .tf-ion-android-cart,
  .cart-word,
  .cart-number {
    color: #000000 !important;
  }
  
  .mobile-nav .navbar-toggle {
    border-color: #000000;
  }
  
  .mobile-nav .navbar-toggle .icon-bar {
    background-color: #000000;
  }
  
  .mobile-nav .menu-title {
    color: white;
  }
  
  .mobile-nav .navbar-toggle:hover,
  .mobile-nav .navbar-toggle:focus {
    background-color: #000000;
  }
  
  .navbar-collapse {
    background-color: #000000;
  }
  
  .navbar-nav > li > a {
    color: white !important;
  }
  
  .navbar-nav > li > a:hover,
  .navbar-nav > li > a:focus {
    background-color: #000000 !important;
    color: white !important;
  }
  
  .navbar-nav .dropdown-menu {
    background-color: white;
  }
  
  .navbar-toggle .icon-bar {
  background-color: #000000!important;
}

  .navbar-nav .dropdown-item {
    color: #000000;
  }
  
  .navbar-nav .dropdown-item:hover,
  .navbar-nav .dropdown-item:focus {
    color: #000000;
    background-color: white;
  }
  
  .navbar-nav .dropdown-toggle {
    color: white !important;
  }

   body.home .full-width-container {
        background-color: white;
    }

   
  contact-side-card h1{
     font-size: 1.8rem
  }
}


@media (min-width: 800px) {
    .full-width-container.scrolled {
        background-color: white !important;
    }
    .scrolled .navbar a,
    .scrolled .tf-ion-android-cart,
    .scrolled .cart-word,
    .scrolled .cart-number {
        color: #000000 !important;
    }
    .scrolled .navbar a:hover
     {
        color: #000000 !important;
    }
}


@media (max-width: 800px) {
    .full-width-container.scrolled  {
        background-color: white;
    }
    .scrolled .tf-ion-android-cart,
    .scrolled .cart-word,
    .scrolled .cart-number {
        color: #000000 !important;
    }
}

