/* INSTABIO.css */
/*-------------------------------------------------------------------------------------------------------------------------------*/
/*This is Instagram bio page CSS file that contains custom style rules used in this template*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Template Name: RAYATARH.*/
/* Version: 1.0 Initial Release*/
/* Author: Rayatarh.*/
/* Website: http://www.RayaTarh.com */
/* Copyright: (C) 2020 */
/*-------------------------------------------------------------------------------------------------------------------------------*/

@import url(../fonts/Font-awesome-4-6/css/font-awesome.min.css) screen;
@font-face {
  font-family: 'iransans';
  src: url("../fonts/IRANSansWeb(FaNum)_Light.eot?#") format("eot"), url("../fonts/IRANSansWeb(FaNum)_Light.woff") format("woff"), url("../fonts/IRANSansWeb(FaNum)_Light.woff2") format("woff2"), url("../fonts/IRANSansWeb(FaNum)_Light.ttf") format("truetype");
}
body {
  margin: 0;
  background: #fff;
  font-size: 14px;
  font-family: iransans;
  color: #000;
  padding: 0;
  height: 100%;
}
.search input::-webkit-input-placeholder{color:#000;font-weight:300;text-transform:none}
.search input:-ms-input-placeholder{color:#000;font-weight:300;text-transform:none}
.search input::-ms-input-placeholder{color:#000;font-weight:300;text-transform:none}
.search input::placeholder{color:#000;font-weight:300;text-transform:none}

.top-row {
	height: 40px;
	border-bottom: 1px solid #f0f0f0;
	padding-top: 5px;
}
.logo {
	text-align: left;
}
.menu .icon {
	float: right;
	margin-top: 15px;
}
#filter {
	position: relative;
    margin-top: 15px;
    margin-bottom: 30px;
    padding-bottom: 30px;
    background: url(../images/divider.png) no-repeat bottom center;
}
#removefilter {
	text-align: center;
}
#removefilter strong {
    font-size: 15px;
    color: #FFF;
}
#removefilter span {
    cursor: pointer;
    padding-right: 20px;
    padding: 5px 10px;
    background: #5fbb57;
    border-radius: 7px;
    color: #000;
    font-size: 12px;
}
#removefilter span i {
    vertical-align: middle;
    color: #FFF
}
.menu .icon span {background: #000}
.menu a {color: #000}
.menu a:hover {color: #9e0084}
.hamburger-bottom-bread, .hamburger-patty, .hamburger-top-bread { height: 2px; }
.hamburger-bottom-bread, .hamburger-patty, .hamburger-top-bread { display: block; width: 30px; background-color: #333; }
.hamburger-top-bread {margin-top: -8px;}
.hamburger-patty {margin-top: 7px;}
.hamburger-bottom-bread { margin-top: 6px; }
/*---------------------  SLIDE MENU SECTION  ---------------------*/

.slide-menu-section {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  right: 0;
  background: rgba(0,0,0,0.8);
  z-index: 10;
  width: 0;
}
.slide-menu-section.open {width: 100%;}
.slide-menu {
  width: 271px;
  background: #FFF;
  height: 100vh;
  position: absolute;
  right: -400px;
  transition: all 0.4s;
}
.slide-menu .desc {
  padding: 5px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  color: #FFF;
  padding-bottom: 32px;
  background: url(../images/insta-menu-bg.png) no-repeat right -80px;
}
.slide-menu.open {right: 0; transition: all 0.4s;}
.close-btn {
  background: #FFF;
  border-radius: 50%;
  cursor: pointer;
  color: #7c7d80;
  height: 50px;
  width: 50px;
  text-align: center;
  font-size: 22px;
  padding: 0!important;
  transition: all .2s;
  position: absolute;
  top: 15px;
  left: -24px;
  box-shadow: 0 20px 40px 0 rgba(0,0,0,.15);
  line-height: 50px;
}
.close-btn:hover {color: #222}
.slide-menu ul {list-style: none}
.slide-menu ul li {font-size: 16px; cursor: pointer; position: relative;}
.slide-menu ul li a {color: #000}
.slide-menu ul li a:hover {color: #0521ca}
.slide-menu ul li:before {
    content: "";
    position: absolute;
    top: 16px;
    right: -17px;
    width: 10px;
    height: 2px;
    background: #0521ca;
}
.search {
	padding-top: 15px;
	text-align: center;
}
.search input {
    width: 250px;
    border-radius: 30px;
    border: 2px solid #ccc;
    padding-right: 10px;
    height: 40px;
    outline: none;
}

.products .item {
	text-align: center;
	margin-bottom: 40px;
	border-left: 1px dashed #e0e0e0;
}
.products .item:nth-child(even) {
	border-left: none;
}
.products .item img {
  width: 200px;
	max-width: 100%;
	height: auto;
}
.buylink {
	margin-top: 15px;
}
.buylink a {
    padding: 2px 5px;
    background: #fa4641;
    color: #FFF;
    border-radius: 5px;
}

#back-top {
  position: fixed;
  bottom: 20px;
  left: 20px;
}
#back-top a {
  display: block;
  text-align: center;
  color: #fff;
  -webkit-transition: 1s;
  -moz-transition: 1s;
  transition: 1s;
}

#back-top span {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 48px;
  line-height: 40px;
  background: rgba(95, 187, 87, .5);
  -webkit-transition: 1s;
  -moz-transition: 1s;
  transition: 1s;
}
#back-top a:hover span {
  background: rgba(95, 187, 87, .9);
}


table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}



@media screen and (max-width: 330px) {
	.buylink a {
		font-size: 12px
	}
}