/*responsive*/
@media only screen and (min-width:200px) and (max-width:800px){
	body{
	margin:2px;
	padding:1px;
	}
  /*loader*/
  .preloader{
    z-index: 999;
  }
  .preloader-container{
    width:100%;
  }
  .rings{
    width:150px;
    height:150px;
    top:300px;
  }
  .rings:nth-child(1){
    top:-10px;
  }
  .rings:nth-child(1)::before{
    left:20px;
    top:-15px;
  }
  .rings:nth-child(2)::before{
    left:20px;
    top:-15px;
  }
  .rings:nth-child(3)::before{
    left:100px;
    top:-10px;
  }
  /*logo area*/
  .header{
      display:flex;
      width:100%;
      height:130px;
      margin-top: 2px;
  }
  .logo-area{
    width:120px;
    height:120px;
  }
  /*menu area*/
  .menu-area{
    position:absolute;
    width:0;
    height:330px;
    z-index: 999;
    background: rgba(191, 64, 191,0.9);
    top:130px;
    display:none;
  }
  .menu-area.active{
    display:block;
    transition: 1s;
    width:100%;
  }
  ol.main-menu{
    margin-top:0;
    margin-left:0;
  }
  ol.main-menu>li{
    display:block;
  }
  .login_container{
    margin-left: 15px;
  }
  /*login form*/
  .login_form{
    width:96%;
    left:3%;
  }
  .field-head{
    width:20;
    font-size:17px;
  }
  /*mobile menu toggle*/
  .bars{
    position:relative;
    padding: 5px;
    width:100px;
    text-align: center;
    justify-content: center;
    align-items: center;
    transition: 0.5s;
    position:absolute;
    right:0;
    top:20px;
  }
  .bar{
    width:80px;
    height:15px;
    background:black;
    margin-top:5px;
    transition: 0.5s;
  }
  .bars.active .bar:nth-child(1){
    transform:rotate(45deg) translate(25px);
  }
  .bars.active .bar:nth-child(3){
    transform:rotate(-45deg) translateX(30px);
  }
  .bars.active .bar:nth-child(2){
    opacity: 0;
  }
  /*banner*/
  .banner{
    width:100%;
    height:280px;
    position:relative;
  }
  .banner-items{
    width:450%;
    height:100%;
  }
  .banner-content{
    width:100%;
    height:100%;
  }
  .banner-content>img{
    width:100%;
    height:100%;
  }
  .manual-btns,.auto-btns{
    transform: rotate(90deg);
    top:30px;
    right:-30px;
  }
  .m-crt,.a-crt{
    width:25px;
    height:25px;
  }
  .radio1:checked ~ #first{
    margin-left:0;
  }
  .radio2:checked ~ #first{
    margin-left:-50%;
  }
  .radio3:checked ~ #first{
    margin-left:-100%;
  }
  .radio4:checked ~ #first{
    margin-left:-340%;
  }
  /*banner overlay content*/
  .banner-item-content{
    width:98%;
    height:100%;
    top:0;
	position:absolute;
  }
  .banner-overlay-content{
    top:-150px;
  }
  .banner-overlay-content>h3{
    font-size:27px;
  }
  .banner-overlay-content>h4{
    font-size: 18px;
    margin-top:-18px;
  }
  .banner-overlay-content>p{
    font-size: 18px;
    margin-top: -19px;
  }

  /*shopping chart*/
  .chart-item-container{
    display:block;
  }
  .chart-item{
    width:100%;
    margin-top:6px;
    margin-left:0;
  }
	.chart-container>h3{
		font-size:28px;
	}
  /*gallery sample*/
.gallery-sample-container>h3{
    font-size: 30px;
  }
  .gallery-sample{
    display:flex;
    flex-wrap: wrap;
  }
  .sample-item{
    flex:25%;
  }
  .sample-item>img{
    width:200px;
    height:200px;
  }
  /*gallery*/
  .gallery-item{
    width:100%;
    flex:100%;
  }
  /*orders*/
  .order-container{
    width:100%;
  }
  .order-container form{
    width:100%;
  }
  .order-container form>input[type="text"],
  .order-container form>input[type="email"],
  .order-container form>input[type="submit"],
  .order-container form>input[type="file"],
   .order-container form>select,
   .order-container form>textarea{
     width:100%;
   }
   /*footer*/
  .talk-to-us {
   display:block;
  }
  .subscibe{
    width:100%;
    margin-left:0;
  }
  #subscibe_btn{
    font-size: 20px;
  }
}
