.products {
  position: relative;
  width: 100%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}
.image-p{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 15px;

}
.a-p{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.a-p > div{
padding: 10px;
}
@media only screen and (max-width:600px){
  .a-p > div > .shad{
    margin: 15px;
  }
}
.overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color:#87BC24;
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .5s ease;
}

.products:hover .overlay {
  height: 100%;
}

.text {
  font-size: 17px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
@media only screen and (min-width: 401px){
  .overlay-mobile{
    display: none;
  }
}
@media only screen and (max-width: 400px){
  .overlay-mobile {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color:#aeb4a878;
    border-radius:15px;
    overflow: hidden;
    width: 100%;
    height: 100%;
    text-align: center !important;
    transition: .5s ease;
  }
  .overlay{
    display: none !important;
  }
  .text-mobile{
    font-size: 17px;
    color: white;
  position: absolute;
  top: 55%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  }
  

}

.acer-p{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 10px;
  margin-top: 30px;
}
.acer-p > div{
  padding: 0px;
}
.acer-p > div > div{
  padding: 10px;
  margin-bottom: 2px;
}
.add{
    border: 1px solid #80808042;
    text-align: center;
    padding: 10px;
    border-radius: 10px;
}
.add >ul{
    list-style-type: none;
    font-size: 16px;
}
.add ul li i{
  color:#83b81a !important;
  font-weight: bold;
  font-size: 20px;
}
.m-50{
    margin: 50px;
}
@media only screen and (max-width:992px){
  .m-50{
    margin: 0px;
  }
}
.mt-20{
    margin: 20px 0px;
}
/* Laptop Products */

.h-text{
  font-size: 20px !important;
  margin-top: 20px !important;
}
.green{
  color: #83b81a;
}
.flex-areas{
  display: flex;
  flex-wrap: wrap;
}
@media only screen and (min-width: 765px){
.flex-areas{
  justify-content: space-around;
}
}
.flex-areas > ul >li a{
  color: #555;
}
.flex-areas > ul >li {
  padding: 15px 0px;
}
.ico-1{
  font-size: 16px;
  margin-right: 5px;
}
.b-text{
  font-size: 18px !important;
}
/* HOME */

image-1{
  width: 100%;
  margin: 10px 0px;
  height: auto;
}
.mar{
  margin: 10px 0px;
}
.overlay-1 {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color:#dee0d954;
  overflow: hidden;
  width: 100%;
  height: 100%;
  transition: .5s ease;
}
.overlay-1:hover{
  background-color: #dee0d9c2;
}

.text-2 {
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.bo{
  font-weight: bold !important;
  font-size: 1.1rem;
  }
  .shad{
    padding: 10px;
    border: 1px solid rgb(212 208 208 / 36%)
  }
  .noc{
    text-align: none !important;
  }
  .shad > h3{
    font-size: 18px;
    text-align: center;
  }
  .shad > h4{
    font-size: 16px;
    font-weight: bold;
  }
  .shad > ul{
    list-style-type: initial;
    padding-left: 20px;
  }
  .image-g{
    width: 100%;
    height: auto;
    margin-bottom: 8px;
  }
  .shop{
    color: #83b81a;
font-size: 16px;
transition: 0.5s ease;
  }
  .shop:hover{
    margin-right: 10px;
  }
  .b-c{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .img{
    border-radius: 10px !important;
  }
 
  .img-gal{
    display: flex;
flex-wrap: wrap;
  }
 .img-acer{
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
 }
  .img-laptop{
    border-radius: 10px;
    width: 100%;
    margin: 10px 0px;
    transition: 1s;
  }
  /* .image-gallery > div{
    padding-left: 10px !important;
    padding-right: 10px !important; */
  }
  .img-container{    
    width: 100%;
    transition: 1s;
  }
  .img-container:hover .text-1{
    display: block;
    color: black;
  }
  .img-container:hover .img-laptop{
    opacity: .5;
  }
  .text-1 {
    display: none;
    font-size: 18px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
  }
  @media only screen and (max-width: 400px){
    .img-laptop{
      opacity: .7;
    }
    .text-1 {
      display: block;
      font-size: 18px;
      color: black;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      text-align: center;
    }
  }
  .acer_laptop_collection{
    margin: 20px 0px;
  }
  @media only screen and (max-width: 768px){
    .col-xs-6{
      width: 50%;
    }
    .bo{
      font-size: 1rem;
    }
  }
  .img-offer{
    width: 100%;
    height: auto;
    margin-bottom: 10px;
    border-radius: 10px;
  }
  .new{
    font-size: 25px;
    color: #83b81a;
  }
  .a-con{
    padding: 5px 10px;
    margin: 10px 0px;
    background-color: white;
  }
  .flex-offer{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
  }
  .flex-list-search{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .flex-list-search > li{
    background-color: white; 
    padding: 6px;
    box-shadow: 0px 3px 0px 0px #f0f2f4;   
    margin: 10px;
  }
  .d-need > img{
    width: 100%;
    height: auto;
    border-radius: 8px 8px 0px 0px;
  }
  .d-need > h3{
    font-size: 20px;
    margin: 10px 10px;
    color: #87bc24;
  }
  .d-need{
    padding: 0px 0px 10px 0px;
    border-radius: 8px 8px 0px 0px;
    background-color: white;
    margin-bottom: 10px;
  }
  .d-need > p{
    margin: 10px 10px 20px 10px;
    font-size: 15px;
  }
  .d-need > a{
    padding: 5px 10px;
    margin: 10px;
    font-size: 14px;
    background-color: #87BC24;
    color: white;
    transition: 1s;
  }
  .d-need > a:hover{
    background-color: #87bc24ba;
    margin-left: 20px;
  }
  .needs{
    margin-top: 20px;
  }
  .needs > h2{
    font-size: 28px;
  }
  .addr{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 40px 0px;
  }
  .addr div h3{
    font-size: 30px;
  }
  .mall{
    margin: 40px 0px;
  }
  .mall div h3{
    font-size: 30px;
  }
  .box_detail{
    border: none;
    background-color: none !important;
  }
  .box{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-color: #f7b1b1;
    padding: 5px;
  }
  .box > div > img{
    width: 100%;
    height: auto;
  }
  .box > div > h4{
    font-size: 22px;
    color: #121921;
  }
  .sea{
    display: flex;
    flex-wrap: wrap;
  }
  .sea > li{
    margin: 6px;
    padding: 5px 8px;
    background-color: #feeeef;
    border-radius: 15px;
    box-shadow: 0 8px 6px -6px #f09c9e;
  }
  .whi{
    color: white;
  }
  .sea > li > a{
    color: #efc1c6;
  }
  .m-30{
    margin: 20px 0px;
  }
  .mb-50{
    margin: 50px 0px;
  }
  .ce{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .loc-green{
    color: green;
    font-size: 30px;
  }
  .flex-why{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  @media only screen and (min-width: 600px){
    .flex-why{
      flex-direction: row-reverse;
    }
  }
  .flex-why > div > h2{
    color: #f45d64;
  }
  .flex-why > div > img{
    width: 100%;
  }
  .flex-why > div > ul > li{
    font-weight: 600;
  }
  .flex-why > div > ul > li > img{
    width: 30px;
  }
  .flex-2{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .flex-2 > div{
    display: flex;
  }
  .img-1{
    width: 100%;    
  }
  .flex-laptop{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 40px;
  }
  .flex-laptop div h1{
    font-size: 45px !important;
  }
  .flex-coll div:hover{
    background-color: #ffffff40;
    border-radius: 10px;
  }
  .flex-coll div{
    margin-bottom: 20px;
    transition: .6s ease;
  }
  .flex-coll div img{
    width: 100%;
  }
  .flex-coll div h3{    
    font-weight: 400;
    font-size: 1.5rem;
  }
  .flex-coll div h3 a{
    color: #333 !important;
  }
  .flex-coll div:hover a{
    color: #87bc24 !important;;
  }
  .mb-20{
    margin-bottom: 20px;
  }
  .flex-coll{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .series{    
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  .series div img {
    width: 90%;
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%);
    border-radius: 10px;
  }
  .series div h2{
font-size: 45px;
  }
  .series div p{
    text-align: justify;
    line-height: 1.8;
  }
  .swift{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .swift div img{
    width: 100%;
    transition: 1s ease;
  }
  .swift div h3{
    font-size: 22px;
    text-align: center;
    margin-top: 10px;
  }
  .swift div h4{
    font-size: 18px;
  }
  .swift div ul{
    color: #555;
    font-size: 15px;
    padding-left: 20px;
  }
  .swift div{
    margin-bottom: 20px;
  }
  .swift div:hover img{
    transform: scale(1.1,1.1);
  }
  .buy{
    margin-bottom: 10px;
    color: black;
  }
  .swift div:hover .buy{
    color:#87BC24;
  }
  .c-2{
    margin-bottom: 30px;
  }
  .c-2 h2{
    text-align: center;
    margin: 30px 0px;
  }
  @media only screen and (max-width: 650px){
    .buy{
      color:#87BC24;
    }
    .img-1{
      margin-bottom: 30px;
    }
  }
  .m-20{
    margin: 20px 0px;
  }
  .center-1{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .crumb{
    margin-bottom: 40px;
  }
  .crumb li{
    display: inline !important;
  }
  .crumb li i{
    font-size: 10px;
  }
  .crumb li span{
    font-size: 14px;
  }
  .visit-us > div{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  .visit-us div img{
    width: 90%;
  }
  .visit-us div h3{
    font-size: 28px;
  }
  .b-c{
		display: flex;
		flex-wrap: wrap;
		flex-direction: row-reverse;
		align-items: center;
		margin: 10px 0px;
	}
	.b-c > li{
		padding: 0px 5px;
	}
	.b-c li .active{
		color: black;
	}
  .flex-near{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  .flex-near div .call{
    padding: 6px 10px;
    border: 2px solid #83B81A;
    background-color: #83B81A;
    border-radius: 5px;
    font-size: 15px;
    color: white;
  }
  .flex-near div .call:hover{    
    background-color: white;
    color: #83B81A;
  }
  .flex-near div img{
    margin: 10px 0px;
  }
  .mtb-30{
    margin: 30px 0px;
  }
  .cent{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

  }
  .cent div{
    text-align: center;
  }
  .cent div h3{
    font-size: 22px;
    color: #83B81A;
  }
  .feat{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  .feat div ul li i{
    font-weight: bold;
    font-size: 30px;
    margin-right: 5px;
  }
  .feat div ul li{
    margin: 10px 0px;
  }
  .call-2{
    padding: 6px 10px;
    border: 2px solid #83B81A;
    background-color: #83B81A;
    border-radius: 5px;
    font-size: 15px;
    color: white;
  }
  .call-2:hover{    
    background-color: white;
    color: #83B81A;
  }
  .call-2 i{
    font-weight: bold;
  }
  .fs-5{
    font-size: 18px;
    text-align: justify;
    margin-top: 10px;
  }
  .aspire div ul{
font-size: 14px;
  }
.price{
  background: #dedddd70;
  color: #83b81a;
  font-weight: bold;
  font-size: 16px;
  padding: 5px 0px;
  text-align: center;
  margin: 5px 0px;
}
.price span{
  font-weight: 400;
  font-size: 12px;
  display: block;
}
.buy-now{
  text-align: center;
  margin-top: 20px;
}
.buy-now a{  
  padding: 3px 5px;
  border: 2px solid #87BC24;
  border-radius: 6px;
  font-size: 15px;
}
.offers{
  border: 2px solid #87BC24;
  padding: 5px;
  border-radius: 5px;
}
.offers li{
  font-size: 12px;
}
.offers li i{
  font-size: 15px;
}
.buy-now a:hover{
  background-color: #87BC24;
  color: white;
}
.mtb-20{
margin: 20px 0px;
}
.img-container{
  position: relative;
  text-align: center;
}
.text-img{
  position: absolute;
  top: 1%;
  right: 15%;
}
@media only screen and (max-width: 360px){
  .text-img{
    top: 2%;
    right: 21%;
  }
}
.were span{
  display: block;
  font-size: 30px;
  margin-top: 10px;
  color: #87BC24;
}
.were{
  font-size: 25px;
  text-align: center;
}
.where{
  background-color: #ffffff;
  margin: 15px 0px;
  padding: 6px;
  border-radius: 6px;
}
.where img{
  width: 150px;
}
.locate{  
  padding: 3px 5px;
  background-color: #87BC24;
  color: white;
  border: 2px solid #87BC24;
  border-radius: 6px;
  font-size: 15px;
  margin-bottom: 10px;
}
.locate:hover{
background-color: white;
color: #87BC24;
}
.hd{
  font-size: 18px;
  display: block;
}
.dw{
  font-size: 30px;
  font-weight: bold;
}
.dw span{
  font-weight: 400;
  font-size: 20px;
}
.mod{
  font-size: 25px;
}
.mod span{
  border-bottom: 1px solid grey;
}
.models{
  border-bottom:  2px solid #87BC24;
}
.models i{
  font-size: 10px;
}
.not a{
  color: grey;
  font-size: 14px;
}
	
.price-s{
  text-align: center !important;
  padding: 6px 0px;
  border: 2px solid #87BC24 !important;
  border-radius: 6px;
  font-weight: 600;
  margin: 10px 0px;
}
.price-s span{
	font-size: 12px;
}
.mt-50{
  margin-top: 50px;
}
.fs-2{
  font-size: 20px;
  line-height: 1.7;
  color: #87BC24;
}
.pl-30{
  padding-top: 50px;
}
.free{
  padding: 5px;
  border: 2px solid #87BC24;
  border-radius: 6px;
}
.fs-3{
  font-size: 30px;
  margin: 30px 0px 20px 0px;
}
.fs-3 span{  
  border-bottom: 1px solid gray;
}
.fs-4{
  font-size: 20px;
}
.fs-5{
  font-size: 16px;
  text-decoration: underline;
}
table th{
  font-size: 25px;
  padding: 15px 0px;
}
table td:nth-child(1){
  border-right: 1px solid gray;
  color: grey;
}

table td:nth-child(2){
  font-weight: 600;
}
table td{
  padding: 10px 10px;
}
@media only screen and (max-width: 500px){
  th{
    text-align: center;
  }
  table td {
    display: block;
    text-align: center;
  }
  table td:nth-child(1){
    border-right: none;
  }
  .specs{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
}
.acer-contact h4{
  color: #87BC24;
  text-align: center;
  font-size: 25px;
}
.acer-contact{  
  margin: 30px 0px;
  text-align: center;
}
.acer-contact p span{
  color: #87BC24;
}
.off ul{
  background-color: #87BC24;
  border-radius: 6px;
  font-size: 15px;
  padding: 15px;
}
.off ul li{
  padding: 5px 0px;
  color: white;
}
.mrp span{
  font-size: 15px;
}
.mrp span span{
  font-size: 20px;
  font-weight: 600;
}
.mrp span:nth-child(2){
  text-decoration: line-through;
}
.p-10{
  padding: 10px;
}
.text-end{
  float: right;  
}
.fs-5 i{
  font-weight: bold;
  font-size: 25px;
}
.delivery{
  left: -20%;
  visibility: hidden;
  top: 50%;
position: fixed;
  transform:rotate(90deg)
}
.show{
  visibility: visible !important;
}
.delivery .call{
  padding: 6px 10px;
    border: 2px solid #83B81A;
    background-color: #83B81A;
    border-radius: 5px;
    font-size: 15px;
    color: white;
}