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

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {

}
p{margin:0;padding:0;}
.slider {
  position: relative;
  overflow: hidden;
  height: 100vh;
  width: 100vw;
}

.slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
}

.slide.current {
  opacity: 1;
}

.slide .content {
  position: absolute;
  bottom: 70px;
  left: -600px;
  opacity: 0;
  width: 600px;
  background-color: rgba(255, 255, 255, 0.8);
  color: #333;
  padding: 35px;
}

.slide .content h1 {
  margin-bottom: 10px;
}

.slide.current .content {
  opacity: 1;
  transform: translateX(600px);
  transition: all 0.7s ease-in-out 0.3s;
}

.buttons button#next {
  position: absolute;
  top: 60%;
  right: 15px;
}

.buttons button#prev {
  position: absolute;
  top: 60%;
  left: 15px;
}

.buttons button {
  border: 2px solid #fff;
  background-color: transparent;
  color: #fff;
  cursor: pointer;
  padding: 13px 15px;
  border-radius: 50%;
  outline: none;
}

.buttons button:hover {
  background-color: #fff;
  color: #333;
}

@media (max-width: 500px) {
  .slide .content {
    bottom: -300px;
    left: 0;
    width: 100%;
  }

  .slide.current .content {
    transform: translateY(-300px);
  }
}



/* Backgorund Images */
 
.slide:first-child {
  background: url('..//Slider-image/New Project.jpg') no-repeat
    center top/cover;
}
.slide:nth-child(2) {
  background: url('..//Slider-image/slider-2.jpg') no-repeat
    center top/cover;
}
.slide:nth-child(3) {
  background: url('..//Slider-image/slider-3.png') no-repeat
    center top/cover;
}



</*  Custom code   */
body{margin:0; padding:0;}
h1,h2,h3,h4{margin:0px; padding:0px;}
h2{margin:0px; padding:0px;}
	p{margin:0; padding:0;}
	
	
	#dealbanner{width:100%;float:left;}
	.dealbanner{width:100%;float:left;}
	
	#productsection{width:100%;float:left;}
	.productsection{width:100%;float:left;}
	
	.psection{width:100%;float:left;margin-bottom:20px;}
	.psection h2{text-align:center;font-size: 36px;font-weight: 700;margin-bottom: 70px;margin-top:80px;color: black;	text-shadow:0 15px 10px rgba(0,0,0,0.5);}
	
	.rbox{width:14%;float:left;margin-left:25px;}.rbox img{width:40%;float:left;margin-left:3em;} .rbox P{text-align:center;font-size:16px;font-weight:600;margin-top:100px;margin-left:-20px;}
		.rbox1{width:14%;float:left;}.rbox1 img{width:40%;float:left;} .rbox1 P{text-align:center;font-size:16px;font-weight:600;margin-top:100px;margin-left:-6em;}
			.rbox2{width:14%;float:left;}.rbox2 img{width:40%;float:left;} .rbox2 P{text-align:center;font-size:16px;font-weight:600;margin-top:100px;margin-left:-6em;}
				.rbox3{width:14%;float:left;}.rbox3 img{width:40%;float:left;} .rbox3 P{text-align:center;font-size:16px;font-weight:600;margin-top:100px;margin-left:-7em;}
					.rbox4{width:14%;float:left;}.rbox4 img{width:40%;float:left;} .rbox4 P{text-align:center;font-size:16px;font-weight:600;margin-top:100px;margin-left:-7em;}
						.rbox5{width:14%;float:left;}.rbox5 img{width:40%;float:left;} .rbox5 P{text-align:center;font-size:16px;font-weight:600;margin-top:100px;margin-left:-7em;}
							.rbox6{width:14%;float:left;}.rbox6 img{width:40%;float:left;} .rbox6 P{text-align:center;font-size:16px;font-weight:600;margin-top:100px;margin-left:-7em;}
 
					
	#dealprice{width:100%;float:left;}
	.dealprice{width:100%;float:left;}	
		.dealse{width:100%;float:left;}
		.dealse h2{text-align:center;font-size: 36px;font-weight: 700;margin-bottom: 70px;margin-top:80px;color: black;	text-shadow:0 15px 10px rgba(0,0,0,0.5);}
	
			.dealbox{
				
				width:22%;
				float:left;
				margin:19px;
				box-sizing:border-box;
				text-align:center;
				border-radius:20px;
				box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);
				Backgorund:#f2f2f2;
				}
				.dealbox:hover{
					box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);
					transform:traslate(0px, -8px);
				}
			 .dealbox img{
				 
			width:100%;
			
			 text-align:center;margin:0 auto;
			 display:block;
			 }
			 .dealbox p{
				    text-align:center;
                    font-size:19px;					
				
			 }
			 .dealbox h6{
				 font-size:26px;
				 text-align:center;
				 color:#222f3e;
				 margin:0;
				 
				 
			 }
			 ul{
				 display:flex;
				 justify-content:center;
				 align-item:center;
				 padding-top:0;
			 }
			 li{
				 padding-top:5px;
			 }
			 .fa{
				 font-size:26px;
				 transition:.4s;
				 margin:3px;
			 }
			 .checked{
				 color:#ff9f43;
			 }
			 .fa:hover{
				 transform:scale(1.3);
				 transition:.6s;
			 }
			 .btn{
				 text-align:center;
				 font-size:24px;
				 color:#fff;
				 width:100%;
				 padding:15px;
				 border:0;
				 outline:none;
				 cursor:pointer;
				 margin-top:5px;
				 border-bottom-right-radius:20px;
				 border-bottom-left-radius:20px;
			 }
			 .buy-2{
				 background:#2183a2;
				 
			 }
			 .buy-3{
				 background:#3b3e6e;
			 }
			 .buy-4{
				 background:#0b0b0b;
			 }
			 .buy-5{
				 background:#ff9f43;
			 }
			 
			 #banner{width:100%;float:left;margin-top:5em;}
			 .banner{width:100%;float:left;}
			 .bgbaner{width:100%;float:left;}
			 .bgbaner h5{font-size:26px;
				 text-align:center;
				 color:#222f3e;
				 margin:40px;	text-shadow:0 15px 10px rgba(0,0,0,0.5);
				 }
				 
			 .bgbaner img{width:1360px;height:auto;margin-top:1em;}
			 
			 .wrapper{
				 margin:10px auto;
				 padding:0 10%;
				 padding-bottom:10px;
				 text-transform:capitalize;
			 }
			 #keyres{width:100%;float:left;}
			 .keyres{width:100%;float:left;}
			 .wrapper{width:100%;float:left;margin-top:4em;}
			  .wrapper h2{
				  color:#000;
				  font-size:40px;
				  text-align:center;
				  padding-bottom:15px;
				  text-shadow:0 15px 10px rgba(0,0,0,0.5);
			  }
			  .container{
				  width:100%;
				  gap:15px;
				  
				  
			  }
			  .kbox{
				  margin-top:8em;
				  width:24%;
				  padding:20px;
				  text-align:center;
				  border-radius:5px;
				 Backgorund:#ffff;
				  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
			  }
			  .kbox h3{
				  color:#444;
				  padding:10px 0;font-size:20px;
			  }
			  .kbox p{
				  color:#777;
				  font-size:16px;
				  line-height:1.6;
				  
			  }
			  
			  .kbox1{
				  margin-top:8em;
				  width:24%;
				  padding:20px;
				  text-align:center;
				  border-radius:5px;
				 Backgorund:#ffff;
				  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
			  }
			  
			   .kbox2{
				  margin-top:8em;
				  width:24%;
				  padding:20px;
				  text-align:center;
				  border-radius:5px;
				 Backgorund:#ffff;
				  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
			  }
			  
			  .kbox3{
				  margin-top:8em;
				  width:24%;
				  padding:20px;
				  text-align:center;
				  border-radius:5px;
				 Backgorund:#ffff;
				  box-shadow:0px 5px 10px rgba(0,0,0,0.2);
			  }
			  
			  
			  #footersec{width:100%;float:left;}
			  .footersec{width:100%;float:left;margin-top:7em;}

.row{
	display: flex;
	flex-wrap: wrap;
}
ul{
	list-style: none;
	display:block;
}
.footer{
	background-color: #24262b;
    padding: 70px 0;
}
.footer-col{
   width: 25%;
   padding: 0 50px;
}
.footer-col h4{
	font-size: 18px;
	color: #ffffff;
	text-transform: capitalize;
	margin-bottom: 35px;
	font-weight: 500;
	position: relative;
}
.footer-col h4::before{
	content: '';
	position: absolute;
	left:0;
	bottom: -10px;
	background-color: #e91e63;
	height: 2px;
	box-sizing: border-box;
	width: 50px;
}
.footer-col ul li:not(:last-child){
	margin-bottom: 10px;
}
.footer-col ul li a{
	font-size: 16px;
	text-transform: capitalize;
	color: #ffffff;
	text-decoration: none;
	font-weight: 300;
	color: #bbbbbb;
	display: block;
	transition: all 0.3s ease;
}
.footer-col ul li a:hover{
	color: #ffffff;
	padding-left: 8px;
}
.footer-col .social-links a{
	display: inline-block;
	height: 40px;
	width: 40px;
	background-color: rgba(255,255,255,0.2);
	margin:0 10px 10px 0;
	text-align: center;
	line-height: 40px;
	border-radius: 50%;
	color: #ffffff;
	transition: all 0.5s ease;
}
.footer-col .social-links a:hover{
	color: #24262b;
	background-color: #ffffff;
}

/*responsive*/
@media(max-width: 767px){
  .footer-col{
    width: 50%;
    margin-bottom: 30px;
}
}
@media(max-width: 574px){
  .footer-col{
    width: 100%;
}
}

/*     BOX CSSS  */

	#textt{width:100%;float:left;}
	.textt{width:100%;float:left;}
	.text1{width:100%;float:left;}
	.text1 h2{text-align:center;font-size:26px;color:#222f3e;margin:40px;	text-shadow:0 15px 10px rgba(0,0,0,0.5);}
	.Box{width:22%;float:left;margin-left:2em;box-shadow:5px 15px 25px #2e2e2e;}
	.Box img{width:100%;}
	.text2{width:100%;float:left;margin-top:2em;}
	.text3{width:100%;float:left;margin-top:2em;}
	 #footerbox{width:100%;float:left;}
			  .footerbox{width:100%;float:left;margin-top:7em;}
			  #reling{width:100%;float:left;}
			  .reling{width:100%;float:left;}
			  .relaet{width:100%;float:left;margin-top:3em;}

.relaet h3{font-size:26px;color:#222f3e;margin:40px;	text-shadow:0 15px 10px rgba(0,0,0,0.5);}
.rrbox{width:22%;float:left;box-shadow:5px 15px 25px #2e2e2e;margin-left:2em;}
.rrbox img{width:100%;}
.rrbox h4{text-align:center;font-size:26px;}
.rrbox p{text-align:center;font-size:18px;margin-top:3em;padding-bottom:2em;}

h3 {
         display: flex;
         flex-direction: row;
      }
      h3:before,
      h3:after {
         content: "";
         flex: 1 1;
         border-bottom: 3px solid orange;
         margin: auto;
      }   
	  /*     mobilecover CSSS  */
	  
	  #mobsection{width:100%;float:left;}
	  .mobsection{width:100%;float:left;}
	 
	 
	 
	 /* product section  */
	 
	 #prodsection{width:100%;float:left;}
	 .prodsection{width:100%;float:left;}
	 
	 .prodfullbox{width:100%;float:left;}
	 .pdtbox{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .pdtbox img{width:100%;}
	  .pdtbox h4{text-align:center;font-size:26px;}
	    .pdtbox p{text-align:center;font-size:18px;}
		
		.pdtbox1{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .pdtbox1 img{width:100%;}
	  .pdtbox1 h4{text-align:center;font-size:26px;}
	    .pdtbox1 p{text-align:center;font-size:18px;}
		
		.pdtbox2{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .pdtbox2 img{width:100%;}
	  .pdtbox2 h4{text-align:center;font-size:26px;}
	    .pdtbox2 p{text-align:center;font-size:18px;}
		
		
		.pdtbox3{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .pdtbox3 img{width:100%;}
	  .pdtbox3 h4{text-align:center;font-size:26px;}
	    .pdtbox3 p{text-align:center;font-size:18px;}
		
		
		
		.prodfullxob{width:100%;float:left;}
		.bocpdt{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .bocpdt img{width:100%;}
	  .bocpdt h4{text-align:center;font-size:26px;}
	    .bocpdt p{text-align:center;font-size:18px;}
		
		.bocpdt1{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .bocpdt1 img{width:100%;}
	  .bocpdt1 h4{text-align:center;font-size:26px;}
	    .bocpdt1 p{text-align:center;font-size:18px;}
		
		.bocpdt2{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .bocpdt2 img{width:100%;}
	  .bocpdt2 h4{text-align:center;font-size:26px;}
	    .bocpdt2 p{text-align:center;font-size:18px;}
		
		
		.bocpdt3{width:22%;float:left;margin-left:2em;margin-top:3em;box-shadow:5px 15px 25px #2e2e2e;}
	  .bocpdt3 img{width:100%;}
	  .bocpdt3 h4{text-align:center;font-size:26px;}
	    .bocpdt3 p{text-align:center;font-size:18px;}
		
		#footerprdt{width:100%;float:left;}
		.footerprdt{width:100%;float:left;margin-top:2em;}
		
		#footerip{width:100%;float:left;}
		.footerip{width:100%;float:left;margin-top:2em;}
		
		
		/* About US */
	.about-section{
    background: url(..//images/mcover.jpg) no-repeat left;
    background-size: 55%;
    background-color: #fdfdfd;
    overflow: hidden;
    padding: 100px 0;
	margin-top:3em;
}

.inner-container{
    width: 55%;
    float: right;
    background-color: #fdfdfd;
    padding: 150px;
}

.inner-container h1{
    margin-bottom: 30px;
    font-size: 30px;
    font-weight: 900;
}

.text{
    font-size: 13px;
    color: #545454;
    line-height: 30px;
    text-align: justify;
    margin-bottom: 40px;
}

.skills{
    display: flex;
    justify-content: space-between;
    font-weight: 700;
    font-size: 13px;
}

@media screen and (max-width:1200px){
    .inner-container{
        padding: 80px;
    }
}

@media screen and (max-width:1000px){
    .about-section{
        background-size: 100%;
        padding: 100px 40px;
    }
    .inner-container{
        width: 100%;
    }
}

@media screen and (max-width:600px){
    .about-section{
        padding: 0;
    }
    .inner-container{
        padding: 60px;
    }
}



/* SCR code  */

#secrsection{width:100%;float:left;}
.secrsection{width:100%;float:left;}
#footerscr{width:100%;float:left;}
.footerscr{width:100%;float:left;margin-top:2em;}


/* XR Section */
#xrscetion{width:100%;float:left;}
.xrscetion{width:100%;float:left;}
.xrscetion img{width:1355px;}