@import url('https://fonts.googleapis.com/css2?family=Dongle:wght@300;400;700&display=swap');

:root {

  --pink-color: #f87652;
}

body{

 background-color: white;
}
* {
  font-family: 'Roboto', sans-serif;

}


h1, h2, h3, h4, h5, h6, p, span {
  cursor: pointer;
}


/* frontpage */


.front-page h1{
  color: #FC9918;
  font-size: 80px;
  margin: 0;
}
.front-page span{
  color: #000;
}
.front-page .second-logo{
  font-size: 50px;
color:#000;
}

@media only screen and (max-width: 650px) {

  .front-page span{
    color: #fff;
  }
  .front-page .second-logo{
    font-size: 50px;
  color:#fff;
  }

  }
.front-para{

  color: #FC9918;
}
@media only screen and (max-width: 650px) {

  .front-page h1{
    font-size:2.3rem;

  }
  .front-para{

    font-size: .5rem;
  }
  }

/* navbar*/


.nav-sec .navbar-brand {
  font-size: 30px;
  color: black;
}

.nav-sec .nav-item {
  margin: 0px 20px;
}

.navbar-brand span:hover {
  color: var(--pink-color);
}

.nav-hover a:hover {
  background-color: grey;
  color: pink;
  border-radius: 3%;
}

/* product section */

.hero-text{
  line-height: 2;

}
.heros-section {
  padding-top: 150px;
 padding-bottom: 100px;
}

.hero-text-margin {
  margin-top: 5%;
}

.pipe-image {
  width: 80%;


  border-radius: 50%;


}

@media only screen and (max-width: 1200px) {
  .hero-text-margin {
    text-align: center;

  }
}

  .pipe-image{
    padding-top: 8%;
  }


}

h1 {
  font-weight: bold;
  font-size: 7rem;
}

h1, h2, h3, p {
  color: black;
}


/* parallex */


.parallex{
  /* border: 0;
  padding: 0;
  margin: 0; */
  display: flex;
  align-items: center;
  justify-content: center;
  /* width: 100%; */

}

.div1 {
  background-image: url(../images/welding1.jpg);
  background-size: cover;
  background-attachment: fixed;
  height: 100vh;



}

.div2 {
  background-image: url(../images/steel.jpg);
background-size: cover;
  background-attachment: fixed;
  height: 300px;
}

.div3 {
  background-image: url(../images/grid.jpg);
background-size: cover;
  background-attachment: fixed;
  height: 300px;
}



/* services */


.services-pad{
  padding-top: 100px;
}
.services-title{
margin: auto;
  width: 80%;

}

.services-list{
 padding: 10% 20%;

}
.services-list h5{
  text-transform: uppercase;
}

.container-fluid .card{
  background-color: rgba(248, 252, 253, 0.97);
}
.container-fluid .card:hover{
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.container-fluid i{
padding-top: 10px;
}


#servic .services-list .col-lg-3 {
padding-bottom: 20px;
}
p.card-text {
  padding-bottom: 40px;
}

/* Product Area */


.servic-con{
  padding-top: 100px;
}

.screwcont{
width:80%;
padding-top: 3%;
}



.screwcomp{
 margin: auto;
  width: 40%;



}
@media only screen and (max-width: 780px) {
  .screwcomp{

    width: 70%;



  }
}
.pip{

  width:95%;
  margin-bottom: 5%;
}
.padding-top{
  padding-top: 3%;
}

.padding-bottom{
  padding-bottom: 3%;
}
.pip1{
  width: 80%;

}
@media screen and (min-device-width: 770px) and (max-device-width: 1000px) {


.pip1{
  position: relative;
  left: 140px;
  width: 60%;
}


  }


.oh{

width: 45%;

}
.text-bold{
  font-weight: bold;
}
.oh1{


  width: 100%;
}
.pipdiv{
  position: relative;
  top: 25%;
}
.oh1div{
  position: relative;
  top: 44%;
}
@media screen and (min-device-width: 780px)and (max-device-width: 1000px) {

.solution-pad{
  padding-top: 15%;
}



  }

  @media screen and (max-device-width: 780px) {

  .solution-pad{
    padding-top: 25%;
  }



    }


@media screen and (min-device-width: 770px) and (max-device-width: 1000px) {


.oh1{
  position: relative;
  left: 140px;
  width: 60%;
}


  }

.op{

width: 60%;

}
.padding-bot{
  padding-bottom: 10%;
}
.padding-tp{
  padding-top: 10%;
}

@media screen  and (max-device-width: 420px) {


  .op{

  width: 80%;

  }

  }
.op-pos{
position: relative;
top: 6%;

}


/* subscribe section */



.subscribe-us-area .subscribe{
  background-color: #3C4245;

padding: 10rem 0;
margin: 3rem auto;

}
.subscribe-us-area .subscribe .subscribe-title h4{
  font:normal 700 30px;
  color:white;
}
.subscribe-us-area .subscribe .subscribe-title p{
  color: white;
  padding: 1rem 4rem;

}


/* footer */

footer.footer-area{
  padding:3rem 0;
  background-color:#5F6769 ;
}

.footer-area .social h5{
  font:normal 500 23px/30px;
}
.footer-area .social a>i{
  font-size:22px;
  padding: 1rem 2rem;
  color:black;
}
.footer-area a{
  text-decoration:none;
}
.spanblink{
  color: #F4722B;
}
.spanblink:hover{
  color:whitesmoke;
}


.footer-area .social a:hover>i{
  color:whitesmoke;
}