/***********************************
*
* author: Elkay
* date : 31-01-21
*
***********************************/

 /*css settings for all pages*/

 /*css settings for index.html and base.html page*/


@font-face {
    font-family: lato;
    src: url("../fonts/Lato-Regular.ttf");
}

@font-face {
    font-family: lato;
    src: url("../fonts/Lato-Bold.ttf");
    font-weight: bold;
}

body {
    font-family: lato, cursive !important;
    margin: 0;
    padding: 0;
    border: 0;
}

p {
    font-size: 16px;
    letter-spacing: 1px;
    word-spacing: 2px;
    line-height: 20px;
}

.nav .nav-item {
    font-size: 20px;
    animation: linear;
    transition-duration: 1s;
}

#menu-item-mail:hover, #menu-item-phone:hover {
    font-size: 1.5em;
}

#collapsibleNavbar li[class~=my-menu-list] .nav-link {
    color: rgb(2, 117, 216);
    animation: linear;
    transition-duration: 0.3s;
}

#collapsibleNavbar .my-menu-list:hover {
    background-color: rgba(2, 117, 216, 0.5);
    border-radius: 5px;
}

#collapsibleNavbar .my-menu-list:hover > .nav-link {
    color: white;
}

#contact-us-details a {
    text-decoration: none;
    animation: linear;
    transition-duration: 0.3s;
}

#contact-us-details a:hover {
    font-size: 1.05em;
}

#categories img, #brands img {
    animation: linear;
    transition-duration: 0.5s;
}


#carousel_background {
    height: 101%;
    width: 100%;
    background: linear-gradient(78deg, rgba(137, 159, 245, 0.8855917366946778) 40%, rgba(0, 215, 255, 0.4766281512605042) 72%);
    clip-path: polygon(0 29%, 30% 50%, 0 100%, 23% 100%, 50% 70%, 36% 100%, 56% 100%, 70% 50%, 66% 100%, 87% 100%, 100% 32%);
    position: absolute;
    z-index: -1;
}


#thumbnail-slider-track .splide__slide, #products_slider .splide__slide{
  opacity: 0.6;
}

#thumbnail-slider-track .splide__slide.is-active , #products_slider .splide__slide.is-active{
  opacity: 1;
}

#thumbnail-slider-track .splide__slide.is-active {
    border: 3px solid rgba(255, 69, 0, 0.5) !important;
}


#products_slider .products_label{
    font-size: 1.2em;
}

#about_us_section {
    position: relative;
    background-color: rgba(255, 255, 255, .8);
    /*background-size: 50% auto;*/
}

.bg {
    animation: slide 3s ease-in-out infinite alternate;
    background-image: linear-gradient(-60deg, orangered 50%, #09f 50%);
    bottom: 0;
    left: 1px;
    opacity: .5;
    position: absolute;
    right: 1px;
    top: 0;
    z-index: -1;
    width: 60%;
}

.bg2 {
    animation-direction: alternate-reverse;
    animation-duration: 3s;
}

.bg3 {
    animation-duration: 5s;
}

@keyframes slide {
    0% {
        transform: translateX(0%); /*  skewY(0deg)  */
    }
    100% {
        transform: translateX(60%); /* skewY(-360deg)  */
    }
}


#about_us_section .about_image{
    animation: flip-image 3s ease-in-out infinite alternate;
}

@keyframes flip-image {
  0% {
    transform: perspective(400px) scaleX(1);
  }

  100% {
    transform: perspective(400px) scaleX(-1);
  }
}

.whatsapp-link{
    font-size: 1.3em;
    color: #1cf721;
}

/* css settings for products.html page */

/*#categories img:hover, #brands img:hover {*/
/*    height: 101%;*/
/*    width: 101%;*/
/*}*/

/*#categories .card-body {*/
/*    color: rgba(00, 00, 00, 1);*/
/*    animation: linear;*/
/*    transition-duration: 0.5s;*/
/*}*/

/*#categories img:hover ~ .card-body {*/
/*    font-size: 1.5em;*/
/*    color: rgba(255, 255, 255, 1);*/
/*    background-color: rgba(2, 117, 216, 0.5);*/
/*    border-radius: 0 0 20px 20px;*/
/*}*/

#top_brands_section .img-container img, #top_categories_section img{
    max-height: 300px;
}
