/* Universal Styles Frequently Applied Styles */
*{
    margin:0px;
    padding: 0px;
    box-sizing: border-box;
}

.text-justify{
  text-align: justify;
}

.bg-yellow{
  box-shadow: -2px 10px 22px -15px rgba(0,0,0,0.75);
}
.navbar {
  box-shadow: none;
  
}

.padding-top-10{
  padding-top:10%
}
.padding-top-5{
  padding-top: 5%;
}

.margin-bottom-10{
  margin-bottom:10%;
}
.margin-bottom-5{
  margin-bottom:5%;
}

.bottom-shadow-1{
  /* box-shadow: 0px 3px 2px -1px rgba(0,0,0,0.75); */

}
.navbar-toggler-icon{
  color: #000;
}

.card-title-custom{
  font-size: 1.4rem;
}


/* Custom Backgrounds Here */

.footer_custom {
    background-image : linear-gradient(to right bottom, rgba(59, 59, 59, 0.85), rgba(43, 41, 39, 0.886)),url(../img/office.jpg);
    background-repeat: no-repeat;
    background-size:cover;
}

.bg-primary-custom{
    background-image : linear-gradient(to right bottom, rgba(139, 32, 18, 0.733), rgba(27, 136, 163, 0.849)),url(../img/portfolio-2.jpg);
    background-repeat: no-repeat;
    background-size:cover;

}

.bg-primary-custom-2{
  background-image : linear-gradient(to right bottom, rgba(139, 32, 18, 0.425), rgba(27, 136, 163, 0.596)),url(../img/5362.jpg);
  background-repeat: no-repeat;
  background-size:cover;

}

.bg-product-home{
  background-image : linear-gradient(to right bottom, rgb(166, 212, 214), rgba(104, 37, 20, 0.849)),url(../img/portfolio-2.jpg);
  background-repeat: no-repeat;
  background-size:cover;

}


.bg-about-header{
    background-image : linear-gradient(to right bottom, rgba(139, 32, 18, 0.95), rgba(27, 136, 163, .9)),url(../img/woman-506322_1280.jpg);
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center;
}

.bg-career-header{
    background-image : linear-gradient(to right bottom, rgba(18, 131, 139, 0.933), rgba(27, 136, 163, .9)),url(../img/career-bg.png);
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center;

}

.bg-clients{
  background-image : linear-gradient(to right bottom, rgba(130, 202, 235, 0.733), rgba(27, 136, 163, .8)),url(../img/clients_bg.jpg);
  background-repeat: no-repeat;
  background-size:cover;
  background-position: center;
}

.bg-contact-header {
  background: linear-gradient(45deg, rgba(233, 231, 230, 0.288) 20%, rgba(233, 233, 233, 0.489) 100%), url("../img/contact-bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.bg-product{
  
  background: rgb(110,70,70);
  background: linear-gradient(90deg, rgb(117, 79, 79) 0%, rgba(73, 144, 158, 0.849) 47%, rgba(46,134,151,1) 100%);

}

.bg-featured-product{
  
  background: rgb(110,70,70);
  background: linear-gradient(90deg, rgb(20, 139, 160) 0%, rgba(14, 102, 119, 0.849) 47%, rgb(1, 53, 63) 100%);

}
/* Navigation Section Styling */

.bg-nav{
    background-color: #fcfcfc;

}
.sticky-top {
    position: fixed;
    top: 0;
    width: 100%;

}
.company-name{
    padding-left: 15px;
    /* font-family: 'Righteous'; */
    font-size: 2rem;
}
.company-name-initial{
    font-size: 2.4rem;
}
.navbar-nav .nav-item{
    padding-right: 10px;
    font-size: 1.1rem;
}



/* CLIENTS SECTION STYLING */


.client-logo{
    height: 130px;
    width: 40px;
    display: inline-block;
    padding-right: 20px;

}

.padding-inside{
    padding-top: 3rem;
    padding-bottom: 60px;
}

.padding-bottom-2{
    padding-bottom: 2rem;
}



/* ABout US PAGE STYLING */

.team-boxed {
    color:#313437;
    background-color:#eef4f7;
  }
  
  .team-boxed p {
    color:#7d8285;
  }
  
  .team-boxed h2 {
    font-weight:bold;
    margin-bottom:40px;
    padding-top:40px;
    color:inherit;
  }
  
  @media (max-width:767px) {
    .team-boxed h2 {
      margin-bottom:25px;
      padding-top:25px;
      font-size:24px;
    }
  }
  
  .team-boxed .intro {
    font-size:18px;
    max-width:80%;
    margin:0 auto;
  }
  
  .team-boxed .intro p {
    margin-bottom:0;
  }
  
  .team-boxed .people {
    height: 100%;
  }
  
  .team-boxed .item {
    text-align:center;
  }
  
  .team-boxed .item .box {
    text-align:center;
    padding:30px;
    background-color:#fff;
    margin-bottom:30px;
    height: 100%;
  }
  
  .team-boxed .item .name {
    margin-top:28px;
    margin-bottom:8px;
    color:inherit;
  }
  
  .team-boxed .item .title {
    text-transform:uppercase;
    font-weight:bold;
    color:#d0d0d0;
    letter-spacing:2px;
    font-size:13px;
  }
  
  .team-boxed .item .description {
    font-size:15px;
    margin-top:15px;
    margin-bottom:20px;
  }
  
  .team-boxed .item img {
    max-width:160px;
  }
  
  .team-boxed .social {
    font-size:18px;
    color:#a2a8ae;
  }
  
  .team-boxed .social a {
    color:inherit;
    margin:0 10px;
    display:inline-block;
    opacity:0.7;
  }
  
  .team-boxed .social a:hover {
    opacity:1;
  }
  
  

/* PRODUCT PAGE STYLES */

.product-header {
    min-height: 30rem;
    position: relative;
    display: table;
    width: 100%;
    height: auto;
    padding-top: 8rem;
    padding-bottom: 8rem;
    background-color: #f0f1f3;
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .product-header h1 {
    font-size: 4rem;
    margin: 0;
    padding: 0;
  }
  
  #products .padding-custom-description{
    padding:50px;
  }
  
  #products .image-product{
    display: flex;
    justify-content: center;
    align-self: center;
  }
  
  
  #products .padding-custom-description p {
    font-size: 1.2rem;
  }
  
  
  @media (min-width: 992px) {
    .product-header {
      height: 100vh;
    }
    .product-header h1 {
      font-size: 5.5rem;
    }
  }




/* CONTACT PAGE STYLES */

.contact-header {
    min-height: 30rem;
    position: relative;
    display: table;
    width: 100%;
    height: auto;
    padding-top: 2rem;
    padding-bottom: 8rem;
    /* background-color: #f0f1f3; */
    background: linear-gradient(45deg, rgba(133, 55, 11, 0.69) 20%, rgba(87, 85, 85, 0.952) 100%), url("../img/contact-bg.jpg");
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}


.contact-form input::placeholder{
  color: rgb(219, 219, 219);
}

/* Footer styles here */

.address-line{
  margin-bottom:5px;
}


/* carousel code */
/* Products slider home page*/

#home-product-slider {
  padding-top: 5%;
  padding-bottom: 2%;
}

#home-product-slider .carousel .carousel-control-prev {
  position: absolute;
  left: -12%;
}

#home-product-slider .carousel .carousel-control-next {
  position: absolute;
  right : -12%;
}

#home-product-slider .carousel .carousel-control-prev-icon{
  background-color: #000;
}

#home-product-slider .carousel .carousel-control-next .control-icon,
#home-product-slider .carousel .carousel-control-prev .control-icon
{
  color: rgb(34, 116, 148);
  font-size: 1.7em;
}

/* Responsive code */


@media (max-width: 768px) {
  .padding-top-10{
    padding-top: 25%;
  }

  /* slider responsive code */

  #home-product-slider .carousel .carousel-control-prev {
    position: absolute;
    left: -12%;
  }
  
  #home-product-slider .carousel .carousel-control-next {
    position: absolute;
    right : -12%;
  }
  
}

/* SAYAK FEATURES CUSTOM CODES */

.sayak-features{
/* no styles for now */
}

.sayak-features i{
  font-size: 2.5rem;
  padding-bottom: 1rem;
}


@media (max-width: 576px) {

    /* slider responsive code */

    #home-product-slider .carousel .carousel-control-prev {
      position: absolute;
      left: -8%;
    }
    
    #home-product-slider .carousel .carousel-control-next {
      position: absolute;
      right : -8%;
    }

}
    
    

/*--- Bootstrap Padding Fix --*/
[class*="col-"] {
    padding: 1rem;
}


/*
Extra small (xs) devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap

Small (sm) devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

Medium (md) devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

Large (lg) devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

Extra (xl) large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
*/




/* ANIMATIONS AND STUFF */

.animate-left{
    animation-name: moveInLeft;
    animation-duration:1s;
    animation-timing-function: ease-out;

}

.animate-right{
    animation-name: moveInRight;
    animation-duration:1s;
    animation-timing-function: ease-out;
}

.animate-bottom{
    animation-name: moveInBottom;
    animation-duration: 1s;
    animation-timing-function: ease-in;
    animation-fill-mode: backwards;
}


/* ANIMATION KEYFRAMES HERE */

@keyframes moveInLeft{

    0%{
        opacity: 0;
        transform: translateX(-100px)
    }

    80%{    
        transform: translateX(10px);

    }

    100%{
        opacity: 1;
        transform: translate(0) ;
    }

}

@keyframes moveInRight{
    0%{
        opacity: 0;
        transform: translateX(100px);
    }
    80%{
        transform:translateX(-10px)
    }
    100%{
        opacity: 1;
        transform: translateX(0)
    }
}

@keyframes moveInBottom{
    0%{
        opacity: 0;
        transform: translateY(10px);
    }
    100%{
        opacity: 1;
        transform: translateY(0)
    }
}