/* All common css start */
*{
    margin: 0;
    padding: 0;
    outline: 0;
    box-sizing: border-box;
    font-family: "Lato", sans-serif;
     
}
a,a:hover{
    text-decoration: none;
    display: inline-block;
}
ul,ol{
list-style-type: none;


}
h1,h2,h3,h4,h5,h6,p{
margin: 0;
padding: 0;
line-height: 0.8;

}
body{
     background: #1E1E1E;

}
/* All common css end */
/* 
Header part start  */
.navbar {
    
    background: #1E1E1E;
}
.nav-link{
    color: #959595;
    font-size: 20px;
    font-weight: 700;
    font-family: lato;
}
.nav-link:hover{
    color: #FD6F00;
}
.hireBtn{
    background: #FD6F00;
    padding: 8px 25px;
    border-radius: 10px;
    color: white;
    outline: none;
    border: 2px solid #FD6F00;
    border-radius: 5%;
}
/* Header part End */
/* Banner part Start */
#bannerPart{
    padding-top: 125px;
    padding-bottom: 100px;
    background: #1e1e1e;
}
.bannerText h4{
font-size: 24px;
font-weight: 600;
color: #707070;


}
.bannerText h3{
font-size: 28px;
font-weight: 700;
color: #959595;
padding-top: 10px;
padding-bottom: 24px;
}
.bannerText h1{
   background: linear-gradient(90deg, #984300 0%, #FD6F00 46%, #CA5900 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
font-size: 70px;
font-weight: 900;
padding-top: 10px;
padding-bottom: 20px;


}
.iconRoundShap{
    height: 40px;
    width: 40px;
    border:2px solid #575757;
    border-radius: 50%;
    position: relative;
    margin-right: 10px;
}
.bannerIcon{
    padding-top: 17px;
    padding-bottom: 30px;
    display: flex;
}
.bannerIcon i{
    color: #fff;
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);

}
.bannerBtn{
    display: flex;
    column-gap: 20px;
}
.counterItem{
    padding: 10px;
    border-right: 2px solid #959595;
}
.brN{
    border-right: none;
}

.hireBtn:hover{
    background: transparent;
    border:2px solid #FD6F00; 
    border-radius: 5%;
    transition: .4s;
    
}
 .counterItem h2{

   font-size: 24px;
  font-weight: 800;
  color: #FD6F00;
  padding-bottom: 15px;
}


.counterItem h3{
font-size: 20px;
  font-weight: 700;
  color: #DFDFDF;
}
.bannerCounter{
    background: rgb(255, 255, 255,4%);
    padding: 24px;
    margin-top: 25px;
    border-radius: 8px;
}
.bannerModel{
    margin-left: 25px;
    margin-top: 5px;
}
/* Banner part End */
/* Service part start */
#servicePart{
    padding: 100px 0;
}
.commonTitle h3{
    font-size: 40px;
    font-weight: 700;
    color:#fff;
}
.commonTitle p{
    font-size: 20px;
    font-weight: 500;
    color:#959595;
    padding-top: 20px;
}
.serviceup{
    display: flex;
    justify-content: space-between;
  
}
.servicedown{
    display: flex;
    justify-content: space-between;
   
}
.serviceone{
   padding: 30px 30px;
    background: rgb(255, 255, 255,4%);
    text-align: center;
    margin-top: 50px;
}
.serviceone:hover{
    background: transparent;
    transition: 0.4s;
}
.serviceone p{
     font-size: 20px;
    font-weight: 500;
    color:#959595;
    margin-right: 10px;
}
.servicetwo{
   padding: 30px 30px;
   background: rgb(255, 255, 255,4%);
    text-align: center;
    margin-top: 30px;
     margin-right: 10px;
}
.servicetwo:hover{
     background: transparent;
    transition: 0.4s;
}

.servicetwo p{
     font-size: 20px;
    font-weight: 500;
    color:#959595;
}
/* Service Part End */
/* About Part Start */

#aboutmePart{
    padding: 100px 0;
}
.aboutText h3{
    font-size: 40px;
    font-weight: 700;
    color:#fff;
}
.aboutText p{
    font-size: 20px;
    font-weight: 500;
     color:#959595;
     padding-top: 20px;
}
.aboutsecondpart{
    display: flex;
    justify-content: space-between;
}
.textitem p{
    font-size: 20px;
    font-weight: 500;
     color:#959595;
     padding-top: 200px;
     line-height: 30px;
}
.aboutBtn a{
    color: #fff;
     font-size: 20px;
    font-weight: 500;
    padding-left: 5px;
}
.aboutBtn{
    
    padding: 8px 25px;
    background: #FD6F00;
    display: inline-block;
    
    margin-top: 20px;
    
}
.aboutBtn:hover{
     background: transparent; 
     border-radius: 5%;
      border:2px solid #FD6F00 ;
    transition: 0.4s;
    
}
.shape{
    display: flex;
    justify-content: space-between;
    text-align: center;
    padding-top: 20px;
    
}
.shape img:hover{
    background: transparent;
    
    transition: 0.4s;

}
.shape h3{
font-size: 30px;
    font-weight: 700;
   background: linear-gradient(90deg, #984300 0%, #FD6F00 46%, #CA5900 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
padding-top: 20px;
}
.shape p{
    font-size: 24x;
    font-weight: 700;
    color: #959595;
    padding-top: 15px;
}  
/* About Part  End  */
/* Porfolio Part Start */
#protfolioPart{
    padding: 100px 0;
}
.protfoliotext h3{
    font-size: 40px;
    font-weight: 700;
    color: #FEFEFE;
    padding-bottom: 20px;
    padding-top: 20px;
}
.btnItem{
    font-size: 16px;
    font-weight: 700;
    color: #C6C6C6;
    margin-top: 25px;
    margin-left: 20px;
    padding: 10px 20px;
    background: rgba(255, 255, 255, 8%);
}
.btnItem:hover{
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 8%);
    transition: 0.4;
}
.imgItem{
    margin-top: 50px;
    padding-right: 20px;

}
    

.imgItem:hover{
    border: 2px solid rgba(255, 255, 255, 8%);
    background: transparent;
    transition: 0.4s;
    border-radius: 5%;
    
}
.imgText{
display: flex;
justify-content: space-between;
height: 58px;
width: 420px;
 background: rgba(255, 255, 255, 8%);
 padding: 20px 15px;
 border-radius: 5%;
}



   

    .imgText:hover{
           background: transparent;
        transition: 0.4s;
        
    }
    
.imgText h3{
    
    font-size: 16px;
    font-weight: 700;
    color:  #C6C6C6;
    display: inline-block;
    
}
/* Portfolio Part End */
/* Contact Part Start */
#contactPart{
    padding: 100px 0;

}

.contactText h3{
    font-size: 40px;
    font-weight: 700;
    color: #FEFEFE;
}

.contactText p{
    font-size: 16px;
    font-weight: 700;
    color: #707070;
    padding-top: 25px;
}
.boxLeft{
    margin-top: 50px;
    margin-left: 20px;
   
    
  
}
input::placeholder{
    background:     rgba(255, 255, 255, 4%);
    padding-top: 20px;
    color: #959595;
}
.boxRight{
    margin-top: 40px;
}
input::placeholder Project Details{
    padding: 20px 30px;
}
/* Contact Part end */
/* Logo Part Start */
#logoPart{
    padding: 200px 0;
    background:  rgba(255, 255, 255, 4%);
}
.logoText{
    font-size: 20px;
    font-weight: 500;
    color: #959595;
    padding-top: 40px;
    padding-left: 30px;
}
.logoIconShape{
     height: 40px;
    width: 40px;
    border:2px solid #575757;
    border-radius: 50%;
     position: relative;
    margin-right: 10px;
   
    
}
.logoIcon{
    padding-top: 17px;
    padding-bottom: 30px;
     display: flex;
    padding-left: 550px;
    padding-top: 50px;
    
}
.logoIconShape i{
    color: #fff;
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);

}
.logoIcon :hover{
    background: transparent;
    border: 2px solid red;
    transition: 0.4s;
}


.footerContent {
  text-align: center;
}
.footerContact {
  font-weight: 700;
  font-size: 20px;
  color: #959595;
}
.footerText {
  padding: 16px 120px 24px 120px;
  background: transparent;
  border-top: 1px solid #707070;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #707070;
  margin-top: 50px;
}
/* Logo Part End */