/*
Theme Name: Armo Theme
Text Domain: ARmoTheme
Version: 1.0
Requires at least: 4.7
Requires PHP: 5.2.4
Description: description
Tags:  
Author: Armo
Author URI: https://fara-download.ir
License: GNU General Public License v2 or later


*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------

	0. 	CSS Reset
	1. 	Document Setup
	2. 	Element Base
	3. 	Helper Classes
	4. 	Site Header
	5. 	Menu Modal
	6. 	Search Modal
	7. 	Page Templates
		a. 	Template: Cover Template
		c. 	Template: Full Width
	8.  Post: Archive
	9.  Post: Single
	10. Blocks
	11. Entry Content
	12. Comments
	13. Site Pagination
	14. Error 404
	15. Widgets
	16. Site Footer
	17. Media Queries

----------------------------------------------------------------------------- */

/*----------------------------------Fonts------------------------------------- */

@font-face {
	font-family: iranyekan;
	font-style: normal;
	font-weight: 300;
	src: url('fonts/yekan/eot/iranyekanweblightfanum.eot');
	src: url('fonts/yekan/eot/iranyekanweblightfanum.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('fonts/yekan/woff/iranyekanweblightfanum.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('fonts/yekan/ttf/iranyekanweblightfanum.ttf') format('truetype');
}

@font-face {
	font-family: iranyekan;
	font-style: normal;
	font-weight: normal;
	src: url('fonts/yekan/eot/iranyekanwebregularfanum.eot');
	src: url('fonts/yekan/eot/iranyekanwebregularfanum.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('fonts/yekan/woff/iranyekanwebregularfanum.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('fonts/yekan/ttf/iranyekanwebregularfanum.ttf') format('truetype');
}

:root {

	--bgcolor: rgb(255, 255, 255);
	--bgcolor1: rgb(244, 243, 243);
	--bgcolor2: rgb(224, 222, 222);
	--bgcolor3: rgb(206, 204, 204);

	--textcolor: rgb(24, 24, 24);
	--textcolor1: rgb(56, 56, 56);
	--textcolor2: rgb(77, 77, 77);
	--second_textcolor1:rgb(244, 243, 243);
	--second_textcolor2:rgb(255, 241, 89);

	--color1: rgb(48, 48, 48);
	--color2: rgb(139, 139, 139);

	--second_color:#00263D;
	

	--third_color:#1b1a1a;



	--mediasvgcolor:rgb(56, 56, 56);

	--header-height: 80px;
	--maxwidth: 1000px;
	--sidebar1-width: 250px;
	--content-width: 730px;
	--itemgapwidth: 10px;

	--btncolor1 :rgb(14, 124, 250);;
	--btncolor1_2 :rgb(11, 94, 189);;

	--fontsize:12px;
	--fontsize1:14px;
	--fontsize2:16px;
	--fontsize3:18px;
	--fontsize4:20px;
  }


  body{
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: var(--bgcolor2);;
  }

/*----------------------------------header------------------------------------- */

.top-header{
	height: var(--header-height);
	width: 100%;
	position: fixed;
	z-index: 999;
	right: 0px;
	display: flex;
	justify-content: center;
	background-color: var(--second_color);
	
	border-bottom: 1px solid var(--bgcolor2);
}

.header-container{
	width: var(--maxwidth);
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background-color: var(--second_color);;

}
.header-start {
	display: flex;
	flex-direction: row;
	width: 100%;
	}
.header-info{
	display: flex;
	flex-direction: row;
	align-items: center;
}
.header-center{
	display: flex;
	flex-direction: row;
	align-items: center;
	
}
.header-end{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
}

.logo-container {
	display: block ruby;
	}

.site-link{
	color: var(--second_textcolor1);
	font-size: 22px;
	padding: 0px 10px;
	
	border-radius: 8px;
}
.site-link:hover{
	color:white;
	background-color:#1e83f0;	
}

.search-header-item{
	width:100%;
}

.search-container{
	width:100%;
	height: 40px;
}

.search-field{
	width:100%;
	background-color: #e3e3e3;
	border: 1px solid #aaa7;
	height: 100%;
	padding: 5px;
}
.search-submit{
	border: 1px solid #aaa7;
	background-color: var(--bgcolor2);
	border-radius: 5px 0px 0px 5px;
	height: 100%;
	color: var(--textcolor);
	padding: 5px;
}
.search-submit:hover{
	background-color: var(--bgcolor1);
}

.search-select{
	background-color: #e3e3e3;
	border: 1px solid #aaa7;
	border-radius: 0px 5px 5px 0px;
	border-left: none;
	padding: 5px;
	height: 100%;
}
.search-form{
	width:100%;
	display: inline-flex;
	align-items: center;
	height:100%;
}

div.header-menu-class{
	width:100%;
}
div.header-menu-class ul{
	list-style: none;
	padding: 2px;
}
div.header-menu-class ul li{
	display: inline;
}
div.header-menu-class ul li a{
	color: #000;
}
div.header-menu-class ul li a:hover{
	color: #fff;
}

.extra-head-btn-container{
	margin-left: 20px !important;
	display: inline-flex;
}
.desktop-head-extra-btns{
	display: inline-flex;
}

.header-items{
	margin: 1px 4px;
}

.mobile-nav-menu{
	position: absolute;
	width: 400px;
	height: 100%;
	background-color: #252525;
	color: white;
	z-index: 999;
	line-height: 35px;
}

div.mobile-nav-menu ul li a{
	color: #fff;
	margin: 8px;
}
div.mobile-nav-menu ul li a:hover{
	color: #eee;
}

/*---------------------------------- search template ------------------------------------- */

.toggle_search_container{
	
	height: var(--header-height);
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	padding: 0 10px;
	width: var(--maxwidth);
    background-color: var(--second_color);
    margin-top: var(--header-height);
    transition: all 200ms ease-in-out;
    visibility: hidden;
    opacity: 0;
    position: fixed;
    z-index: 1;
}
.toggle_search_container.open{
    visibility: visible;
    opacity: 1;
}
.toggle_search_lay{
	width: 800px;
}

/*---------------------------------- body ------------------------------------- */
.main_container{
	position: relative;
	width: 100%;
	max-width: var(--maxwidth);
	height: 100%;
	box-sizing: border-box;
	top:  var(--header-height) ;
	display: flex;
	justify-content: center;
	padding: 15px 0 10px 0;
	flex-wrap: wrap;
	column-gap: 10px;

}
.sections_container{
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	max-width: var(--maxwidth);

}


/*--------------------------- sections ------------------------------------- */
.arth-d-noimg{
	background-color:var(--color2);
	height: 100%;
	display: flex;
	padding: 10px;
	align-items: center;
	box-sizing: border-box;
	width: 100%;
justify-content: center;
}



/*--------------------------- single pages ------------------------------------- */
.single-container{
	width: 100%;
	box-sizing: border-box;
	display: flex;
	max-width: var(--maxwidth);
	flex-direction: column;
	justify-content: space-between;
	background-color: var(--bgcolor);
	padding: 0px 10px;
	border-radius: 10px;
	margin-bottom: 10px;
	
	
}
.content-container{
	position: relative;
	display: flex;
	box-sizing: border-box;
	height: 100%;
	padding: 10px;
	flex-direction: column;
	width: 100%;
	background-color: var(--bgcolor);;


}

.arth-d-singhd{
	display: flex;
	width: 100%;
	box-sizing: border-box;
	justify-content: flex-start;
	padding: 20px;
	align-items: stretch;
	background-color: var(--bgcolor1);
	border-radius: 10px;
	margin: 10px 0;
}

.arth-d-singgal{
	width: 400px;
	height: 400px;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	overflow: hidden;
	background-color: var(--bgcolor1);
	border-radius: 10px;
}
.arth-im-singim{
	max-height: 100%;
	max-width: 100%;
	border-radius: 0px;
}
.arth-d-singt{
	width: calc(100% - 400px);
	padding: 0 20px;
	display: flex;
	flex-direction: column;
}

.arth-d-singcnt{
	width: 100%;
	box-sizing: border-box;
	font-size: var(--fontsize3);
	overflow: auto;
	background-color: var(--bgcolor1);
    border-radius: 10px;
    padding: 5px 10px;
    border: 1px solid var(--bgcolor2);
	line-height: 2.1;
}
.arth-d-medias-cnt,.arth-d-desc-cnt,.arth-d-singcomments{
	background-color: var(--bgcolor1);
	border-radius: 10px;
	margin: 10px 0;
	padding: 20px;
}
.arth-d-medias-cnt{
	margin: 10px 0 20px 0;
}
.arth-s-desc-title{
	display: block;
	font-size: var(--fontsize4);
}
.arth-d-title{
	display: flex;
	box-sizing: border-box;
	padding: 0 10px;
	display: flex;
	flex-direction: column;
}
.arth-h1-pt {
	margin: 10px 0;
	max-width: 100%;
	overflow: hidden;
	font-size: 22px;
line-height: 1.7;
font-weight: 700;
	/* white-space: nowrap; */
	/* text-overflow: ellipsis; */
	}
.arth-h1-pt:hover{
	white-space: normal;
}
.arth-d-ptools{
	height: 100%;
	display: flex;
	padding:30px 0 20px 0;
}
.arth_d_toolscnt {
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	column-gap: 15px;
	}
.arth-d-toolcnt {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	}
.arth-s-toollogo {
	cursor: pointer;
	}
.arth-svg-tool{
	width:24px;height:24px;
	display: block;
}

.arth-path-tool{
	fill: var(--second_color);
}
.arth-s-tooldesc {
	font-size: var(--fontsize2);
	}
.arth-ul-logoamenu {
	position: absolute;
	background-color: var(--bgcolor1);
	display: none;
	flex-direction: column;
	row-gap: 5px;
	padding: 5px;
	margin: 0;
	}
.tool-share-logo:hover ul{
	display: flex;
}
.arth-li-logoamenu{
	display: flex;
	column-gap: 5px;
justify-content: center;
align-items: center;
}
.arth-a-logoamenu{
	padding: 2px;
	border-radius: 2px;
}
.arth-a-logoamenu:hover{
	background-color: var(--bgcolor);
	color: var(--textcolor1);
}
.arth-d-pmetascnt {
	display: flex;
	box-sizing: border-box;
	padding: 0 10px;
	flex-direction: column;
	row-gap: 20px;
	}
.arth-d-pmetacnt {
	display: flex;
	flex-direction: row;
	column-gap: 12px;
	align-items: center;
	}
.arth-d-pmetadetcnt ul{
	margin: 0px;
}
.arth-d-pmetadetcnt li{
	display: inline-block;
}
.arth-d-pmetadetcnt a{
	padding: 8px 12px 10px;
	border-radius: 6px;
	color: var(--second_color);
	background-color: var(--bgcolor2);
	display: inline-block;
    margin: 1px;
}
.arth-d-pmetadetcnt a:hover{
	background-color: var(--second_color);;
	color: var(--second_textcolor1);
}
.arth-svg-postmeta{
	width: 20px;
	height: 20px;
	}
.arth-d-pmetalogcnt {
	box-sizing: border-box;
	display: flex;
column-gap: 5px;
	}
.arth-d-pmetadetcnt{
	box-sizing: border-box;
	font-size: 12px !important;
	color :var(--textcolor1);
}
.arth-d-pmetadetcnt a{
	font-size: 12px !important;
}


/*--------------------------- content ------------------------------------- */
.arth-d-desccnttgl{
	overflow: hidden;
	height: auto;
	position: relative;
}
.arth-d-desc{
	overflow: hidden;
	height: auto;
	position: relative;
}

/*--------------------------- media ------------------------------------- */

.arth-medias-container{
	display: flex;
	justify-content: center;
	padding: 10px 0;
}
.arth-medias-container2{
	width: 100%;
	display: flex;
	flex-direction: row;
	column-gap: 12px;
	justify-content: center;
}
.arth-media-metas{
	width: 45px;
	flex: 0 0 32px;
	margin-top: 5px;
}
.arth-media-svg{
	width: 45px;
	height: 45px;
}
.arth-media-path{
	fill: var(--second_color);
}
.arth-media-info{
	display: flex;
	flex-direction: column;
	row-gap: 10px;
}
.armo-player-infocnt{
	
}

.armo-player-metatitle{
	display: inline-block;
	background-color: var(--second_color);
	color: var(--second_textcolor1);
	padding: 2px 5px;
	box-sizing: border-box;
	border-radius: 5px;
	min-width: 100px;
	text-align: center;
}
.armo-player-metatitle b{
	max-width: 100px;
	font-size: var(--fontsize2);
}
.armo-player-metadesc{
	width: 100%;
	padding-inline-start: 10px;
}
.arth-media-content{
	width: 100%;
	background-color: var(--bgcolor2);
	padding: 10px;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	row-gap: 10px;
}

.arth-media-play{
	width: 100%;
	text-align: center;
}

.arth-media-container{
	width: 100%;
	display: inline-block;
}
.arth-media{
	width: 100%;
	border-radius: 10px;
	background: var(--bgcolor2);
}
.fara-media-dlbtn{
	display: flex;
	background-color: var(--bgcolor3);
	color: var(--second_color);
	padding: 5px 10px;
	border-radius: 10px;
	justify-content: center;
	align-items: center;

}
.fara-media-dlbtn:hover{
	background-color: var(--second_color);
	color: var(--second_textcolor1);
}
.fara-media-dlbtn:hover path{
	fill: var(--second_textcolor1);
}
.armo-player-a-logo{
	width: 25px;
	padding: 2px;
	display: flex;
}
.armo-player-a-logo svg{
	width: 25px;
    height: 25px;
}
.armo-player-a-logo path{
	fill: var(--second_color);
}
.armo-player-a-text{
	width: 100%;
	text-align: center;
}
/*--------------------------- breadcrumb  ------------------------------------- */
.arth-breadcrumb {
	box-sizing: border-box;
	padding: 10px;
	font-size: 12px;
	color: var(--color2);
	}
	.arth-breadcrumb a{
		color: var(--color2) !important;
		padding: 2px 5px;
		border-radius: 5px;
	}
	.arth-breadcrumb a:hover{
		color: var(--second_textcolor1) !important;
		background-color: var(--second_color);
		padding: 2px 5px;
	}
	.breadlastitem{
		max-width: 200px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: inline-block;
	margin: 0;
	padding: 0;
	
	}


/*--------------------------- sidbar ------------------------------------- */
.sidbar1-width{
	width: var(--sidebar1-width);
}
.sidbar-container{

	box-sizing: border-box;
	
}
.sidbar-container ul{
	margin: 0px;
	padding: 0px;
}
aside{
	box-sizing: border-box;
	margin-bottom: 10px;
	border-radius: 10px;
	background-color: var(--bgcolor);
}
.arth-d-sidetcon{
	width: 100%;
	display: block;
	box-sizing: border-box;
	text-align: center;
}
.arth-d-sidetcon h4{
	display: inline-block;
	background-color: var(--second_color);
	color: var(--second_textcolor1);
	border-radius: 0px 0px 10px 10px;
	font-size: var(--fontsize3);
  	padding: 5px 10px;

}

aside > h4{
	margin: 0px;
}
aside ul{
	box-sizing: border-box;
	padding: 5px !important;
}
aside ul a{
	width: 100%;
	display: inline-block;
	padding: 5px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: inline-block;
	max-width: 100%;
}
aside ul a:hover{
	background-color: var(--bgcolor2);
	color: var(--textcolor1);
	border-radius: 5px;
}
/*--------------------------- Related ------------------------------------- */
.arth-d-singrelcat{
	width: 100%;
	padding: 10px 0;
}
.arth-ul-rel{
	display: inline-flex;
  	flex-wrap: wrap;
	  column-gap: 5px;
	  row-gap: 5px;
	  justify-content: space-between;
}
.arth-ul-rel-bs{
	display: flex;
	overflow: scroll;
	align-items: flex-start;
	flex-direction: row;
	column-gap: 25px;
	width: 100%;
 }
.arth-a-relgrid{
	width: calc(50% - 10px);
}
.arth-li-relgrid{
	display: flex;
	justify-content: flex-start;
	
	width: 100%;
	padding: 5px 0;
	column-gap: 16px;
}
.arth-img-rel{
	
	width: 100px;
	max-height: 200px;
}
.arth-s-rel{
	font-size: 14px;
	padding-top: 10px;
}

/*--------------------------- comments ------------------------------------- */


.comment-holder{
	box-sizing: border-box;
	padding: 10px 0;
	border-bottom: 1px solid var(--bgcolor2);
}
 
 .comment_text{
	 font-size: var(--fontsize2);
	 color:var(--textcolor1) ;
	 
 }
 li.comment{
	background-color: var(--bgcolor2);
	padding: 10px;
	border-radius: 10px;
	border: 1px solid var(--second_color);
	margin: 10px 0;
 }
 li.comment.odd{
	background-color: var(--bgcolor1);
 }
 .comment-avatar-cnt{
	display: inline-block;
	vertical-align: top;
	margin-inline-end: 10px;
 }
 .comment-avatar-cnt > span{
	width: 40px;
	height: 40px;
	font-size: var(--fontsize4);
	background-color: var(--second_color);
	color: var(--second_textcolor1);
	text-align: center;
	border-radius: 50%;
	position: relative;
	display: block;
	line-height: 0;
  
 }
 .comment-avatar-cnt span span{
	text-align: center;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
 }
 .comment-meta-cnt{
	display: inline-block;
 }
 .comment-meta-cnt span{
	display: block;
	margin-bottom: 5px;
 }
 .comment-meta-autor{
	font-size: var(--fontsize2);
	color: var(--second_color);
 }
 .comment-meta-date{
	font-size: var(--fontsize1);
	color: var(--textcolor2);
 }
 .comment-reply-cnt{
	display: inline-block;
 }

 .comment ul{
	 margin-inline-start: 15px;
 }




.comment-form-comment,.comment-form-comment textarea{
	width: calc(100% - 5px);
}

.comment-reply-title{
	font-size: var(--fontsize2);
	padding: 15px 0;
	margin-top: 5px;
}
.comment-reply-title span{
	float: left;
	display: inline-block;
}
 /*--------------------------- archivess ------------------------------------- */
 .archive-container{
	position: relative;
	display: flex;
	box-sizing: border-box;
	height: 100%;
	padding: 10px;
	flex-direction: column;
	background-color: var(--bgcolor);;

}

 .arth-d-architems {
	display: flex;
	width: 100%;
	flex-direction: row;
	align-items: baseline;
	box-sizing: border-box;
	flex-wrap: wrap;
	align-items: flex-start;
	row-gap: 20px;
	justify-content: space-between;
	padding: 10px 0;
	}

.arth-d-archhead{
	display: flex;
	box-sizing: border-box;
	justify-content: space-between;
	align-items: baseline;
}
.arth-h2-archtitle{
	margin: 5px;
}
.arth-d-sortcnt span{
	color: var(--textcolor2);
	font-size: var(--fontsize2) !important;
}
/*--------------------------- pagination ------------------------------------- */
.arth-pagination{
	display: flex;
	justify-content: center;
	column-gap: 5px;
}
.page-numbers{
	box-sizing: border-box;
	padding: 5px;
	background-color: var(--bgcolor1);
	min-width: 30px;
	border-radius: 5px;
	text-align: center;
}
.page-numbers.current{
	background-color: var(--bgcolor2);
}

/*--------------------------- items ------------------------------------- */

.arth-d-itemcont{
	box-sizing: border-box;
	width: 100%;
}
.arth-d-itcon-2{
	background: var(--bgcolor1);
    padding: 10px;
    border-radius: 10px;
}
 .arth-ul-items{
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	column-gap: var(--itemgapwidth);
	row-gap: var(--itemgapwidth);
	width: 100%;
	justify-content: space-between;
 }
 .arth-ul-itemscrollx{
	overflow-x: scroll;
	scrollbar-width: none;
	display: flex;
	align-items: flex-start;
	width: 100%;
	column-gap: var(--itemgapwidth);
 }
 
 .arth-d-itemhead{
	display: flex;
	align-items: center;
	width: 100%;
	justify-content: space-between;
	padding: 10px 10px;
	background-color: var(--bgcolor);
	border-radius: 10px;

}
.arth-d-itemhead h4{
	position: relative;
    padding-inline-start: 25px;
}
.arth-d-itemhead h4::before{
	content: " ";
    background-color: var(--second_color);
    width: 16px;
    height: 8px;
    position: absolute;
    right: 0;
    top: 8px;
    border-radius: 8px;
    border: 1px solid #ddd;
    box-shadow: 0px 0px 1px 1px #ddd;
    display: inline-block;
}

.arth-d-hsmor>h4{
	font-size: var(--fontsize4);

}


.arth-d-hsmor{
	font-size: 14px;
}

 .arth-li-ib{
	
	display: flex;
	justify-content: center;
	align-items: start;
	flex-direction: column;
	position: relative;
	box-sizing: border-box;
	border-radius: 5px;
	background-color: var(--bgcolor);
	width: 200px;
	padding: 10px;
	overflow: hidden;
 } 
 .arth-li-ib:hover{
	background-color: var(--bgcolor1);
 }
 .arth-li-irow{
	
	flex-direction: row;
 }

 .arth-li-ib>a{
	width: 100%;
 }
 .arth-li-irow>a{
	display: flex;
	column-gap: 10px;
 }
 
.arth-li-ib>a>div:nth-child(1){
	height: 200px;
	display: flex;
	justify-content: center;
	background-color: var(--bgcolor1);
	border-radius: 10px;
	overflow: hidden;
}
.arth-li-irow>a>div:nth-child(1){
	height: 150px;
	width: 150px;
	display: block;
}
.arth-li-ib img{
	height: 200px;
	width: 200px;
	
 }
 .arth-li-irow img{
	height: 150px;
	width: 150px;
	
 }
 .arth-li-ib>a>div:nth-child(2){
	margin-top: 10px;
	box-sizing: border-box;
	padding: 0 5px;
	font-size: var(--fontsize2);
	line-height: 1.6;
	display: flex;
  	flex-direction: column;
	row-gap: 10px;
	
 }
 .arth-li-irow>a>div:nth-child(2){
	width: calc(100% - 160px);;
	font-size: var(--fontsize3);
 }
 .arth-li-ib>a>div:nth-child(2)>span:nth-child(2){
	font-size: var(--fontsize1);
	color: var(--textcolor2);
 }
 .arth-s-ibt{
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: inline-block;
	max-width: 100%;
  
 }


 .arth-li-archb{
	width: calc(33% - 15px);
	margin: 0px;
}
.arth-li-archb > a{
	width: 100%;
}


.arth-a-relgrid:hover, .arth-a-ib:hover{
   background-color: #fff0;
   color:var(--textcolor1);
   
}
.arth-im-ibw{
	height: 200px;
}
.arth-im-ibarchimg{
   width: auto;
   height: 200px;
   background-color: var(--bgcolor1);
   border-radius: 0 !important;
   display: flex;
   justify-content: center;
   overflow: hidden;
}
.arth-im-ibarchimg > img{
   width: auto;
   
}

.item-width6{
	width: calc(100%/6 - var(--itemgapwidth));
}
.item-width5{
	width: calc(100%/5 - var(--itemgapwidth));
}
.item-width4{
	width: calc(100%/4 - var(--itemgapwidth));
}
.item-width3{
	width: calc(100%/3 - var(--itemgapwidth));
}
.item-width2{
	width: calc(100%/2 - var(--itemgapwidth));
}
.item-width1{
	width: 100%;
}
.item-widthscroll{
	min-width: 200px;
}


 /*----------------------------------footer------------------------------------- */
 
 .arth-footer{
	display: flex;
	 width: 100%;
	 justify-content: center;
	 position: relative;
	 top: var(--header-height);
	 box-sizing: border-box;
	 background-color: var(--third_color);
	 align-items: center;
	 flex-direction: column;

 }
 .arth-d-fotcnt{
	width: 100%;
	max-width: var(--maxwidth);;
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--bgcolor2);
 }
.arth-d-fotcolscnt{
	width: 100%;
	display: flex;
	box-sizing: border-box;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 10px;
	 box-sizing: border-box;
}
.arth-d-fotcolcnt{
	/* background-color: var(--bgcolor1);; */
	
	/* margin-bottom: 10px; */
	padding: 10px;
	box-sizing: border-box;
	/* border-radius: 10px; */
}
.footwidget-title{
	font-size: var(--fontsize4);
	position: relative;
  padding-inline-start: 25px;

}
.footwidget-title::before{
	content: " ";
    background-color: var(--second_color);
    width: 16px;
    height: 8px;
    position: absolute;
    right: 0;
    top: 8px;
    border-radius: 8px;
    border: 1px solid #ddd;
    box-shadow: 0px 0px 1px 1px #ddd;
	display: inline-block;
}
.arth-d-fotcopyright{
	background-color: var(--third_color);
	box-sizing: border-box;
	width: 100%;
	max-width: var(--maxwidth);;
	color: var(--second_textcolor1);
	font-size: var(--fontsize);
	padding: 2px ;
	border-top: 1px solid var(--second_textcolor1);
}
.arth-d-fotcopyright p{
	margin: 0px;
}
.footwidget li{
	
}

.footwidget ul a{
	width: 100%;
	display: inline-block;
	padding: 5px;
	color: var(--bgcolor2);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: inline-block;
	max-width: 100%;
	font-size: var(--fontsize1);
}
.footwidget ul a:hover{
	background-color: var(--bgcolor3);
	color: var(--textcolor1);
	border-radius: 10px;
}

/*-section container width sidebar1active */
.s-c-w-s1{
	/* width: calc(var(--maxwidth) - var(--sidebar1-width) - 10px); */
	width:var(--content-width);
}

/*----------------------------------commons------------------------------------- */

.h-w{
	width: 50%;
}
.f-w{
	width: 100%;
}
.w-70{
	width: 69%;
}
.w-75{
	width: 74%;
}
.w-30{
	width: 30%;
}
.w-25{
	width: 25%;
}

.w-80{
	width: 79%;
}
.w-20{
	width: 20%;
}

.wauto{
	width: 0px;
    flex: 1 1 800px;
}
.w320px{
	width: 320px;
    flex: 0 0 320px;
}
div,li,a,td{
	box-sizing: border-box;
}
a{
	text-decoration: none;
	font-family: iranyekan;
	color:var(--textcolor1);
}
a:active{
	color:var(--textcolor1);
}

select,option,input,h4,div,span{
	
	font-family: iranyekan;
}
li a{
	font-size: var(--fontsize2);
}

ul{
	list-style: none;
	padding: 0px;
	margin-top: 10px;
}

img{
	border-radius: 5px;
}

h1,h2,h3,h4,h5,h6{
	margin: 0px;
}

.arth-btn,.form-submit input{
	border:0px solid;
	background-color: var(--btncolor1);
	border-radius: 5px;
	color: var(--bgcolor);
	box-sizing: border-box;
	padding: 2px 5px;
	font-size: var(--fontsize2);
}
.arth-btn,.form-submit input:hover{
	background-color: var(--btncolor1_2);
}

.common-btn-link{
	font-size: var(--fontsize2);
	padding: 2px 3px;
	border-radius: 8px;
}



.common-btn-link-2{
	border: 1px solid #1e83f0;
	background-color: #1e83f0;
	border-radius: 5px;
	color: white;
	padding: 7px;
	margin: 0 4px;

}
.common-btn-link-2:hover{
	background-color: #4493ec;
}

.common-btn-link-3{
	border: 1px solid #dddddd;
	background-color: #dddddd;
	border-radius: 3px;
	color: #111;
	padding: 7px;
	margin: 0 4px;

}
.common-btn-link-3:hover{
	background-color:  var(--color2);
}

.common-btn:hover{
	background-color:  var(--color2);
}

.common-btn{
	border: 1px solid var(--bgcolor3);;
	background-color: var(--bgcolor3);;
	border-radius: 3px;
	color: var(--textcolor1);;
	padding: 5px;
	margin: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	
}
.common-btn-nobg{
	background-color: #fff0;
	border: 0px solid #fff;;
}

.path-cmn{
	fill:var(--second_textcolor1);
}
.path-cmn-dark{
	fill:var(--textcolor1);
}
body{
	margin: 0px;
}

.arth-title{
	display: flex;
	background-color: var(--second_color);
	color: var(--second_textcolor1);
	padding: 8px;
	border-radius: 5px;
}
.arth-d-foottitle{
	display: flex;
	color: var(--second_textcolor1);
	
}
.arth-title-before{
	width: 9px;
	height: auto;
	border-radius: 5px;
	background-color: var(--bgcolor3);

}

.arth-s-lgdown{
	
	border-bottom: 0 none;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid var(--bgcolor3);
	position: relative;
	top: -1px;
	width: 0px;
	display: inline-block;
	height: 0px;
}

.arth-ul-dropdown{
	display: inline-block;
	margin: 0;

}
.arth-ul-dropdown>li{
	cursor: pointer;
	box-sizing: border-box;
	border: 1px solid var(--bgcolor);
	display: inline-block;
    position: relative;
}
.arth-ul-dropdown>li>span{
	padding: 5px 10px;
	display: inline-block;
}
.arth-ul-dropdown>li:hover{
	border: 1px solid var(--bgcolor3);
}
.arth-ul-dropdown>li:hover > ul{
	display: block;
}
.arth-ul-dropdown>li>ul{
	position: absolute;
    z-index: 1;
    background-color: var(--bgcolor1);
    margin: 0;
	width: max-content;
	display: none;
}
.arth-ul-dropdown>li>ul>li{
	box-sizing: border-box;
	padding: 5px 10px;
}

/*----------------------------------tags------------------------------------- */

.arth-comontag{
	border-radius: 5px;
	padding: 2px 5px;
	display: inline-flex;
	column-gap: 5px;
	justify-content: center;
	align-items: center;
	color:  var(--second_textcolor1);
	background-color: var(--second_color);
	font-size: var(--fontsize1);
}

/*----------------------------------buttons------------------------------------- */


.arth-a-withlogoright{
	border-radius: 5px;
	border: 1px solid var(--second_color);
	color:  var(--second_color);
	padding: 2px 5px;
	display: flex;
	column-gap: 5px;
	justify-content: center;
	align-items: center;

}
.arth-a-withlogoright:hover{
	background-color: var(--second_color);
	color:  var(--second_textcolor1);
}
.arth-a-withlogoright span:first-child{	width: 100%;}
.arth-a-withlogoright span:nth-child(2){width: 16px;	display: flex;}
.arth-a-withlogoright svg{width: 16px;}
.arth-a-withlogoright path{fill: var(--second_color);}
.arth-a-withlogoright:hover path{fill: var(--second_textcolor1);}

.arth-a-withlogoright.reversecolor{
	background-color: var(--second_color);
	color:  var(--second_textcolor1);
}
.arth-a-withlogoright.reversecolor:hover{
	background-color: var(--second_textcolor1);
	color:  var(--second_color);
}
.arth-a-withlogoright.reversecolor path{fill: var(--second_textcolor1);}
.arth-a-withlogoright.reversecolor:hover path{fill: var(--second_color);}

.arth-a-withlogoright.noborder{
	border: 0px ;
}

.arth_show_more{
	height: 50px !important;
}

.arth-d-showmore{
	width: 100%;
	display: block;
	/* background-image: linear-gradient(#fff0, #ffff); */
	position: relative;
	bottom: 0;
	padding-top: 20px;
	text-align: center;
	/* border-bottom: 1px solid var(--bgcolor2); */
}

.arth-d-showmore span span{
	cursor: pointer;
}
.arth-d-showmore > span{
	display: inline-block;
}
/*----------------------------------form------------------------------------- */
.arth-d-allformareacnt{
	
}
.arth-d-fieldscnt {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	}
.arth-form-fieldcnt{
	width: 100%;
	padding: 5px;
}
.comment-field-label{
	width: 100%;
	padding: 5px;
}
.comment-field-input{
	width: 100%;
	padding: 5px;
}
.comment-field-input input[type=text],.comment-field-input textarea{
	border-radius: 10px;
	border:0px solid var(--second_color);
	background-color: var(--bgcolor3);
	font-size: var(--fontsize3);
	color: var(--textcolor1);
	padding: 5px;
	width: 100%;
}
.arth-form-submitcnt{
	padding: 10px;
}
.arth-form-submitcnt button{
	padding: 5px;
	cursor: pointer;
}

/*----------------------------------mobile------------------------------------- */

@media screen and (max-width: 900px){
	div.header-menu-class{
		width:0px;
		display: none;
	}

	.desktop-head-extra-btns{
		display: none;
	}

	 .single-container{
		
		flex-direction: column;
	}
	.main_container{
		padding: 15px 10px 10px 10px;
	}
	
	.content-container{
		width: 100%;
		border-left: 0px;
	
	}
	.archive-container{
		width: 100%;
	}
	.sidbar-container{
		width: 100%;
		
	}

	.arth-li-archb{
		width: calc(50% - 10px);
	}
	.arth-d-fotcolcnt{
		width:100%;
	}

	
	.platform_config_container, .mega_menu_container, .user_account_container, .toggle_search_container, .toggle_search_lay{
		width:100% !important;
	}

	.arth-a-relgrid{
		width: calc(100% - 5px);
	}

	.arth-d-archhead{
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.s-c-w-s1{
		width: 100%;
	}
	.sidbar1-width{
		width:100%;
	}

	.item-width6{
		width: calc(100%/4 - var(--itemgapwidth));
	}
	.item-width5{
		width: calc(100%/3 - var(--itemgapwidth));
	}
	.item-width4{
		width: calc(100%/3 - var(--itemgapwidth));
	}
	.item-width3{
		width: calc(100%/2 - var(--itemgapwidth));
	}

}

@media screen and (min-width: 901px){
	.mobile-head-extra-btns{
		display: none;
	}
	.arth-media-container{
		max-width: 400px;
	}
}


@media screen and (max-width: 679px){
	.desktop{
		display: none;
	}
	.arth-d-singhd{
		flex-direction: column;
		padding: 10px;
	}
	.arth-d-singgal{
		width: 100%;
		height:calc(100vw - 20px);
		
	}
	.arth-d-singt{
		width: 100%;
		padding:10px  0  ;
	}
	.item-width6{
		width: calc(100%/3 - var(--itemgapwidth));
	}
	.item-width5{
		width: calc(100%/2 - var(--itemgapwidth));
	}
	.item-width4{
		width: calc(100%/2 - var(--itemgapwidth));
	}
	.item-width3{
		width: 100%;
	}
	.item-width2{
		width: 100%;
	}
	.item-width1{
		width: 100%;
	}
	
	
}
@media screen and (min-width: 680px){
	.mobile-disable{
		display: none;
	}
	
}


/*-----------------------------------------------------------like------------------------------------- */


.like-ar-deactive{
	fill: #eb9bdb;
	
}
.like-ar-active{
	fill: #df0f50;
}
.dislike-ar-deactive{
	fill: #f2a933;
}
.dislike-ar-active{
	fill: #ff4a47;
}
.like-ar-svg{
	width: 2em;
	height: 2em;
	margin-left:5px;
}
.dislike-ar-svg{
	width: 1.8em;
	height: 1.8em;
	margin-left:5px;
}
.gear-anim{
animation-name: ckw;
animation-duration: 2s;
animation-iteration-count: infinite;
transform-origin: 50% 50%;
display: inline-block;

}
.ar_liker_main{text-align:center;width:100%}
.ar_liker_cnt{text-align:center;background-color:#efefef;border-radius:20px;padding:5px;width:auto;display: inline-block;}
.ar_like_title_cnt{text-align:center;border-radius:20px;padding: 5px 20px;}
.ar_like_title{text-align:center;font-size:16px;margin: 0px;}
.ar_like_btns_cnt{text-align:center;width:100%;padding: 10px 5px 0px 5px;}

@keyframes ckw {
0% {
	transform: rotate(0deg);
}
100% {
	transform: rotate(360deg);
}
}



/*-------------------------------------------------------menu------------------------------------- */




.header-menu{
	display: block;
	width: 100%;
	position: relative;
	z-index: 999;
	padding:15px;
}
.menu ul{
	margin: 0;
}
.menu  ul > li{
	display: inline-block;
	margin-left: 25px;
}
.menu  ul > li > a{
	display: inline-block;
	font-size: 15px;
	font-weight: 500;
	color:var(--second_textcolor1);
	position: relative;
	transition: color 0.3s ease;
	
}
.menu > div >  ul > li > a{
    pointer-events: none;
	

}
.menu  ul > li .sub-menu{
	position: absolute;
	z-index: 500;
	background-color:var(--second_color);
	box-shadow: -2px 2px 70px -25px rgba(0,0,0,0.3); 
	padding: 20px 30px;
	transition: all 0.5s ease;
	margin-top:0px;
	opacity:0;
	visibility: hidden;
}
@media(min-width: 992px){
.menu  ul > li.menu-item-has-children:hover .sub-menu{
	margin-top: 0;
	visibility: visible;
	opacity: 1;
}
}
.menu  ul > li .sub-menu  > li{
	line-height: 1;
	display: block;
}
.menu  ul > li .sub-menu > li > a{
	display: block;
	padding: 10px 0;
	font-size: 15px;
	color: var(--second_textcolor1);
	transition: color 0.3s ease;
	text-decoration: none;
	text-transform: capitalize;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.menu  ul > li .sub-menu{
	min-width: 280px;
	max-width: 350px;
}


.menu  ul > li .sub-menu > li > a:hover,
.menu  ul > li:hover > a{
	color:var(--second_textcolor2);
}

.mobile-menu-head,
.mobile-menu-trigger{
	display: none;
}

#megmenu_btn{
	display: none;
	visibility: hidden;
}

/*responsive*/
@media(max-width: 991px){

	#megmenu_btn{
		display: inline-block;
		visibility: visible;
	}
	.mobile-menu-trigger{
		display: flex;
		height: 30px;
		width: 30px;
		margin-left: 15px;
		cursor: pointer;
		align-items: center;
		justify-content: center;
	}
	.mobile-menu-trigger span{
		display: block;
		height: 2px;
		background-color: #333333;
		width: 24px;
		position: relative;
	}
	.mobile-menu-trigger span:before,
	.mobile-menu-trigger span:after{
		content: '';
		position: absolute;
		left:0;
		width: 100%;
		height: 100%;
		background-color: #333333;
	}
	.mobile-menu-trigger span:before{
		top:-6px;
	}
	.mobile-menu-trigger span:after{
		top:6px;
	}
	

	.menu{
		position: fixed;
		width: 320px;
		background-color:var(--second_color);
		right:0;
		top:0;
		height: 100%;
		overflow: hidden;
		transform: translate(200%);
		transition: transform 200ms ease-in-out;
		visibility: hidden;
		z-index: 1099;
	}
	.menu.active{
	   transform: translate(0%);	
	   visibility: visible;
	}
	.menu  ul > li{
		line-height: 1;
		margin:0;
		display: block;
	}
	.menu  ul > li > a{
		line-height: 50px;
		height: 50px;
		padding:0 15px 0 15px;
		display: block;
		border-bottom: 1px solid rgba(0,0,0,0.1);
	}
	
	.menu .mobile-menu-head{
		display: flex;
		height: 50px;
		border-bottom: 1px solid var(--bgcolor1);
		justify-content: space-between;
		align-items: center;
		position: relative;
		z-index: 501;
		position: sticky;
		color: var(--second_textcolor1);
		top:0;
	}
	.menu .mobile-menu-head .go-back{
		height: 50px;
		width: 50px;
		border-left: 1px solid var(--bgcolor1);
		cursor: pointer;
		line-height: 50px;
		text-align: center;
		color:var(--second_textcolor1);
		font-size: 16px;
		display: none;
	}
	.menu .mobile-menu-head.active .go-back{
		display: block;
	}
	.menu .mobile-menu-head .current-menu-title{
		font-size: 15px;
		font-weight: 500;
		color:var(--second_textcolor1);
	}
	.menu .mobile-menu-head .mobile-menu-close{
	    height: 50px;
		width: 50px;
		border-right: 1px solid var(--bgcolor1);
		cursor: pointer;
		line-height: 50px;
		text-align: center;
		color:var(--second_textcolor1);	
		font-size: 25px;
	}
	.menu .menu-main{
		height: 100%;
		overflow-x: hidden;
		overflow-y: auto;
	}

	.menu  ul > li .sub-menu{
		visibility: visible;
		opacity: 1;
		position: absolute;
		box-shadow: none;
		margin:0;
		padding:15px;
		top:0;
		right:0;
		width: 100%;
		height: 100%;
		padding-top: 65px;
		max-width: none;
		min-width: auto;
		display: none;
		transform: translateX(0%);
		overflow-y: auto;
	}
.menu  ul > li .sub-menu.active{
	display: block;
}
@keyframes slideLeft{
	0%{
		opacity:0;
		transform: translateX(100%);
	}
	100%{
	    opacity:1;
		transform: translateX(0%);	
	}
}
@keyframes slideRight{
	0%{
		opacity:1;
		transform: translateX(0%);
	}
	100%{
	    opacity:0;
		transform: translateX(100%);	
	}
}

	.menu  ul > li .sub-menu  li > a{
		display: block;
	}
	
	.menu-overlay{
		position: fixed;
		background-color: rgba(0,0,0,0.5);
		right:0;
		top:0;
		width: 100%;
		height: 100%;
		z-index: 1098;
		visibility: hidden;
		opacity:0;
		transition: opacity 0.5s ease;
	}
	.menu-overlay.active{
	  visibility: visible;
	  opacity:1;	
	}
}