@import url('https://fonts.googleapis.com/css?family=Fira+Sans:400,500,700');
@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700');
@import url('http://fonts.googleapis.com/css?family=Reenie+Beanie:regular');



@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideInFromLeft {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
html, body {
    height: 100%;
    width: 100%;
    font-family: 'Roboto', sans-serif;
    color: #222;


    /*background-color: #E1F5FE;*/

    /* background-color:#EDE7F6;*/
    background-color: white;
}


html {
    overflow-y: scroll;
    overflow-x: hidden;
}
body{


    animation-duration: 0.5s; /* the duration of the animation */
   animation-timing-function: ease-out; /* how the animation will behave */
  animation-delay: 0s; /* how long to delay the animation from starting */
  animation-iteration-count: 1; /* how many times the animation will play */
  animation-name: fadeIn; /* the name of the animation we defined above */

}
.floating-navigation{
    animation-duration: 1s; /* the duration of the animation */
    animation-timing-function: ease-out; /* how the animation will behave */
    animation-delay: 0s; /* how long to delay the animation from starting */
    animation-iteration-count: 1; /* how many times the animation will play */
    animation-name: slideInFromLeft; /* the name of the animation we defined above */

}


.row{margin-right: -15px;
    margin-left: -15px;


}
.phone-mob{
    right: 0;
    top: 40%;
    position: fixed;

    font-size: 2em;
    background-color: blue;
    margin-right: 10px;
    padding: 5px;
    border: 1px solid black;
}
.phone-mob a:hover{
    background-color: blue;
}
.link-1{
    border-bottom: 2px solid black;
}
/*#banner{
    margin-top: 90px;
}

#banner .carousel-inner{
    margin-top: 90px;

}

#banner .slide{
    width: 30px;
}


#banner .card1{

    text-align: center;

    margin-top: 50%;
}
#banner ul li img{

    height: 150px;
    width: 150px;
    margin-top: 0px;
    padding: 20px;
    border: 1px solid black;

    background-color: #FFF9C4;


}
#banner .slide-product{
    margin-left: 30%;
    margin-top: -35%;

}

#banner .slide-2{
    color: black;
    margin-left: 10%;

}

#banner .slide-2 h5{
    font-size: 110%;
    font-style: italic;
    opacity: 1;
}
#banner .card1{
    width: 300px;

    background-color:#FFF9C4;
    opacity: 0.9;
    margin-right: 50px;
    padding-bottom: 10%;
}
#banner .slide-icon{
    height: 50px;

    width: 100%;
    background-color: #F44336;

    text-align: center;

}
#banner .slide-more{
    margin-top: 10px;
    float: bottom;
}

#banner .slide-icon h4{
padding-top: 10px;
color: white;
}
#banner  ul{
    margin-left: 30%;
    margin-top: -30%;
    width: 70%;
}

#banner ul li{
    margin-bottom: 5px;
}
#banner ul li:hover{
    background: none;
}
.carousel-inner .carousel-item img{

    height: 550px;
}



.carousel-caption{
    right: auto;
    left: 5%;
}
.slide-caption1{
    text-align: center;
    width: 30%;
    background-color: #F44336;
    border-radius: 25px;
    padding: 10px;
    margin-bottom: 40px;

}

.slide-caption1 h4{
    font-size: 140%;
}
.slide-img li{
    display: inline-block;


}

*/

.heading-new{
    font-size: 20px;
    padding-top: 10px;

    text-align: center;
    font-weight: bold;
    color: orangered;
}
.image-new{
    margin-top: 20px;
    width: 100%;
    height: 200px;
}
.desc-new{
    margin-top: 40px;
}
.carousel-inner .carousel-item img{
    width: 100%;
    height: 600px;
}

.carousel-caption{
    margin-left: -10%;
    margin-right: -10%;
}

#banner ul li:hover{
    background: none;
}

#banner ul li{
    display: inline;
}
#banner ul li img{
    height: 150px;
    width: 150px;
    margin-bottom: 5px;
    padding: 20px;
    border: 1px solid black;
    background-color: #FFF9C4;
    overflow-wrap: normal;
}
#banner ul li:nth-child(4n):after {
    content: "\A";
    white-space: pre;
}
.slide-caption1{
    text-align: center;
    background-color: #F44336;
    border-radius: 25px;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 40px;

}

.slide-caption1 h4{
    font-size: 140%;
}


#banner .slide-2{
    color: black;
    margin-left: 10%;

}

#banner .slide-2 h5{
    font-size: 110%;
    font-style: italic;
    opacity: 1;
}
#banner .card1{
    width: 300px;
    background-color:#FFF9C4;
    opacity: 0.9;
    margin-right: 50px;
    padding-bottom: 10%;
}

#banner .slide-icon{
    height: 50px;
    width: 100%;
    background-color: #F44336;
    text-align: center;
}

#banner .slide-icon h4{
    font-size: 110%;
    padding-top: 10px;
    color: white;
}


.slide-3{
    margin-left: 10%;
}
.slide-icon1 a{
    font-size: 3em;
    padding: 3rem;
    color:#FFF9C4;
    padding-bottom: 50px;
    opacity: 0.8;
}

.card-body-3{
    margin-top: 30px;
   /* background-color:#FFF9C4;*/
    color: white;

}
.card-body-3 h6{
    font-size: 150%;
}

/*.carousel-caption h1{
    font-size: 500%;
    text-transform: uppercase;
    text-shadow: 1px 1px 15px #000;
    text-align: center;
    color: black;
}
*/
.address{
    margin-top:14%;
}

.home-bottom{

    padding-top: 5%;

}

.home-bottom h3{
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
}

.home-bottom h6{
    line-height: 30px;
    text-align: justify;
    padding: 10px;
}

.home-page{
background-color: #FFFF8D;
    margin-bottom: -20px;
}

.about-con{
    padding: 30px;
    margin-bottom: 60px;

}
.about-con h4{
    text-transform: uppercase;
}

#industries ul li:hover{
    background: none;
}

#about-us{
    background-color: #FFE082;
}
#our-vision{
    background-color:  #FFCC80;

}
#industries{
    background-color: #FFF59D;
}

.back-about{
    margin-left: 40%;
    width: 30%;
}

#cover{
    height: 250px;
    width: 100%;
    background-color: pink;

}

.sticky img{
    width: 10em;
    height: 10em;

}

.sticky h3{
    font-family:"Fira Sans",arial,sans-serif;
    text-transform: uppercase;
    font-size:100%;
    text-align: center;
}
.sticky h2,p{
    font-size:100%;
    font-weight:normal;
}
.sticky ul,.sticky li{
    list-style:none;
}
.sticky ul{
    overflow:hidden;
    padding:3em;
}
.sticky ul li a{
    text-decoration:none;
    color:#000;
   /* background:#ffc;*/
    background-color: #E6EE9C;
    display:block;
    height:14em;
    width:13em;
    padding:1em;
    margin-top: 20px;
    margin-bottom: 20px;
    /*-moz-box-shadow:5px 5px 7px rgba(33,33,33,1);
    -webkit-box-shadow: 5px 5px 7px rgba(33,33,33,.7);
    box-shadow: 5px 5px 7px rgba(33,33,33,.7);
    -moz-transition:-moz-transform .15s linear;
    -o-transition:-o-transform .15s linear;
    -webkit-transition:-webkit-transform .15s linear;
    */
}
.sticky ul li:hover{
    background: none;
}
.sticky ul li{
    margin:1em;
    float:left;
}
.sticky ul li h2{
    font-size:140%;
    font-weight:bold;
    padding-bottom:10px;
}

/*.sticky ul li a{
    -webkit-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    -moz-transform:rotate(-6deg);
}
*/
.sticky ul li:nth-child(even) a{
  /*  -o-transform:rotate(4deg);
    -webkit-transform:rotate(4deg);
    -moz-transform:rotate(4deg);
    */
    position:relative;
   /* top:5px;*/
    background:#cfc;
}
.sticky ul li:nth-child(3n) a{
  /*  -o-transform:rotate(-3deg);
    -webkit-transform:rotate(-3deg);
    -moz-transform:rotate(-3deg);
    */
    position:relative;
    /*top:-5px;*/
    background:#ccf;
}
.sticky ul li:nth-child(5n) a{
  /*  -o-transform:rotate(5deg);
    -webkit-transform:rotate(5deg);
    -moz-transform:rotate(5deg);
    */
    position:relative;
   /* top:-10px;*/

}
.sticky ul li a:hover,ul li a:focus{
    box-shadow:10px 10px 7px rgba(0,0,0,.7);
    -moz-box-shadow:10px 10px 7px rgba(0,0,0,.7);
    -webkit-box-shadow: 10px 10px 7px rgba(0,0,0,.7);
    -webkit-transform: scale(1.25);
    -moz-transform: scale(1.25);
    -o-transform: scale(1.25);
    position:relative;

    z-index:5;
}
.sticky ol{text-align:center;}
.sticky ol li{display:inline;padding-right:1em;}
.sticky ol li a{color:#fff;}
/*.container{
  /*  background-color: #C5E1A5;
    background-color: #E1F5FE;;
    color: #000000;

}*/


.floating-navigation{
    right: 0;
    top: 30%;
    position: fixed;
}
.float{
    list-style-type: none;

}
.float li{
    background-color: red;
    padding: 10px;
    font-size: 30px;
    }

.icon{
    cursor: pointer;
}
.float a{
    color: black;
}

.float li:hover{
    background-color: white;
}




.slide{
    margin: 0 !important;
    padding: 0 !important;
    width: 105%;
}
nav a:active{
    background-color:#CCFF90 ;
   }

nav{
    position: fixed;
}
.navbar{
  padding: .2rem;
    background-color: #1B5E20;

   }
.sticky-nav{
    position: fixed; /* Set the navbar to fixed position */
    /* Position the navbar at the top of the page */
    width: 100%;
    margin-right: 30px;
    z-index: 99;
}
.navbar-nav li{
  padding-right: 8px;
  size: 20px;

}
.blink{
    background: red;
}


.nav-link{
  /*font-size: 1.1em !important;*/
    font-size: 1.1em !important;
}
#nav a{
    color: white;
}
#nav a:hover{
    color: black;
}

#nav .active ul li a:hover,ul li a:focus{
    background-color: #CCFF90;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -moz-box-shadow:0px 0px 0px rgba(33,33,33,1);
    -webkit-box-shadow: 0px 0px 0px rgba(33,33,33,.7);
    box-shadow: 0px 0px 0px rgba(33,33,33,.7);
    -moz-transition:-moz-transform 0s linear;
    -o-transition:-o-transform 0s linear;
    -webkit-transition:-webkit-transform 0s linear;

}


#nav .active a{
    color: black;
}
.navbar .active{

}

#home:after{
    background-color: #CCFF90;
}

#drop h1{
    font-size: 18px;
    font-weight: lighter;
}
.active1:target{
    background-color: #CCFF90;
    color: black;
}

.sticky a:target{
    background-color: #CCFF90;

}
#drop a{
    color:black;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color:#C5E1A5 ;
    min-width: 200px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}


.dropdown-content a:hover { background-color: #AED581;}

.dropdown:hover .dropdown-content {display: block;}



/*---
#stamp{
	border: 8px solid red;
	height:100px;
	width: 100px;
	text-align: center; 
	border-radius: 50%;
	margin-left: 16px;
	transform: rotate(-20deg);
}
--*/


/*About Us*/
.about{
    padding: 25px;
}

#stamp{
	transform: rotate(-5deg);
}



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

.carousel-caption{
  position: absolute;
  top: 50%;
  transform: translateY(-80%);
}

.carousel-caption h1{
  font-size: 500%;
  text-transform: uppercase;
  text-shadow: 1px 1px 15px #000;
}

.carousel-caption h3{
  font-size: 350%;
  font-weight: 500;
  text-shadow: 1px 1px 10px #000;
  padding-bottom: 1rem;
}


.carousel-item {
	transition: -webkit-transform 0.5s ease;
	transition: transform 0.5s ease;
	transition: transform 0.5s ease, -webkit-transform 0.5s ease;
	-webkit-backface-visibility: visible;
	        backface-visibility: visible;
}

.side {
    font-size: 150%;
    font-weight: 300;
    font-weight: bold;
    font-style: italic;
    font-family: sans-serif; ;
    margin-top: 10px;
    padding: 20px;
    line-height: 40px;
    height: 100%;
    width: 100%;
    text-align: center;
    background-color:  #FFD54F;
    border: 8px dashed #33691E;
    border-radius: 5%;
    color: #4A148C;

}
  
.side{

   /* background-color:#ddc;*/
    border:solid 5vmin #FCE4EC;
    border-bottom-color:#B71C1C;
    border-left-color:#B71C1C;
    border-radius:2px;
    border-right-color:#B71C1C;
    border-top-color:#B71C1C;
    box-shadow:0 0 5px 0 rgba(0,0,0,.25) inset, 0 5px 10px 5px rgba(0,0,0,.25);
    box-sizing:border-box;
    padding:30px;
    text-align:center;

}
.p_side{
    padding: 20px;
    font-style: italic;
    font-size: 20px;
    color: #D50000;
    margin-top: 30px;
}


#contain{

}

.filter{
	filter:brightness(100%);
}

.more {
  display: none;
}

.moreText{
	text-align: right;
	font-size: 16px;
	color: #222;
	padding-right: 100px;
}

.shiva
{
  width: 100px;
	height: 100px;
	background: #512DA8;
	border-radius: 50%;
  	text-align: center;
  	display: inline-block;
  	margin-bottom: 8px;

}
.count,.plus
{
  line-height: 100px;
  color:white;
  font-size:25px;
}
.desc{
	font-size: 24px;
}

/*contact*/

.icon-mob{
padding: 16px;
}
.social a{
    font-size: 4.5em;
    padding: 3rem;
}
.fa-facebook{
    color: #3b5998;
}

.fa-google-plus-g{
    color: #dd4b39;
}
.fa-youtube{
    color: #bb0000;
}
.fa-facebook:hover,
.fa-twitter:hover,
.fa-google-plus-g:hover,
.fa-instagram:hover,
.fa-youtube:hover{
    color: #d5d5d5;
}

h2 {
    padding: 32px;
    font-size: 350%;
    color: #004D40;
}

.padding{
    padding-top: 32px;
}
.heading{
    font-weight: bold;
    padding-right: 16px;
    /*a7a6a6*/
}
#map{
    width: 90%;
    height: 300px;
    background-color: grey;
}
#head{
    padding-top: 100px;
    background-image: url(image/slide2.gif);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 300px;
   /* background-color:	#AEAEAE;*/

    }
.mySlides ul{
    display: none;
    width: auto;
}

#head .slide-caption{
    margin-left: -50%;
    margin-top: -150px;
    margin-right: 120%;
    height: 100px;

}
#head .slide-caption h4,#head .slide-caption h5{
    background-color: #FF3D00;
    color: white;
    text-align: center;
    padding: 5px;
    border-radius: 25px;
    width: 250px;
}

#head  ul{
    list-style-type: none;
   margin-left: 30%;
}
#head ul li{
    display: inline-block;


}
#head ul li:hover{
    background: none;


}
#head ul li img{
    height: 200px;
    width: 200px;
}



/*#head ul{
    margin-left: 10%;
    margin-right: 10%;
    list-style-type: none;}

#head ul li{
    display: inline-block;
}
#head ul li img{
    height: 200px;
    width: 200px;
    padding: 30px;
}

*/


#slider-container {
    position: relative;

    height: 200px;
    width: 100%;
    max-width: 1000px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    overflow: hidden;

}

#slider-scroller {
    position: absolute;
    top: 0;
    left: 0;
    width: calc(400px * 5);
    transition: all 1s ease;
}

.slider-item {
    width: 220px;
    height: 110px;
    display: inline-block;
    margin: 20px;
    position: relative;
}

.slider-item img {
    position: absolute;
}
    /*top: 50%;
    left: 50%;*/
    /*transform: translate(-50%, -50%);
    max-width: 400px;
    max-height: 300px;
}
*/

/*form*/

.inquery{
    width: 100%;
}


form {
    padding: 50px;
    width: 70%;
    text-align: center;
}


#contact {
    background: #F9F9F9;
    padding: 25px;
   /* margin: 50px 150px;*/
    margin-left: 15%;
    margin-right:15%;
    width: 70%;
    margin-top: 25px;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}


#contact h4 {
    margin: 5px 0 15px;
    display: block;
    font-size: 13px;
    font-weight: 400;
}

.side-button-products-home-slider .btn{
    border-radius: 20px;
}
fieldset {
    border: medium none !important;
    margin: 0 0 10px;
    min-width: 100%;
    padding: 0;
    width: 100%;
}

#contact input[type="text"],
#contact input[type="email"],
#contact input[type="tel"],
#contact input[type="url"],
#contact textarea {
    width: 100%;
    border: 1px solid #ccc;
    background: #FFF;
    margin: 0 0 5px;
    padding: 10px;
}

#contact input[type="text"]:hover,
#contact input[type="email"]:hover,
#contact input[type="tel"]:hover,
#contact input[type="url"]:hover,
#contact textarea:hover {
    -webkit-transition: border-color 0.3s ease-in-out;
    -moz-transition: border-color 0.3s ease-in-out;
    transition: border-color 0.3s ease-in-out;
    border: 1px solid #aaa;
}

#contact textarea {
    height: 100px;
    max-width: 100%;
    resize: none;
}

#contact button[type="submit"] {
    cursor: pointer;
    width: 100%;
    border: none;
    background: #4CAF50;
    color: #FFF;
    margin: 0 0 5px;
    padding: 10px;
    font-size: 15px;
}

#contact button[type="submit"]:hover {
    background: #43A047;
    -webkit-transition: background 0.3s ease-in-out;
    -moz-transition: background 0.3s ease-in-out;
    transition: background-color 0.3s ease-in-out;
}

#contact button[type="submit"]:active {
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5);
}

.copyright {
    text-align: center;
}

#contact input:focus,
#contact textarea:focus {
    outline: 0;
    border: 1px solid #aaa;
}

::-webkit-input-placeholder {
    color: #888;
}

:-moz-placeholder {
    color: #888;
}

::-moz-placeholder {
    color: #888;
}

:-ms-input-placeholder {
    color: #888;
}


/*clients*/


#grid {
    position: relative;
    width: 80%;
    margin: 0 auto;
    padding: 50px; /* Clears unordered list default of 40px */
}

.clear:after {
    content: "";
    display: block;
    clear: both;
}
#grid li {
    list-style-type: none;
    position: relative;
    float: left;
    width: 27.85714285714286%;
    padding: 0 0 32.16760145166612% 0;
    -o-transform: rotate(-60deg) skewY(30deg);
    -moz-transform: rotate(-60deg) skewY(30deg);
    -webkit-transform: rotate(-60deg) skewY(30deg);
    -ms-transform: rotate(-60deg) skewY(30deg);
    transform: rotate(-60deg) skewY(30deg);
    background: #fd005f;
    overflow: hidden;
    visibility: hidden;
}
#grid li .hexagon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
   /* background: #FFF3E0;*/
    background: #FFD54F;
    -o-transform: skewY(-30deg) rotate(60deg);
    -moz-transform: skewY(-30deg) rotate(60deg);
    -webkit-transform: skewY(-30deg) rotate(60deg);
    -ms-transform: skewY(-30deg) rotate(60deg);
    transform: skewY(-30deg) rotate(60deg);
    overflow: hidden;
    }

#grid li * {
    visibility: visible;
}
#grid li:nth-child(3n+2) {
    margin: 0 1%;
}
#grid li:nth-child(6n+4), #grid li:nth-child(6n+5), #grid li:nth-child(6n+6) {
    margin-top: -6.9285714285%;
    margin-bottom: -6.9285714285%;
    -o-transform: translateX(50%) rotate(-60deg) skewY(30deg);
    -moz-transform: translateX(50%) rotate(-60deg) skewY(30deg);
    -webkit-transform: translateX(50%) rotate(-60deg) skewY(30deg);
    -ms-transform: translateX(50%) rotate(-60deg) skewY(30deg);
    transform: translateX(50%) rotate(-60deg) skewY(30deg);
}

.customer{
    position: absolute;
    margin: auto;
    height: 50%;
    width: 50%;

    /* For the following settings we set 100%, but it can be higher if needed
    See the answer's update */
    left: -50%;
    right: -50%;
    top: -50%;
    bottom: -50%;
}
/*.cl{
    text-align: center;
    padding: 10px;
    float: right;
    font-weight: bold;
}*/


/*#grid {
    position: relative;
    width: 70%;
    margin: 0 auto;
    padding: 40px;
}
.clear:after {
    content: "";
    display: block;
    clear: both;
}
#grid li{
    list-style-type: none;
    float: left;
    position: relative;
    display: inline;
}

.hexagon {
    width: 100px;
    height: 55px;
    background: red;
    position: relative;
    margin:5px;
}
.hexagon:before {
    content: "";
    position: absolute;
    top: -25px;
    left: 0;
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-bottom: 25px solid red;
}
.hexagon:after {
    content: "";
    position: absolute;
    bottom: -25px;
    left: 0;
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-top: 25px solid red;
}
*/


/*Actuator*/
table, td, th {
    border: 1px solid #ddd;
    text-align: left;
}

.leader table{
    border: none;
}
table {
    border-collapse: collapse;
    width: 100%;
}

th, td {
    padding: 10px;
}

.manual-table{
    background-color: #FFE082;
}
/*manual valves*/

.below-table{
    border-style: dashed;
    border-color: green;
    border-width:2px;
    margin-top: 8%;
}

.more-products{
    float: left;
    margin-bottom: -30px;
}
.card{
    width: 90%;

    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin: 10px;
}
.card-title{
    text-transform: uppercase;
    font-size: 20px;
}
.card-img-top{
    height: 175px;
    width: 50%;
    margin-left: 20%;

}

.card-img-top-manual{
    height: 175px;
    width: 100%;
}
.pic{

    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: -30px;
    width: 30%;
}
.pic-manual{

    padding: -30px;
    width: 30%;
}



/*.grid-container {
    display: grid;
    grid-template-columns: auto;
    padding: 10px;
    /*visibility: hidden;*/
/*    display: none;
}

.grid-item {
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(0, 0, 0, 0.8);
    padding: 20px;
    font-size: 30px;

}
.heading_manual{
    font-size: 16px;
    padding-bottom: 24px;
}
.manual_desc{
    font-size: 16px;
}
.title_manual{
    text-align: left;
    font-weight: bold;
}
*/


.technical table {
    background-color: #1B5E20;
}
#hello2,#hello,#hello3,#hello4,#hello5,#hello6,#hello7,#hello8,#hello9,#hello10,
#hello11,#hello12,#hello13,#hello14,#hello15,#hello16,#hello17,#hello18{
    display: none;
    padding: 25px;
}

.desc-actuator{
    padding-top: 20px;
    text-align: justify;
    font-weight: lighter;
}

.list-desc li{
    display: inline-block;
    padding-right: 3px;
}

.list-desc li:hover{
    background: none;
}

.list-desc li h3{
    font-size: 100%;
}
.heading_manual{
    font-size: 20px;
    padding-top: 10px;

    text-align: center;
    font-weight: bold;
    color: orangered;
}
.sub_heading_manual{
    font-size: 12px;
    font-weight: bold;
    padding: 0px;
    margin-bottom: 0px;
}
.textheadmain{
    font-size: 16px;
    padding-top: 5px;
    text-align: center;
    font-weight: bold;
    color: green;
}

#hi table,#hi4 table, #hi5 table{
    border:none;
    background-color:#FFE082;

}

#manual_less,#manual_less2,#manual_less3,#manual_less4,#manual_less5,#manual_less6,#manual_less7,#manual_less8,#manual_less9,
#manual_less10,#manual_less11,#manual_less12,#manual_less13,#manual_less14,#manual_less15,#manual_less16,#manual_less17,#manual_less180{
    margin: 16px;
    }
/*#hello{
    display: none;
}
#hello2{
    display: none;
}*/




/*Valve Automation*/

.valve_auto_table table, td, th{
    border: none;
    text-align: left;
}
.valve_auto_table th, td {
    padding: 10px;
    background-color: white;
    font-size: 12px;
}

.valve_auto_table_sub td, th{
    border: 1px solid black;
    text-align: left;
    background-color: #F0F4C3;
}
.valve_auto_table_sub  {
    padding: 10px;
    margin: 10px;

}
.sub_automation{
    text-align: center;
    font-weight: bold;
    font-size: 16px;
}
.pic_automation{
    background-color: white;
    width:30%;
}
#automation_less,#automation_less2,#automation_less3,#automation_less4,#automation_less5{
    margin-left: 40%;
    margin-right: 40%;
    float: bottom;
    position: relative;
    top: 20px;
    }

#automation_less6{
    margin-left: 50%;
    margin-right: 50%;
}
#hey,#hey2,#hey3,#hey4,#hey5,#hey6{
    display: none;
}
.acessories{
    font-weight: bold;
    text-align: center;
    font-size: 16px;
}
.pic_automation_acessories{
    width: 50%;
    height: 50%;
    margin: 30%;
}
.card-img-top-knife{
    height: 50%;
    max-height: 175px;
    width: 50%;
}

/*side-bar*/


.side-product{
    margin-left: -10%;
}

.side-button{
    margin-top: 70px;
   /* position: fixed;
    max-height: 300px;
    overflow: hidden;
    z-index : 100000;*/
    }
.side-button-products{
    margin-top: 120px;

}
.side-button-products a{
    margin-bottom: 30px;
}
.side-button a{
    margin-bottom: 10px;
}
.side-list{
    margin-top: 20px;
}

.side-list h3{
    font-size: 100%;
}
.side-list li{
    list-style-type: none;
    color: #7E57C2;
    border-bottom: 1px solid black;
    padding: 5px;
}
.side-list li:hover{
    background: none;
    color: red;
}
.side-button
.navigation {
    width: 300px;
    padding-top: 50px;
}

/* reset our lists to remove bullet points and padding */
.mainmenu{

}
.mainmenu, .submenu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ribbon {
    margin:  20px;
    margin-left: -80px;
}
/* make ALL links (main and submenu) have padding and background color */
.mainmenu a {
    display: block;
    background-color: #CCC;
    text-decoration: none;
    padding: 10px;
    color: #000;
    text-align: center;
}

/* add hover behaviour */
.mainmenu a:hover {
    background-color: #C5C5C5;
}

.mainmenu li:nth-child(1) a {    background: #FFC107; }

.mainmenu li:nth-child(2) a {    background: #E040FB; }
.mainmenu li:nth-child(3) a {    background: #FF5252; }
/* when hovering over a .mainmenu item,
  display the submenu inside it.
  we're changing the submenu's max-height from 0 to 200px;
*/

#c1 a  {    background: #FFD54F; }
#c2 a  {    background: #EA80FC; }
#c3 a  {    background: #FF8A80; }

.mainmenu li:hover .submenu {
    display: block;
    max-height: 1000px;
}
 #c1 li:hover{
    background: #FFC107;
}
#c2 li:hover{
    background: #E040FB;
}
#c3 li:hover{
    background: #FF5252;
}
/*
  we now overwrite the background-color for .submenu links only.
  CSS reads down the page, so code at the bottom will overwrite the code at the top.
*/

.submenu  a {
    background-color: #999;
}

/* hover behaviour for links inside .submenu */
.submenu a:hover, .submenu li:hover {
    background-color: #666;
}

/* this is the initial state of all submenus.
  we set it to max-height: 0, and hide the overflowed content.
*/
.submenu {
    overflow: hidden;
    max-height: 0;
    -webkit-transition: all 0.5s ease-out;
}

.intlinks3{
    list-style-type: none;
    }
.intlinks3 li{
    padding-bottom: 5px;
    padding-top: 5px;
    border-bottom: 1px solid black;
}
.intlinks3 a
{
    color:#003366;
    text-decoration:none;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    cursor: pointer;

}
.intlinks3 a:hover
{
    color:#003366;
    text-decoration:underline;

}


/*Actuator*/


.linear_actuator_row {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
    /*padding: 0 4px;*/
    padding: 16px;
}

/* Create four equal columns that sits next to each other */
.linear_actuator_column {
    -ms-flex: 25%; /* IE10 */
    flex: 25%;
    max-width: 25%;
    padding: 0 4px;
}

.linear_actuator_column img {
    margin-top: 8px;
    vertical-align: middle;
    border: 1px solid red;
}


.process_actuator_row {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
    /*padding: 0 4px;*/
    padding: 16px;
}

/* Create four equal columns that sits next to each other */
.process_actuator_column {
    -ms-flex: 50%; /* IE10 */
    flex: 50%;
    max-width: 50%;
    padding: 0 4px;
}

.process_actuator_column img {
    margin-top: 8px;
    vertical-align: middle;
    border: 1px solid red;
}

.side-list{

}


.page-heading{
    text-align: center;
    margin-bottom: -80px;
    font-size: 200%;
    font-family: "serif";
    color: #424242;
}
#actuator_less,#actuator_less2,#actuator_less3,#actuator_less4,#actuator_less5{
    margin-right: 40%;
    margin-left: 50%;
    margin-top: 20px;
    font-weight: bold;
}

#schrader_less,#schrader_less2,#schrader_less3,#schrader_less4,#schrader_less5,#schrader_less6,#schrader_less7{
    margin-right: 40%;
    margin-left: 50%;
    margin-top: 20px;
    font-weight: bold;
}

#leader_less,#leader_less2,#leader_less3,#leader_less4,#leader_less5,#leader_less6,#leader_less7, #leader_less8,#leader_less9,#leader_less10,#leader_less11,#leader_less12,#leader_less13,#leader_less14,#leader_less15,#leader_less16,#leader_less17,#leader_less18,#leader_less19,#leader_less20,#leader_less21,#leader_less22,#leader_less23,#leader_less24,#leader_less25,#leader_less26,#leader_less27,#leader_less28,#leader_less29,#leader_less30{
    margin-right: 40%;
    margin-left: 50%;
    margin-top: 20px;
    font-weight: bold;
}
#hi,#hi2,#hi3,#hi4,#hi5{
    display: none;
}
#sc1,#sc2,#sc3,#sc4,#sc5,#sc6,#sc7{
    display: none;
}
#ld,#ld2,#ld3,#ld4,#ld5,#ld6,#ld7,#ld8,#ld9,#ld10,#ld11,#ld12,#ld13,#ld14,#ld15,#ld16,#ld17,#ld18,#ld19,#ld20,#ld21,#ld22,#ld23,#ld24,#ld25,#ld26,#ld27,#ld28,#ld29,#ld30{
    display: none;
}

.dash{

    height: 12px;
    border: 0;
    box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5);

}
table li:hover{
    background: none;
}

/*Footer*/
footer{
    background-color: #1B5E20;
    color: white;
    text-align: left;
    padding:10px;
    margin-top: 16px;

    }

footer a{
    color: white;
}
footer a:hover,li:hover{
    background-color: #CCFF90;
    color: black;
    text-decoration: none;
}
footer p{
    text-align: left;
    text-transform: uppercase;
}
footer ul{
    padding-left: 0;
}
footer li{
   list-style-type: none;
    font-size: 10px;
}
.small{
    font-size: 10px;
    text-align: left;
    text-transform: none;
}
.card:target{
    border: 7px solid #FF6F00;
}

.ok:target{

    background-color: black;

}

.copy{
font-size: 12px;
    background-color:#33691E;
    padding: 0px;
    color: white;
}
.copy a{
    color:red;
}
.footer-social a{
    font-size: 2em;
    padding: 1rem 1rem 0 1rem;
   }
.footer-social .fa-facebook{
    color: white;
}

.footer-social .fa-google-plus-g{
    color: white;
}
.footer-social .fa-youtube{
    color: white;
}


@media (max-width: 1200px) {
    #head ul li img{
        height: 200px;
        width: 160px;
    }

    .nav-link{
        /*font-size: 1.1em !important;*/
        font-size: 1em !important;
    }

    .navbar-brand img{
        height: 70px;
    }

    #banner ul li img{
        height: 140px;
        width: 130px;
        padding: 20px;
        border: 1px solid black;
        background-color: #FFF9C4;
        overflow-wrap: normal;
    }
}


@media (max-width: 992px) {

    .nav-link{
        /*font-size: 1.1em !important;*/
        font-size: .9em !important;
    }



    .navbar-brand img{
        height: 50px;
    }

    #banner .slide-2 h5{
        font-size: 100%;
        font-style: italic;
        opacity: 1;
    }
    #banner .slide-2 h4{
        font-size: 100%;

        opacity: 1;
    }
    #banner .card1{
        width: 320px;
        background-color:#FFF9C4;
        opacity: 0.9;
        margin-right: 5px;
        padding-bottom: 10%;
        height: 300px;
    }

    #banner .slide-icon{
        height: 40px;
        width: 100%;
        background-color: #F44336;
        text-align: center;
    }

    #banner .slide-icon h4{
        padding-top: 10px;
        color: white;
        font-size: 90%;
    }

    .card-body-3 h6{
        font-size: 100%;
    }

    .carousel-inner .carousel-item img{
        width: 100%;
        height: 500px;
    }
    #banner ul li img{
        height: 100px;
        width: 100px;
        padding: 10px;
        border: 1px solid black;
        background-color: #FFF9C4;
        overflow-wrap: normal;
    }

    .slide-caption1 h4{
        font-size: 100%;
    }
    .side-product{
        margin-left: 10%;
        width: 50%;
    }
    .side{
        font-size: 16px;

    }

    .social a{
        font-size: 4em;
        padding: 2rem;
    }

    #head{
        padding-top: 100px;
        background-image: url(image/slide2.gif);
        background-repeat: no-repeat;
        background-size: 100% 100%;
        width: 100%;
        height: 250px;
        /* background-color:	#AEAEAE;*/

    }
    .mySlides ul{
        display: none;
        width: auto;
    }

    #head .slide-caption{
        margin-left: -53%;
        margin-top: -150px;
        margin-right: 120%;
        height: 100px;

    }
    #head .slide-caption h4,#head .slide-caption h5{
        background-color: #FF3D00;
        color: white;
        text-align: center;
        padding: 5px;
        border-radius: 25px;
        width: 150px;
        font-size: 16px;
    }

    #head  ul{
        list-style-type: none;
        margin-left: 30%;
    }
    #head ul li{
        display: inline-block;


    }
    #head ul li:hover{
        background: none;


    }
    #head ul li img{
        height: 150px;
        width: 110px;
    }
}

@media (max-width: 768px) {



    .space{
        margin-top: 50px;
    }

    iframe{
        width: 90%;
    }
    #map{
        width: 90%;
        height: 300px;
        background-color: grey;
    }
    .slide-3{
        margin-left: 0%;
    }
    .slide-icon1 a{
        font-size: 1em;
        padding: 0.1rem;
        color:#FFF9C4;
        padding-bottom: 50px;
        opacity: 0.8;
    }

    .card-body-3{
        margin-top: 30px;
        /* background-color:#FFF9C4;*/
        color: white;

    }
    .card-body-3 h6{
        font-size: 70%;
    }

    .carousel-caption h1{
        font-size: 500%;
        text-transform: uppercase;
        text-shadow: 1px 1px 15px #000;
        text-align: center;
        color: black;
    }
    .address{
        margin-top:16%;
    }

    .carousel-inner .carousel-item img{
        width: 50%;
        height: 380px;
    }
    .carousel-caption{
        margin-left: 0%;
        margin-right: -10%;
    }
    #banner ul li img{
        height: 90px;
        width: 100px;
        padding: 5px;
        border: 1px solid black;
        background-color: #FFF9C4;
        overflow-wrap: normal;
    }
    .dropdown-content {
        display: none;
        position: absolute;
        background-color:#C5E1A5 ;
        min-width: 400px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 1;
    }

    .dropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        font-size: .8em;
    }

    .nav-link{
        /*font-size: 1.1em !important;*/
        font-size: .8em !important;
    }


    .navbar-nav li{
        padding-right: 1px;
    }

    .side-product{
        margin-left: 10%;
        width: 100%
    }


    .social a{
        font-size: 2.5em;
        padding: 1.2rem;
    }
    .card-img-top{
        height: 200px;
        width: 100%;
    }

    #head{
        padding-top: 100px;
        background-image: url(image/slide2.gif);
        background-repeat: no-repeat;
        background-size: 100% 100%;
        width: 100%;
        height: 250px;
        /* background-color:	#AEAEAE;*/

    }
    .mySlides ul{
        display: none;
        width: auto;
    }

    #head .slide-caption{
        margin-left: -50%;
        margin-top: -150px;
        margin-right: 120%;
        height: 100px;

    }
    #head .slide-caption h4,#head .slide-caption h5{
        margin-top: 20%;
        background-color: #FF3D00;
        color: white;
        text-align: center;
        padding: 5px;
        border-radius: 25px;
        width: 100px;
        margin-left: 500%;
        font-size: 10px;

    }

    #head  ul{
        list-style-type: none;
        margin-left: 0%;

    }
    #head ul li{
        display: inline-block;


    }
    #head ul li:hover{
        background: none;


    }
    #head ul li img{
        height: 130px;
        width: 130px;
    }



}





@media (max-width: 576px) {

    .slide-more{
        margin-left: 60%;
        height: 50%;
        font-size: 12px;

    }
    .carousel-inner .carousel-item img{
        width: 50%;
        height: 330px;
    }

    .carousel-caption{
        margin-left: -15%;
        margin-right: -10%;
    }
    #banner ul li img{
        height: 70px;
        width: 70px;
        padding: 5px;
        border: 1px solid black;
        background-color: #FFF9C4;
        overflow-wrap: normal;
    }

    .back-about{
        margin-left: 20%;
        width: 60%;
    }
    form {
        padding: 50px;
        width: 100%;
        text-align: center;
    }
    #contact {
        background: #F9F9F9;
        padding: 25px;
        /* margin: 50px 150px;*/
        margin-left: 0%;
        margin-right:15%;
        width: 100%;
        margin-top: 25px;
        box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
    }
    .social a{
        font-size: 2em;
        padding: .7rem;
    }

    #head{
        padding-top: 100px;
        background-image: url(image/slide2.gif);
        background-repeat: no-repeat;
        background-size: 100% 100%;
        width: 100%;
        height: 200px;
        /* background-color:	#AEAEAE;*/

    }


    #head .slide-caption{
        margin-left: -50%;
        margin-top: -150px;
        margin-right: 120%;
        height: 100px;

    }
    #head .slide-caption h4,#head .slide-caption h5{
        margin-top: 50%;
        background-color: #FF3D00;
        color: white;
        text-align: center;
        padding: 5px;
        border-radius: 15px;
        width: 100px;
        font-size: 10px;
    }

    #head  ul{
        list-style-type: none;

        margin-left: 0%;
    }


    #head ul li img{
        height: 100px;
        width: 70px;
    }



}