/* CSS Document */
html {
  scroll-behavior: smooth;
  font-family:lato;
}
.bg-color {
/*background: linear-gradient(to bottom, rgba(255, 255, 255, 0.73) 50%, rgba(229, 229, 229, 0.10) 100%) !important;*/
background-color:#FFFFFF !important;
}
nav#topnav{
    height:70px;
}
.navbar-light .navbar-brand {
    position: relative;
    margin-top: 1em;
    margin-left: 0;
}

.nav-item a{
color:#231e80 !important;
text-transform:uppercase;
font-size:15px;
font-family:lato;
letter-spacing:1px;
font-weight:bold;
}
a.nav-link {
    padding-right: 2em !important;
}
.nav-link::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #ff4200;
    transition: width .3s;
}

.nav-link:hover::after {
    width: 100%;
   transition: width .3s;
}
.nav-item a:hover{
color:#130e70 !important;
}
.nav-item a:active{
/*background: -webkit-linear-gradient(left, #e4242d 50%, #85c347 50%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;*/
color:#130e70 !important;
}

.dropdown:hover .dropdown-menu {
  display: block;
}

.carousel-control {
  width: 30px;
  height: 30px;
  top: -35px;

}
.left.carousel-control {
  right: 30px;
  left: inherit;
}
.carousel-control .glyphicon-chevron-left, 
.carousel-control .glyphicon-chevron-right {
  font-size: 12px;
  background-color: #fff;
  line-height: 30px;
  text-shadow: none;
  color: #333;
  border: 1px solid #ddd;
}
/*banner animation*/
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
  opacity:0;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}
.fade-in.one {
  -webkit-animation-delay: 0.9s;
  -moz-animation-delay: 0.9s;
  animation-delay: 0.9s;
}

.mega-ul li{
list-style-type:none;
}

.carousal_btn{
background-color:#fad21b;
padding:2px 12px 2px 12px;
font-size:18px;
color:#000000;
border-bottom: 8px solid;
-webkit-border-image: -webkit-linear-gradient(
        left,
        rgb(255, 255, 255) 40%,
        rgb(227, 29, 46) 60%,
        rgb(127, 192, 62) 30%
    ) 0 0 100% 0/0 0 3px 0 stretch;
text-align:right;
font-family:lato; 
}
.para_carousal{
font-family:lato;
font-size:18px;
font-weight: lighter !important;
}
.carousal_captionpara{
font-family:lato; 
font-size:24px;
font-weight: 500;
}
.slider-indicators li {
  border-radius: 50%;
  width:10px;
  height:10px;
}
.carousel-caption{
left:50%;
bottom:5em;
}

.section1{
background-color:#24278a;
color:#FFFFFF;
padding:1.5em;
}
.btn_design{
background-color:#FFFFFF; 
color:#231e80; 
padding:5px;
font-family:lato;
font-size:18px;
padding-right:20px;
padding-left:20px;
font-weight:bold;
text-transform:uppercase;
}
.heading1{
font-size:28px;
font-family:lato; 
text-align: right;
text-transform:uppercase;
letter-spacing: 3px;
font-weight: bold;
}
.section2{
padding:3em;
}
.heading2{
font-size:25px;
font-family:lato; 
font-weight: bold;
text-align: left;
color:#231e80;
}
.para1{
text-align: justify;
font-family:lato;
font-size:17px;
color:#1a1a1a;
}
.para2{
text-align: justify;
font-family:lato;
font-size:17px;
color: #1a1a1a;
margin-top:10px;
}
.about_img{
margin-top:2em;
 width:400px;
  height:180px; 
}
/*section4*/
.section4{
background-image:url('../images/managing.jpg');
padding:4.8em;
background-repeat:no-repeat;
}
.flex_row{
display: flex;
flex-wrap: wrap;
}
.flex_row1{
flex:1;
}
.design_heading{
font-size:32px;
font-family:lato; 
color:#FFFFFF;
font-weight:100!important;
}
.design_para{
font-family:Montserrat;
font-size:15px;
color: #FFFFFF;
font-weight:lighter;
}
.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 16px;
  font-family:lato; 
  color:#FFFFFF;
  font-size:20px;
}
.design_icon{
color:#e5cc91;
font-family:lato; 
font-size:14px;
text-align: left;
font-weight:bold;
}
/*section5*/
.section5{
padding:3em;
background-color:#fbebcc;
}
.dream_heading{
font-size:25px;
font-family:lato; 
font-weight: bold;
text-align:center;
color:#231e80;
text-transform:uppercase;
}
.dream_btn{
font-family:lato;
background-color:#231e80;
color:#FFFFFF;
font-weight:bold;
padding:5px;
padding-right:10px;
padding-left:10px;
}
/*tab*/
.featured_sec{
background-color:#231e80;
padding:3em;
}
.featured_header{
font-size:20px;
font-weight:bold;
font-family:lato;
color:#FFFFFF;
text-transform:uppercase;
}
.featured_para{
font-size:16px;
font-family:lato;
color:#FFFFFF;
}
.blog_carousal li{
border-radius: 50%;
  width:12px;
  height:12px;
  margin-top:20px !important;
  background-color:#FFFFFF;
}
/*manufacturing*/
.section7{
padding:2em;
}
.manufacture_img{
width:500px;
height:300px;
border-radius: 10px;
}
.manufacturing_para1{
text-align: left;
font-family:lato;
font-size:18px;
color:#1a1a1a;
}
/*client*/
.client_slider{
background-color:#ffffff;
padding:2em;
border-top:2px solid #bdbcd1;
}
.client_header{
text-align:center;
font-family:lato;
font-weight:bold;
font-size:30px;
color:#231e80;
text-transform:uppercase;
padding-bottom:1em;
}
.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}
.slider {
  position: relative;
  display: flex;
  overflow: hidden;
}
.slide1 {
  height: 150px;
  display: flex;
  align-items: center;
  animation: slideshow 10s linear infinite;
  animation-direction: alternate;
}
.slide1 img {
  padding: 0 30px 0 30px;
}
@keyframes slideshow {
  0% {transform: translateX(0);}
  100% {transform: translateX(-100%);}
}
.slider::before, .slider::after {
  height: 100px;
  width: 200px;
  position: absolute;
  content: "";
  z-index: 2;
}
.slider::before {
  left: 0;
  top: 0;
}
.slider::after {
  right:0;
  top:0;
  transform: rotateZ(180deg);
}

/*footer*/
.footer{
background-color:#282828;
padding:30px 30px;
}
.footer_header{
font-family:lato; 
font-weight:bold;
font-size:14px;
color:#FFFFFF;
}
.footer_ul{
list-style-type:none;
}

.footer_ul a{
font-family:lato; 
font-size:14px;
color: #999999;
text-decoration: none;
}
.btn-color{
background-color: #a48e59 !important;
width:100%;
color:#FFFFFF !important;
font-weight:bold;
font-size:14px;
}
.explore{
font-family:Montserrat;
color:#FFFFFF;
font-size:13px;
}
.icon_footer a{
color:#696969;
}
.icon_footer i:hover{
color:#FFFFFF;
}
/*copy right*/
.copyright_sec{
background-color:#231e80;
padding:2em;
}
.copyright{
font-family: lato;
color: #FFFFFF;
font-size:15px;
text-align:center;
}
















/*media Quary*/
@media screen and (max-width: 768px) {
.slider_image{
height:500px;
}
.heading2{
font-size:24px;
}
.tab_bg{
margin-top:10px;
}
.section4{
background-repeat:inherit;
background-position: right;
}

.design_heading{
margin-top:2em;
}
.item{
flex: 50%;
}
.previous {
left: -30px;

}
.next {
right: -30px;

}
.para_carousal{
font-size:14px;
}
.carousal_captionpara{
font-size:14px;
}
.carousal_btn{
font-size:14px;
padding:2px 5px 2px 5px;
}
.carousel-caption{
bottom:2em;
}
.btn-color{
font-size:12px;
}

}























/*media Quary*/
@media screen and (max-width: 768px) {
    .navbar-light .navbar-brand{
margin-top:-10px;
}
nav#topnav {
    height: 90px;
}
.about_img{
margin-top:0;
 width:200px;
  height:100px; 
}
.manufacture_img{
width:250px;
 height:150px;
}
.engine_img{
width:150px;
height:100px
}
.product30kva_header{
padding-top:10em !important;
}
}
/*about*/
.about_header{
font-family:lato;
font-weight:bold;
font-size:24px;
color:#231e80;
margin-top:1em;
margin-bottom:5px;
}
.about_para{
font-family:lato;
font-size:16px;
}
.vision_para, .mission_para{
font-family:lato;
font-size:16px;
}
.manufacturing_image{
margin-top:3em;
}
/*contact*/
.contact_background{
background-image:url('../images/DPK-Header-1.jpg');
height:300px;
}
.btn-color{
background-color:#231e80 !important;
width:20%;
}
.contact_info_header{
font-family:lato;
font-weight:bold;
font-size:30px;
color:#231e80;
margin-top:1em;
margin-bottom:5px;
}
.contact_info_phone, .contact_info_email{
font-family:lato;
font-size:18px;
color:#000;
}
.contact_info_phone:hover{
text-decoration:none;
color:#000000;
}
.googlemap_txt{
font-family:lato;
font-size:18px;
}
.contact_info_email:hover{
text-decoration:none;
color:#000000;
}

.bottom_right{
position: relative;
  color: #fff;
  text-align: center !important;
  top: 20%;
  letter-spacing: 1px;
   font-weight:600;
  text-transform:uppercase;
  font-size:25px;
  padding:4em;

}
.product_background{
background-image: url('../images/product_banner.jpg');
background-position: top;
background-repeat:no-repeat;
height: auto;
}
