*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html , body{
    height: 100%;
    width: 100vw;
  
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;;
   
  }
    

.nav ul {
    display: flex;
    align-items: center;
    
    list-style-type: none;
    padding: 0; /* Optional: removes default padding */
    
}
.logo-video{
    width: 20vh;
    height: auto;
    background-size: cover;
}
a{
    text-decoration: none;
    color: #000;
}

.row {
     display: inline;
     padding-left: 5vw;
  

    
}

.row a {
    position: relative;
    text-decoration: none;
    font-family: 'poppins', sans-serif;
    color: #fff;
    font-size: 18px;
    letter-spacing: 0.5px;
}

.row a:after {
    content: "";
    position: absolute;
    background-color: #D41A1A; /* Change this to the desired underline color */
    height: 3px;
    width: 0;
    left: 0;
    bottom: -10px;
    transition: width 0.3s ease-in-out;
}

.row a:hover {
    color: #D41A1A;
    font-weight: 600;
}

.row a:hover:after {
    width: 100%;
}

.nav{
    height: 25vh;
font-style: bold;
font-weight: 600;
    width: 100vw;
    overflow: hidden;
    font-size: 1.6vw;
    background-color: #000;
    display: flex;
align-items: center;
justify-content: space-evenly;
text-transform: uppercase;
list-style: none;
font-style: italic;
font-family: 'Fira Sans', sans-serif;
}
.line{
    /* background-color: #E3EAFB; */
    text-transform: uppercase;
    font-style: bold;
    height: 5vw;
    background-color: #333333;
  
    
}
.line p{
color: #fff;
font-size: 2vw;
display: flex;
align-items: center;
}

.line marquee{
    border-bottom: 2px solid white;
    height: 5vw;
 
    
border-top: 2px solid white;
}
.page0{
    height: 20vh;
    width: 100%;
    background-size: cover;
    overflow: hidden;
    display: flex;
    align-items: center;
    background-color:  #293646;
    justify-content: space-evenly;
    border-bottom: 2px solid black;
}
.sc1{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 16vh;
    width: 30vw;
    overflow: hidden;
    background-color: #ffffffc0;
    border-bottom: 2px solid gray;
}
.sc1 .sc2{
    padding: 2vw;
}
.sc1 .img img{
    width: 7vw;
height: auto;
}
.sc1 img {
width: 7vw;
height: auto;
}
.sc2 h3{
    font-size: 2vw;
}
.sc1 small{
    font-size: 1.5vw;
  color: #D41A1A;
}
.page2{
    overflow: hidden;
    margin-top: 4vh;
    margin-bottom: 4vh;
   /* display: block; */

}
.hightlight{
    background-color: #D41A1A;
        text-align: center;
    color: #fff;
   margin-bottom: 20px;
       font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    }
.hightlight h1{
    font-size: 3vw;
}
.pd{
    display: flex;
    align-items: center;
    background-color: #fff;
    justify-content: space-evenly;
}
.card{
    font-family:'Baloo Bhai 2', sans-serif;
    font-family: 'Cabin', sans-serif;
    font-family: 'Fira Sans', sans-serif;;
    position: relative;

}
.card-img-top{
         padding: 12px;
         transition-duration: 1s;
}
.card-img-top::after{
  content: "";
position: absolute;
transition: 0.5 ease-in-out;
}
.card-img-top:hover{
    padding: 5px;
    transition: .5s ease-in-out;
    
}
.card-img-top ::before{
    padding: 20px;
}
.pd .card .btn .btn-primary{
background-color: #D41A1A;
}

.page9{
    height: 70vh;
    width: 100vw;
    
    
}
.page9 img{
    width: 100%;
    height: auto;
    display: flex;
    background-size: contain;
    
}
.page9 .redbox{
    width: 100vw;
    height: auto;
    background-size: cover;
}
 

.page3 .bt{
    text-align: center;
    margin-top: 20vh;
    width: 100%;
    height: 5vh;
    background-color: gray;
    border-top: 2px solid black;
    border-bottom: 2px solid black;
}
.page02{
    text-align: center;
    padding-top: 20vh;
    /* font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; */
}
.page02 marquee{
    color: #2e191946;
    background-color: papayawhip;
}
.page3{
    margin-top: 2vh;
    background-color:#000;
    color: #fff;
    width: 100vw;
    height: 40vh;
}

.footer{
   
    height: 25vh;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer h4{
 font-size: 3vw;
    padding-top: 2vh;
}
.footerleft{
    height: 100%;
    width: 50%;
    /* background-color: rgba(1
    66, 136, 227, 0.421); */
    text-align: center;
   
}
.footerleft .ptag{
    padding-top: 2.4vh;
    font-size: 2vw;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.footerleft .ptag a{
    
    text-decoration: none;
    color: #fff;
}
.footerright{
    height: 100%;
    width: 50%;
    /* background-color: rgba(166, 136,  227, 0.421); */
    text-align: center;
}
.ptag i{
    font-size: 2.4vw;
    color: #fff;
    padding-left: 20px;
}

.copy{
    border-top: 2px solid #D41A1A;
    text-align: center;
  
    /* padding: 5vh; */
   
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.copy h3{
    margin-top: 2vw;
    font-size: 2vw;
}


/* -------------product page--------- */

.pp1 .page-video{
    width: 100%;
    height: auto;
    display: flex;
    
}
.pp1{
    height: 30vh;
    width: 100vw;

}
.pp1 img{
    height: 100%;
   width: 100%;
 
}
.pp01{
    margin-top: 280px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 500;
    text-align: center;
}
.pp01 h2{
    background-color: #D41A1A;
    color: #fff;
    font-size: 3vw;
    
}
.pp2{
    margin-top: 6vh;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
.card-body h5{
    text-align: center;
      color: #586067;
    /* color: rgba(85, 63, 34, 0.705); */
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
.pp03 h2{
height: 46px;
width: 100vw;
background-color: #D41A1A;
color: #fff;
font-size: 3vw;
    text-align: center;
}

.pp3{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
  padding: 0;
  margin: 0;
    height: 20vh;
    
    width: 100vw;
}
.pp03{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
       height: 20vh;
       

    width: 100vw;
 

}
.brands{
    margin-bottom: 10vh;
    height: 30%;
    background-size: cover;
}
.this{
    padding-top: 2vh;
}

/*      electronisitems    */

.eip1{
    height: 100vh;
    width: 100vw;
    color: #222;
    background-color: rgba(226, 223, 191, 0.376)    ;
}
.eip1{
    text-align: center;
}
.ep1{
    height: 30vh;
    
    width: 100vw;
    background-color: #fff;
    display: flex;
    justify-content:space-evenly;
    align-items: center;
    

}
.left{
    height: 100%;
    width: 20vw;
    align-items: center;
    display: flex;

    
}
.right{
    height: 100%;
    width: 82vw;
    text-align: start;
    display: flex;
    flex-direction: column;
    justify-content: center;


}
.right small{
    text-decoration: line-through;
}
.eip2{
    /* margin-top: 20vh; */
    height: 80vh;
    width: 100vw;
    color: #222;
    background-color: rgba(226, 223, 191, 0.376);
}
.eip2{
    text-align: center;
}
.eip3{
    /* margin-top: 20vh; */
    height: 40vh;
    width: 100vw;
    color: #222;
    background-color: rgba(226, 223, 191, 0.376);
}
.eip3{
    text-align: center;
}

/* television */
.tvp1 .card{
    border: none;
}
.tvp0{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#acer{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.tvp1 .card-title{
    color: #333333d8;
    
}
.tvp1 .pri{
    font-weight: 500;
    color: #D41A1A;
}
.tvp1 p{
    text-align: center;
}
.tvp1 .mrp{
    color: #B6B3B3;
   text-decoration: line-through;
}
.tvp1 .by{
    text-transform: capitalize;
    text-align: center;
    font-size: 20px;
    color: #D41A1A;
    border: 1.9px solid #D41A1A;
    border-radius: 10px;
}
#tcl{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.tvp01{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#vu{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.tvp02{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#skywall{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.tvp03{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#foxsky{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.tvp04{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#samsung{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.tvp05{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#lg{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.tvp06{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
/* electronics */
#blackdecker{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.elp01{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#acer{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
.elp02{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top: 10vh;
}
#refrigerator{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
#ac{
    background-color: #D41A1A;
    color: #fff;
    font-size: 2vw;
    text-align: center;
}
/* acer32 */

.acp1{
    margin-bottom: 5vh;
    height: 85vh;
    width: 100vw;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    background-color: #fff;
    justify-content: center;
    /* border-bottom: 2px solid chocolate; */
}
.immagesec{

    padding: 10vh;
    height: 60%;
    width: 40%;
    background-color: rgb(255, 255, 255);
}
.infosec h2{
    font-size: 30px;
}
.infosec{
    
    padding: 5vh;
    height: 60vh;
    width: 60%;
    background-color: #fff;
}
#sp{
    font-style: italic;
    font-weight: 500;
    color: #131212;
}
#sp i{
    color: rgb(255, 145, 0);
}
#price #se{
    font-size: 25px; 
    font-weight: 500; 
}
.infosec #small{
    font-size: 15px;
    font-weight: 500;
    color: #da0404;
    text-decoration: line-through;
}
#gr{
    color: green;
    font-size: 15px;
}
span{
   
font-weight: 600;
}

.btne {
     height: 30px;
     width: 140px;
    font-size: 12px;
    background-color: #da0404;
    color: #fff;
    border-radius: 12px;
    border: none;
    cursor: pointer;
    text-decoration: none; /* Remove default underline on anchor inside button */
    display: inline-block; /* Make the button behave as an inline block */
    transition: background-color 0.3s;
}

/* Glow animation */
@keyframes glow {
    0% {
        box-shadow: 0 0 10px #da0404;
    }
    50% {
        box-shadow: 0 0 20px #da0404;
    }
    100% {
        box-shadow: 0 0 10px #da0404;
    }
}

/* Apply glow on hover */
.btne:hover {
    background-color: #297fb8; /* Change color on hover */
}

/* Apply glow after 5 seconds */
.btne.glow-effect {
    animation: glow 2s 5s infinite;
}
.btne p{
    font-size: 20px;
    color: #fff;
    text-align: center;
}


.warr {
    height: 39vh;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;

  }

  .warr h5 {
    text-align: center;
  }

  /* .warr button {
    background-color: #fff;
    border: 2px solid #da0404;
    height: 5vh;
    width: 3vw;
    margin: 12px;
    align-items: center;
    justify-content: center;
    display: flex;
  } */

  .warr .alink {
display: flex;
align-items: center;
justify-content: flex-end;
flex-direction: row;
  }

  /* .warr button {
    height: 100%;
    width: 100%;
    background-color: #fff;
    border: 2px solid #da0404;
    height: 5vh;
    width: 3vw;
    margin: 12px;
  
  } */

.warr .alink {
  display: flex;
  align-items: center;
  justify-content: center;
}

.warr .alink a {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border: 2px solid #da0404;
  height: 5vh;
  width: 3vw;
  margin: 12px;
  text-decoration: none; /* Remove underline from links */
  color: #000; /* Change link color if needed */
}

.warr .alink a:hover {
  background-color: #da0404;
  color: #fff; /* Change link color on hover if needed */
}

  

  
  
  

 /* Your existing styles */
 .acerlogo {
    display: flex;
    align-items: center;
    padding-bottom: 30px ;
    border-bottom: 2px solid #da0404;
}

.logo img {
    /* max-width: 100%;
    height: auto; */
    width: 60px;
    height: auto;
}

.acerlogo .text{
    margin-left: 20px;
    text-transform: capitalize;
    
}
.acerlogo .text p{
    color: #da0404;
    
}
.acerlogo .text a:after {
    content: "";
    position: absolute;
    
    height: 3px;
    width: 0;
    left: 0;
    bottom: -10px;
    transition: width 0.3s ease-in-out, opacity 0.3s ease-in-out 0.3s; /* Added opacity transition */
  }
  
  .acerlogo .text a:hover {
    border-bottom: 4px solid #297fb8;
    color: #297fb8;
    font-weight: 600;
    transition: 0.3s ease-out;
    /* transition-duration: 0.3; */
  }
  
  .acerlogo .text a:hover:after {
    width: 100%;
    opacity: 0; /* Fading out the line */
  }
/* Pop-up styles */
.popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 1000;
}

/* manufacturing */
.slid1{
    height: 80vh;
    width: 100vw;
    
}
.slid1 {
    position: relative;
  }

  .slidvid {
    width: 100%;
    height: auto;
    display: block;
  }

  .controls {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.5);
    padding: 10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    cursor: pointer;
  }

  .control-btn {
    color: #fff;
    margin: 0 5px;
    cursor: pointer;
  }
.slid1 .slidvid{
    height: auto;
    width: 100%;
    background-size: cover;
}
.slid1 img{
   width: 100%;
   height: auto;
   background-size: cover;
}
/* Overlay styles */
.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 900;
}
/* vu television */

.slidbig{
    height: auto;
    width: 100vw;
    background-color: rgb(0, 0, 0);
    text-align: center;
    margin-bottom: 10px;
  }
  .slidbig img{
    width: 75%;
   
  }
  #ff{
    background-color: #fff;
  }
  .sligsm{
    width: 70vw;
display: flex;
margin-left: 200px;

 
  }
  .ssm1{
    
    width: 100%;
    margin-left: 10px;
  }
.slidtop img{
    width: 90%;
}
  .slidbottom{
    width: 90%;
    font-size: 12px;
    margin-top: 10px;
    margin-left: 10px;
    align-items: center;
  }
/* Close button styles */
.close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
}
.acp2{
    height: 60vh;
    background-color: #fff;
    width: 100vw;
    display: flex;
   
     margin-top: 0;   
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
}
.acp02{
    height: 100%;
    width: 45%;
}
.acp002{
    height: 100%;
   
    width: 55%;
}
.acp3{
    
    height: 50px;
    width: 100vw;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    border-bottom: 2px solid #da0404;
}
 .acp3 .texts{
    
   margin-bottom: 10px;
   font-weight: 700;
  
    font-size: 19px;
} 


.texts {
   
    cursor: pointer;
    padding: 10px;
    margin-bottom: 5px;
    transition: background-color 0.3s, color 0.3s;
}
.texts:hover{
    background-color: #da0404;
    color: #fff;
}
.texts p{
    font-size: 20px;
font-weight: 800;
}


.active {
    background-color: #da0404;
    color: white;
}

.textov{
    margin: 30px;
    display: flex;
    align-items: flex-start;
    justify-content:space-evenly;
    height: 100%;
    width: 100%;

}
.textov h2{
    font-size: 15px;
}
.textov p{
    font-size: 12px;
}
.textov1{
    height: 100%;
    width: 40%;
}
.textov2{
    height: 100%;
    width: 40%;
}
.texts {
    cursor: pointer;
    padding: 10px;
    margin-bottom: 5px;
    transition: background-color 0.3s, color 0.3s;
}

.active {
    background-color: red;
    color: white;
}

.content {
    display: none;
}

.active-content {
    display: block;
}
/* detail $ spec */
.table{
    display: flex;
    justify-content: space-evenly;
    align-items: flex-start;
}
.td1{
    margin: 30px;
    width: 50vw;
    }

.td1 th{
    font-size: 20px;
}
.td1 tbody .sp{
    border: 5px solid #fff; 
    border-radius: 40px;
    background-color: #00000011;
}
#includedContent{
    margin: 30px;
}

@media (max-width: 600px) {
    .acp1{
        margin-top: 14vh;
        height: 100vh;
        width: 100vw;
     
        flex-direction: column;
      
    }
    .immagesec{
        height: 60%;
        width: 100%;
        background-color: rgb(255, 255, 255);
    }
    .immagesec img{
        width: auto;
        height: 40%;
        background-size: cover;
        margin-bottom: 0;
    }
    .infosec{
        padding: 5px;
        width: 100%;
       
    }
    .infosec h2{
        padding: 0;
        font-size:10px;
    }
    #sp{
        font-size: 7px;
    }
    .infosec p{
        margin: 0;
        padding: 2px;
        font-size: 6px;     
    }
    .infosec small{
        padding: 0;
       margin: 0;
        font-size: 5px;
    }
   /* .wer{
    padding: 0;
    margin: 0;
   } */
    .btne{
width: 40px;
height: 12px;
       font-size: 12px;
        left: 3%;
        top: 100%;
        color: rgb(124, 162, 250); 
    }
    
    /* .warr h5{
        font-size: 12px;
    }

    .warr button{
        height: 22px;
        width: 23px;
        margin: 12px;
        padding: 0;
        
    } */
    .acp2{
     height: 150vh;
  text-align: center;
        
    }
   
    .acp2 UL{
        padding-left: 30px;
        padding-right: 20px;
        text-align: start;
    }
}
/* contactus */

.beforcont{
    margin-top: 50px;
    height: 50vh;
    width: 100vw;
    background-color: #0000000d;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-bottom: 5px solid #da0404;
    border-top: 5px solid #da0404;
}
.ser img{
    width: 65px;
    height: auto;
    background-size: cover;

}
.heder h3{
   text-align: center;
   font-size: 40px;
   color: #000;

}
.ink button{
    margin-top: 30px;
    border: none;
    outline: none; 
}

.beforcont .ink button a{
	padding: 8px 16px;
	font-size: 18px;
	background-color: #D41A1A;
	color: #fff;
    font-weight: 700;
	border: 1px solid transparent;
	border-radius: 25px;
	outline: none;
	cursor: pointer;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.3);
	transition: 0.4s;
}
.beforcont .ink button a:hover{
	background-color: #297fb8;
	color: #fff;
	box-shadow: 0px 0px 15px rgba(181, 70, 70, 0.3);
	border: 1px solid dodgerblue;
}






.container{
	width: 100%;
	min-height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
    background-color: #fff;
	padding: 30px 8%;
}
.container .row{
	display: flex;
	justify-content: space-between;
	width: 100%;
	max-width: 1100px;
}
.row section.col{
	display: flex;
	flex-direction: column;
}
.row section.left{
	flex-basis: 35%;
	min-width: 320px;
	margin-right: 60px;
}
.row section.right{
	flex-basis: 60%;
}
section.left .contactTitle h2{
	position: relative;
	font-size: 28px;
	color: #000 ;
	display: inline-block;
	margin-bottom: 25px;
}
section.left .contactTitle h2::before{
	content: '';
	position: absolute;
	width: 50%;
	height: 1px;
	background-color: #888;
	top: 120%;
	left: 0;
}
section.left .contactTitle h2::after{
	content: '';
	position: absolute;
	width: 25%;
	height: 3px;
	background-color: dodgerblue;
	top: calc(120% - 1px);
	left: 0;
}
section.left .contactTitle p{
	font-size: 17px;
	color: #000;
	letter-spacing: 1px;
	line-height: 1.2;
	padding-bottom: 22px;
}
section.left .contactInfo{
	margin-bottom: 16px;
}
.contactInfo .iconGroup{
	display: flex;
	align-items: center;
	margin: 25px 0px;
}
.iconGroup .icon{
	width: 45px;
	height: 45px;
	border: 2px solid dodgerblue;
	border-radius: 50%;
	margin-right: 20px;
	position: relative;
}

.iconGroup .icon i{
	font-size: 20px;
	color: #000;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.iconGroup .details span{
	display: block;
	color: #000;
	font-size: 18px;
}
.iconGroup .details span:nth-child(1){
	text-transform: uppercase;
	color: #004;
}
section.left .socialMedia{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	margin: 22px 0px 20px;
}
.socialMedia a{
	width: 35px;
	height: 35px;
	text-decoration: none;
	text-align: center;
	margin-right: 15px;
	border-radius: 5px;
	background-color: dodgerblue;
	transition: 0.4s;
}
.socialMedia a i{
	color: #ddd;
	font-size: 18px;
	line-height: 35px;
	border: 1px solid transparent;
	transition-delay: 0.4s;
}
.socialMedia a:hover{
	transform: translateY(-5px);
	background-color: #2e2e2e;
	color: dodgerblue;
	border: 1px solid dodgerblue;
}
.socialMedia a:hover i{
	color: dodgerblue;
}

/* Code for the right section (column) */

.row section.right .messageForm{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-top: 30px;
}
.row section.right .inputGroup{
	margin: 18px 0px;
	position: relative;
}
.messageForm .halfWidth{
	flex-basis: 48%;
}
.messageForm .fullWidth{
	flex-basis: 100%;
}
.messageForm input, .messageForm textarea{
	width: 100%;
	font-size: 18px;
	padding: 2px 0px;
	background-color: #ffffff90;
	color: #000;
	border: none;
	border-bottom: 2px solid #666;
	outline: none;
}
.messageForm textarea{
	resize: none;
	height: 220px;
	display: block;
}
textarea::-webkit-scrollbar{
	width: 5px;
}
textarea::-webkit-scrollbar-track{
	background-color: #1e1e1e;
	border-radius: 15px;
}
textarea::-webkit-scrollbar-thumb{
	background-color: dodgerblue;
	border-radius: 15px;
}
.inputGroup label{
	position: absolute;
	left: 0;
	bottom: 4px;
	color: #888;
	font-size: 18px;
	transition: 0.4s;
	pointer-events: none;
}
.inputGroup:nth-child(4) label{
	top: 2px;
}
.inputGroup input:focus ~ label, .inputGroup textarea:focus ~ label,
.inputGroup input:valid ~ label, .inputGroup textarea:valid ~ label
{
	transform: translateY(-30px);
	font-size: 16px;
}
.inputGroup button{
	padding: 8px 16px;
	font-size: 18px;
	background-color: #D41A1A;
	color: #ddd;
	border: 1px solid transparent;
	border-radius: 25px;
	outline: none;
	cursor: pointer;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.3);
	transition: 0.4s;
}
.inputGroup button:hover{
	background-color: #2e2e2e;
	color: dodgerblue;
	box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.3);
	border: 1px solid dodgerblue;
}
/* servicepage */


@media(max-width: 1100px){
	.messageForm .halfWidth{
		flex-basis: 100%;
	}
    .iconGroup .icon .fa-location-dot{
        margin: 0; 
    }
    
}
@media(max-width: 900px){
	.container .row{
		flex-wrap: wrap;
	}
	.row section.left, .row section.right{
		flex-basis: 100%;
		margin: 0px;
	}
}
/* for responcive */

@media (max-width: 768px) {
    .nav{
       height: 24vh;
    flex-direction: row;
        display: flex;
    align-items: center;
    justify-content: space-evenly;
 }

    .page0{
        height: 20vh;
        width: 100vw;
        background-color: #333333;
    }
.page0 .sc1{
    height: 10vh;
    padding: 0;
    margin: 0;
}
    .page0 .sc1 .img img{
        height: 10vw;
        width: auto;
        padding: 0;
        margin: 0;
    }
    .page0 .sc2{
        height: 100%;
        text-align: center;
        
    }
    .pd{
     
       flex-direction: column;
      

    }
  .page6 {
    margin-top: 10vh;
}
.page7{
    margin-top: 10vh;
}
.page9{
    height: 18vh;
    width: 100vw;
 
    }
   .page9 .redbox{
    width: 100vw;
    height: auto;
   }

    .footer{

     flex-direction: column;    
      display: flex;
      align-items: center;
      height: 30vh;
      justify-content: center;
    }
    .footerleft{
        height: 50%;
        width: 100%;
        /* background-color: rgba(1
        66, 136, 227, 0.421); */
        text-align: center;
       
    }
    .footerleft .ptag{
        padding-top: 2.4vh;
        font-size: 10px;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
    }
    .footerleft .ptag a{
        
        text-decoration: none;
        color: #fff;
    }
    .footerright{
        height: 50%;
        width: 100%;
        padding: 0 20px;
        /* background-color: rgba(166, 136,  227, 0.421); */
        text-align: center;
    }
    .footerright .ptag i{
        font-size: 20px;
        color: #fff;
       padding: 20px;
    }
    
    /* -------productpage------ */
    .pp2{
        display: flex;
        align-items: center;
        justify-content: center;
    flex-direction: column;
    }
   .pp3{
    display: flex;
    align-items: center;
    justify-content: center;
   padding: 10px;
   height: 7vh;
   }
   .pp1 .page-video{
    width: 100%;
    
}
.pp01{
    margin-top: -20px;
}
   .pp03{

    height: 5vh;
font-size: 4vh; 
padding: 10px;
height: 7vh;
    
   }
   .pp2{
    margin-top: 10px;
   }
   .pp2 .card{
   margin-bottom: 10vh;

   }
   .brands{
   width: 100vw;
   height: 7vh;
   
   }
   .pp03 h2{
    height: 3vh;
    text-align: center;
    margin-bottom: 40px;
   }
   .brands img{
    height: auto;
    width: 80%;
    overflow: hidden;
   }
   /* television */
   .tvp0{
    flex-direction: column;
   }
   .tvp01{
    flex-direction: column;
   }
   .tvp02{
    flex-direction: column;
   }
   .tvp03{
    flex-direction: column;
   }
   .tvp04{
    flex-direction: column;
   }
   .tvp05{
    flex-direction: column;
   }
   .tvp06{
    flex-direction: column;
   }
  /* vu television */
  
 /* ---electroncis--- */
 .elp01{
    flex-direction: column;
 }
 .elp02{
    flex-direction: column;
 }

 .eip1{
    height: 660vh;
    width: 100vw;
    color: #222;
    background-color: rgba(226, 223, 191, 0.376);
}
 .ep1{

    height: 100vh;
    width: 100vw;
   
   flex-direction: column;
   overflow: hidden;
    justify-content:center;
    align-items: center;
 }
 .left{
    height: 20%;
    width: 100%;

 }
 .left img{
    /* margin-top: 5vh; */
    height: 50%;
    width: auto;
background-size: cover;
 }
 .right{
    /* margin-top: 2vh; */
    height:100%;
    width: 100%;
    font-size: 1px;
 }
 .right h5{
    font-size: 2vh;
    text-align: center;
 }
 .right p{
     font-size: 6px;
 }
/* 32inch acer  */

.acp2{
 height: 70vh;
    width: 100vw;
    display: flex;
   
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
}
.acp02{
    height: 100%;
    width: 0;
}
.acp002{
    height: 100%;
    width: 100%;
}

.textov{
    margin: 20px;

    height: 100%;
    width: 93%;

}
.texts {
    margin: 20px 0;


    
}   
.texts p{
    font-size: 9px;
    margin-bottom: 0;
}
.slid1{
    height: 20vh;
    width: 100vw;
    
}
.table{
  flex-direction: column;
}
.td1{
    margin: 30px;
    width: 89vw;
    }

.td1 th{
    font-size: 20px;
}   
.td1 tbody .sp{
    border: 5px solid #fff; 
    border-radius: 40px;
    background-color: #00000011;
}
.warr .alink a {
   
    font-size: 12px;
    border: 2px solid #da0404;
    height: 25px;
    width: 25px;
    margin: 3px;
    text-decoration: none; /* Remove underline from links */
    color: #000; /* Change link color if needed */
  }
  
.container{
	width: 100vw;
	min-height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
    background-color: #fff;
	padding: 30px 8%;
}
.container .row{
	display: flex;
	justify-content:center;
	width: 70vw;
	max-width: 1100px;
}
.beforcont{
    height: 90vh;
}
}

@media (max-width:1308px) {
    .footer{
margin-top: 80px;

    }
    .warr{
        padding-bottom: 90px;
    }
}


}
@media (max-width:400px) {
    .footer{
   margin: 0;
    }}
