@media screen and (min-width: 601px) {
   
#header h4{
    color: white;
    font-size: 80px;
    padding-top: 50px;
    
}
}
        @media screen and (max-width: 601px) {          
#header h4{
    color: white;
    font-weight: bold;
    font-size: 50px;
    padding-bottom: 100px;
    padding-top: 50px;
}
}

.service{
    padding-left: 300px;
    padding-right: 300px;
    padding-bottom: 50px;
padding-top: 50px;
}  


.service .description{
padding-left: 200px;
    padding-right: 200px;  
}
 
.service .row{
    padding-top:50px ;
    padding-bottom:50px  ;
}

.service .row. col-sm-5{
    padding-top:auto ;
    padding-bottom:auto  ;
} 

.inf_des{
padding-left: 200px;
    padding-right: 200px; 
    padding-top: 50px;
    padding-bottom: 50px;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

section{
background-color: blue;
}

 p{
     font-size: 15px;
color: black;
}

#machine img{
    border-radius: 10%;
}

        .navbar-header img{
    width: 20%;
  height: 20%;
  margin-bottom: -7%;
}
        
.material-icons {vertical-align:-14%}



@media (pointer: coarse) and (hover: none) {

  header .imagebg {
    display: url('image/electrical-bg.jpg');
  }
}


.carousel-control-next, .carousel-control-prev{height:40px; width:40px; padding:12px; top:50%; bottom:auto; transform:translateY(-50%);  }


.carousel-item {
    position: relative;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    transition: -webkit-transform .6s ease;
    transition: transform .6s ease;
    transition: transform .6s ease,-webkit-transform .6s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    perspective: 1000px;
}
.carousel-fade .carousel-item {
  opacity: 0;
  -webkit-transition-duration: .6s;
  transition-duration: .6s;
  -webkit-transition-property: opacity;
  transition-property: opacity
}
.carousel-fade .carousel-item-next.carousel-item-left, .carousel-fade .carousel-item-prev.carousel-item-right, .carousel-fade .carousel-item.active {
  opacity: 1
}
.carousel-fade .carousel-item-left.active, .carousel-fade .carousel-item-right.active {
  opacity: 0
}
.carousel-fade .carousel-item-left.active, .carousel-fade .carousel-item-next, .carousel-fade .carousel-item-prev, .carousel-fade .carousel-item-prev.active, .carousel-fade .carousel-item.active {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0)
}
@supports (transform-style:preserve-3d) {
  .carousel-fade .carousel-item-left.active, .carousel-fade .carousel-item-next, .carousel-fade .carousel-item-prev, .carousel-fade .carousel-item-prev.active, .carousel-fade .carousel-item.active {
  -webkit-transform:translate3d(0, 0, 0);
  transform:translate3d(0, 0, 0)
  }
}
.carousel-fade .carousel-item-left.active, .carousel-fade .carousel-item-next, .carousel-fade .carousel-item-prev, .carousel-fade .carousel-item-prev.active, .carousel-fade .carousel-item.active {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}


 
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

#material-process td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

#material-process tr:nth-child(even) {
  background-color: #dddddd;
}



 @media (min-width: 768px) {
     .border-md-top {
         border-top: 1px solid #dee2e6!important;
    }
     .border-md-right {
         border-right: 1px solid #dee2e6!important;
    }
     .border-md-left {
         border-left: 1px solid #dee2e6!important;
    }
     .border-md-bottom {
         border-bottom: 1px solid #dee2e6!important;
    }
     .border-md-top-0 {
         border-top:0!important;
    }
     .border-md-right-0 {
         border-right: 0!important;
    }
     .border-md-left-0 {
         border-left: 0!important;
    }
     .border-md-bottom-0 {
         border-bottom: 0!important;
    }
}

.display-6 {
    font-family: 'Tahoma',sans-serif;
    font-size: 1rem;
    margin : 1.5rem;
  }


#desc .center{ 
            width: 100%;
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
        }

     #desc  p{
            padding-top : 40px;
            width: 100%;
            font-size: 20px;
            display: block;
            text-align: center;
        }

    #desc    .char{
            font-size: 20px;
            height: 40px;
            animation: an 1s ease-out 1 both;
            display: inline-block;
        }

        @keyframes an{
            from{
                opacity: 0;
                transform: perspective(500px) translate3d(-35px, -40px, -150px) rotate3d(1, -1, 0, 35deg);
            }
            to{
                opacity: 1;
                transform: perspective(500px) translate3d(0, 0, 0);
            }
        }

@media screen and (max-width: 600px) {
    #desc .center{ 
            width: 100%;
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
        }

     #desc  p{
            padding-top : 40px;
            width: 100%;
            font-size: 10px;
            display: block;
            text-align: center;
        }

    #desc    .char{
            font-size: 15px;
            height: 20px;
            animation: an 1s ease-out 1 both;
            display: inline-block;
        }
}


    #myFooter {
      background-color: #4e4f52;
      color: white;
      padding-top: 20px;
    }

    #map-container {
      height: 240px;
      width: 100%;
      margin-top: 30px;
      margin-bottom: 10px;
    }

    #myFooter .row {
      margin: 0 85px;
    }

    #myFooter .footer-copyright {
      background-color: #10222e;
      padding-top: 3px;
      padding-bottom: 3px;
      text-align: center;
    }

    #myFooter .footer-copyright p {
      margin: 10px;
      color: #ccc;
    }

    #myFooter .container {
      width: auto;
    }

    #myFooter ul {
      list-style-type: none;
      padding-left: 0;
      line-height: 1.7;
    }

    #myFooter h5 {
      font-size: 18px;
      color: white;
      font-weight: bold;
      margin-top: 30px;
    }

    #myFooter a {
      color: black;
      text-decoration: none;
        color: white;
    }

    #myFooter a:hover,
    #myFooter a:focus {
      text-decoration: none;
      color: white;
    }

    #myFooter .social-networks {
      text-align: center;
      padding-top: 30px;
      padding-bottom: 38px;
    }

    #myFooter .fa {
      font-size: 30px;
      margin-right: 15px;
      margin-left: 20px;
      background-color: white;
      color: #182c39;
      border-radius: 51%;
      padding: 10px;
      height: 50px;
      width: 50px;
      text-align: center;
      line-height: 31px;
      text-decoration: none;
      transition: color 0.2s;
    }

    #myFooter .fa-facebook:hover {
      color: #2b55ff;
    }

    #myFooter .fa-facebook:focus {
      color: #2b55ff;
    }

    #myFooter .fa-youtube:hover {
      color: red;
    }

    #myFooter .fa-youtube:focus {
      color: red;
    }

    #myFooter .fa-instagram:hover {
      color: #00aced;
    }

    #myFooter .fa-instagram:focus {
      color: #00aced;
    }

    .fa-whatsapp:hover {
      color: red;
    }

    .fa-whatsapp:focus {
      color: red;
    }

    @media screen and (max-width: 767px) {
      #myFooter {
        text-align: center;
      }
      #myFooter .row {
        margin: 0;
      }
    }
    
    /* Set a style for all buttons */
        button {
            background-color: #73CBE7;
            color: black;
            padding: 14px 20px;
            border: none;
            cursor: pointer;
            width: 100%;
        }

        button:hover {
            opacity: 0.5;
        }

.navbar
{
    background-color: white;
}
.navbar-brand { position: relative; z-index: 2; }

.navbar-nav.navbar-right .btn { position: relative; z-index: 2; padding: 4px 20px; margin: 10px auto; }

.navbar .navbar-collapse { position: relative; }
.navbar .navbar-collapse .navbar-right > li:last-child { padding-left: 22px; }

.navbar .nav-collapse { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; margin: 0; padding-right: 120px; padding-left: 80px; width: 100%; }
.navbar.navbar-default .nav-collapse { background-color: #f8f8f8; }
.navbar.navbar-inverse .nav-collapse { background-color: #222; }
.navbar .nav-collapse .navbar-form { border-width: 0; box-shadow: none; }
.nav-collapse>li { float: right; }

.btn.btn-circle { border-radius: 50px; }
.btn.btn-outline { background-color: transparent; }

@media screen and (max-width: 767px) {
    .navbar .navbar-collapse .navbar-right > li:last-child { padding-left: 15px; padding-right: 15px; } 
    
    .navbar .nav-collapse { margin: 7.5px auto; padding: 0; }
    .navbar .nav-collapse .navbar-form { margin: 0; }
    .nav-collapse>li { float: none; }
}


  .carousel-inner img {
    width: 100%;
    height: 100%;
  }