body{
	background-color: #f9f9f9cc;;
	font-family: 'shabnam';
	overflow-x: hidden;
	text-align: right;
	font-size: 14px;
}

button{
	padding: 5px 15px;
	border-radius: 5px;
	cursor: pointer;
	transition: all ease-in 0.1s;
}

button:focus{
	outline: none;
}

button:active{
	box-shadow: 0 0 3px #969696 inset;
}

.menu > div > ul a{
	color: #fdfdfd;
}

.button-header-portal{
	color: #ffffff;
	height: 40px !important;
	line-height: 40px !important;
	border-radius: 19px;
	padding: 0 15px;
	width: 164px;
	text-align: center;
	background-image: -moz-linear-gradient(0deg, rgb(255, 102, 102) 0%, rgb(255, 128, 102) 48%, rgb(255, 153, 102) 100%);
	background-image: -webkit-linear-gradient(0deg, rgb(255, 102, 102) 0%, rgb(255, 128, 102) 48%, rgb(255, 153, 102) 100%);
	background-image: -ms-linear-gradient(0deg, rgb(255, 102, 102) 0%, rgb(255, 128, 102) 48%, rgb(255, 153, 102) 100%);
	box-shadow: -1.186px 16.959px 29px 0px rgba(51, 51, 51, 0.2);
}

.button-header-portal span{
	color: white;
	line-height: 40px;
	text-align: center;
}

.rtl-row{
	direction: rtl;
}

.bg-img{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: -1;
	background-position: center;
	background-size: cover;
	background-attachment: fixed;
}

.bg-img .overlay{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	opacity: .8;
	background: #1C1D21;
}

.home-content{
	padding-top: calc(50vh - 90px);
	text-align: center;
}

.home-content h3{
	padding-bottom: 15px;
}

.home-content h5{
	padding-bottom: 30px;
}

.button-header1,
.button-header2{
	display: inline-block;
	border-radius: 20px;
	border: 2px solid #ff9966;
	text-align: center;
	text-decoration: none;
	font-size: 19px;
	margin: 5px;
	cursor: pointer;
	height: 50px;
	transition: all 0.5s;
	width: 170px;
	background-color: #f49366;
}

.button-header2{
	color: #ff9966;
	background-color: transparent;
}

.button-more{
	display: inline-block;
	border-radius: 25px;
	border: 1px solid #ff9966;
	color: #fff;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	margin: 50px 2px;
	cursor: pointer;
	height: 42px;
	transition: all 0.5s;
	width: 164px;
	background-image: -moz-linear-gradient(0deg, rgb(255, 102, 102) 0%, rgb(255, 128, 102) 48%, rgb(255, 153, 102) 100%);
	background-image: -webkit-linear-gradient(0deg, rgb(255, 102, 102) 0%, rgb(255, 128, 102) 48%, rgb(255, 153, 102) 100%);
	background-image: -ms-linear-gradient(0deg, rgb(255, 102, 102) 0%, rgb(255, 128, 102) 48%, rgb(255, 153, 102) 100%);
	box-shadow: -1.186px 16.959px 29px 0px rgba(255, 153, 102, 0.43);
}

.button-header1:hover{
	box-shadow: 0 0 3px 0 rgb(244, 147, 102), 0 0 0 1px rgb(244, 147, 102);
}

.button-header1:hover span{
	color: #fff;
}

.button-header1 span{
	cursor: pointer;
	display: inline-block;
	position: relative;
	transition: 0.5s;
	direction: rtl;
	color: #ffffff;
	padding-top: 8px;
	font-size: 1em;
}

.button-header2:hover{
	background-color: #ff9966;
}

.button-header2:hover span{
	color: #fff;
}

.button-header2 span{
	cursor: pointer;
	display: inline-block;
	position: relative;
	transition: 0.5s;
	direction: rtl;
	color: #ff9966;
	padding-top: 8px;
	font-size: 1em;
}

.button-more span{
	cursor: pointer;
	display: inline-block;
	position: relative;
	transition: 0.5s;
	color: #fff;
	padding-top: 9px;
	font-size: .9em;
}

.button-more:hover span{
	padding-left: 25px;
}

.button-more:hover span::after{
	opacity: 1;
	left: 0;
}

.button-more span::after{
	content: '\00bb';
	position: absolute;
	opacity: 0;
	top: 10px;
	left: -20px;
	transition: 0.5s;
}

.index-4-box{
	height: 230px;
	width: 100%;
	text-align: center;
	margin: 15px 0;
	border-radius: 10px;
	background-color: rgb(255, 255, 255);
	box-shadow: 0 38px 51px 0 rgba(51, 51, 51, 0.1);
}

.index-4-section-img{
	height: 171px;
	padding: 28px;
}

.index-4-section-img img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.index-4-section-h6 h6{
	color: #663399;
}

a:hover{
	text-decoration: none;
}

.line-bottom-title{
	display: inline-block;
	height: 4px;
	background-color: #663399;
	width: 59px;
}

#c2, #c3, #c4{
	margin-top: 100px;
}

.c2-content-right p, .c3-content-left p{
	line-height: 3em;
	width: 90%;
}

#owl-2{
	direction: ltr;
	padding-top: 2px;
	padding-bottom: 30px;
	background-color: transparent;
}

#owl-2 .owl-carousel .owl-item img{
	width: 100%;
	height: 415px;
	margin: auto;
	max-width: 100%;
	margin: 0 -25px;
	object-fit: contain;
}

.div-btn-download{
	text-align: center;
}

.btn-download{
	background-color: transparent;
	border: unset;
	color: black;
	width: 10em;
	padding: 0;
	margin-right: 10px;
}

.btn-download:hover{
	background-color: transparent;
}

.btn-download img{
	width: 100%;
}

.box-blog{
	text-align: center;
	border-radius: 5px;
	height: 200px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	margin: auto;
	margin-bottom: 65px;
	margin-top: 40px;
	padding: 24px 7px;
	text-align: right;
	transition: 0.5s;
	background-color: white;
	line-height: 4em;
}

.img-blog{
	width: 100%;
	vertical-align: bottom;
	height: 100%;
	object-fit: cover;
}

.box-blog:hover{
	box-shadow: 1px 1px 2px #888888;

}

.text-newest{
	line-height: 1.6em;
}

.line-bottom-title-center{
	display: inline-block;
	height: 4px;
	background-color: #663399;
	width: 59px;
}

.c4-box-blog-img{
	width: 28%;
	display: inline-block;
	padding: 10px;
	height: 140px;
}

.c4-box-blog-text{
	width: 70%;
	display: inline-block;
	height: 100%;
}

.c4-box-blog-text h6{
	color: #663399;
	font-size: .8em;
	margin-bottom: 10px;
}

.c4-box-blog-text h5{
	margin-bottom: 12px;
	color: #000;
	font-size: 1.2em;
}

.in-p-blog{
	color: #606060;
	line-height: 1.8em;
	font-size: .8em;
}

/*footer*/
.footer-background{
	background-color: #8080801a;
	box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, .05), 0 1px 5px 0 rgba(0, 0, 0, .15);
}

.footer-right-col, .footer-center-col, .footer-left-col{
	margin-top: 35px;
	margin-bottom: 35px;
}

.footer-logo-pic{
	width: 70px;
	height: 70px;
	display: inline-block;
}

.footer-logo-text{
	width: 70px;
	height: 70px;
	display: inline-block;
}

.footer-logo-pic img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.footer-logo-text img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.footer-text-right-col{
	margin-top: 15px;
}

.footer-text-right-col p{
	line-height: 3em;
	color: #000;
}

.footer-center-col{
	margin-right: 100px;
}

.footer-ul-list{
	margin-top: 30px;
}

.footer-ul-list ul{
	padding: 0;
	list-style: none;
	line-height: 3em;
}

.footer-ul-list ul li a{
	color: #000;
}

.foot_aw{
	color: gray;
	padding: 7px 11px;
	font-size: 22px;
}

.foot_aw:hover{
	color: #ff6666;
}

.footer-ul-list ul li p{
	color: #000;
	margin-bottom: 0;
}

.footer-title h5{
	color: rebeccapurple;
}
.e-namad {
	position: relative;
	width: 100px;
	height: 110px;
	background-color: #fff;
	margin: 10px 0 20px;
	border-radius: 5px;
	overflow: hidden;
}
.e-namad .image-enamad {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.c2-bg2{
	width: 100%;
	left: 0;
	position: absolute;
	top: 135%;
	z-index: -1;
}

.c2-bg3{
	width: 100%;
	left: 0;
	position: absolute;
	top: 269%;
	z-index: -1;
}

.c2-bg4{
	width: 50px;
	left: 0;
	position: absolute;
	top: 115%;
	z-index: -1;
}

.c2-bg5{
	width: 50px;
	right: 0;
	position: absolute;
	top: 244%;
	z-index: -1;
}

.c2-bg6{
	width: 50px;
	left: 0;
	position: absolute;
	top: 300%;
	z-index: -1;
}

.go-top{
	padding: 0 !important;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	position: fixed;
	bottom: 30px;
	right: 30px;
	font-size: 25px !important;
	display: none;
	border: none;
}

.white-text{
	color: white;
}

.intro-content{
	text-align: center;
	line-height: 260%;
}

.services{
	text-align: center;
}

.project-header{
	text-align: center;
	padding-bottom: 15px;
}

.photo-bg{
	width: 350px;
	height: 450px;
	margin-bottom: 10px;
	border-radius: 0px 60px 0px 50px;
	position: relative;
}

.photo-bg2{
	width: 350px;
	height: 450px;
	border-radius: 0px 60px 0px 50px;
	position: relative;
}

.photo-small{
	width: 350px;
	height: 200px;
	position: relative;
}

.box-bg{
	height: 450px;
	border-radius: 0px 60px 0px 50px;
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;
}

.box-bg2{
	height: 450px;
	border-radius: 0px 60px 0px 50px;
	margin-top: 20px;
	position: relative;
	overflow: hidden;
}

.box-small{
	/*width: 300px;*/
	height: 200px;
	border-radius: 0px 60px 0px 50px;
	overflow: hidden;
	position: relative;
}

.botton1{
	width: 170px;
	height: 40px;
	background-color: pink;
	border-radius: 0px 20px 0px 20px;
	margin: auto;
	margin-bottom: 20px;
}

.middle-img{
	height: 300px;
	margin-top: 34px;
	margin-bottom: -11px;
	background-size: cover;
	background-position: top center;
}

.text-register{
	text-align: center;
	padding-top: 50px;
}

.header1{
	text-align: right;
}

.box1{
	padding-top: 50px;
	padding-bottom: 50px;
}

.header-top{
	width: 100%;
	height: 100px;
	position: fixed;
	transition: all 0.3s;
	z-index: 2;
	direction: rtl;
}

.pos-rel{
	position: relative;
}

header{
	height: 100vh;
	background-image: url('../images/all/header.png');
	background-size: cover;
	background-position: center center;
}

.header-top.fix{
	height: 65px;
	background-color: white;
	color: black;
	box-shadow: 0 -10px 25px #000;
}

.header-top.fix > li:hover{
	color: pink;

}

.header-logo img{
	height: 40px;
	margin-top: 13px;
	transition: all 0.3s;
}

.header-logo img:nth-child(2){
	display: none;
}

.header-top.fix .header-logo img{
	height: 45px;
	margin-top: 15px;
}

.header-top.fix .header-logo img:nth-child(2){
	display: unset;
}

.header-top.fix .header-logo img:nth-child(1){
	display: none;
}

.header-main{
	padding: calc(50vh - 80px) 5% 0 5%;
}

.header-arrow{
	width: 21px;
	height: 30px;
	position: absolute;
	bottom: 40px;
	right: calc(51% - 25px);
	text-align: center;
	border: 2px solid white;
	border-radius: 43%;
	font-size: 25px;
	line-height: 81px;
	cursor: pointer;

}

.header-top{
	width: 100%;
	height: 60px;
	position: fixed;
	transition: all 0.3s;
	z-index: 2;
}

.header-top-customer{
	background-color: #774ac3;
	top: 0;
	right: 14px;
	height: 63px;
}

.header-top{
	width: 100%;
	height: 70px;
	position: fixed;
	transition: all 0.3s;
	z-index: 2;
	direction: rtl;
	/*background-color: white;*/
	top: 0;
	margin: 0 -15px;
}

.mouse-roll{
	width: 2px;
	height: 5px;
	background-color: white;
	right: 8px;
	position: absolute;
	top: 7px;
}

.header-arrow-a > div i{
	transition: all 0.5s;
}

.header-arrow-a > div i{
	transition: all 0.5s;
	color: white;
}

.header-arrow-a:hover > div i{
	padding-top: 30px;

}

.owl-item{
	float: right !important;
}

.box1{
	padding-top: 50px;
	padding-bottom: 50px;
}

.right-pointr{
	position: fixed;
	top: 39%;
	right: 0;
}

.right-pointr ul li{
	width: 10px;
	height: 10px;
	border: 2px solid gray;
	border-radius: 10px;
	list-style: none;
	margin: 6px 8px;
}

.no-padd-right1{
	padding-right: 0;
}

.no-padd-right2{
	padding-right: 0;
}

/*.button-header1:hover{*/
/*border-radius: 20px;*/
/*background-color: rgb(255, 255, 255);*/
/*box-shadow: 0px 28px 40px 0px rgba(51, 51, 51, 0.05);*/
/*position: absolute;*/
/*left: 853px;*/
/*top: 1861px;*/
/*width: 442px;*/
/*height: 418px;*/
/*z-index: 56;*/
/*}*/

/*appIntroduction page css*/

.mobile-pic-div{
	text-align: center;
}

.mobile-pic-section{
	width: 512px;
	margin-top: 81px;
	display: inline-block;
	height: 504px;
}

.mobile-pic-div img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.button-app-header1{
	display: inline-block;
	border-radius: 25px;
	border: none;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	margin: 4px 2px;
	cursor: pointer;
	height: 46px;
	transition: all 0.5s;
	width: 164px;
	background-color: #fff;
	color: #000;
	box-shadow: -1.186px 16.959px 29px 0px rgba(21, 7, 7, 0.46);
}

.button-app-header2{
	display: inline-block;
	border-radius: 25px;
	border: none;
	color: #000;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	margin: 4px 2px;
	cursor: pointer;
	height: 46px;
	transition: all 0.5s;
	width: 164px;
	background-color: #fff;
	box-shadow: -1.186px 16.959px 29px 0px rgba(21, 7, 7, 0.46);
}

.button-app-header1 span{
	cursor: pointer;
	display: inline-block;
	position: relative;
	transition: 0.5s;
	direction: rtl;
	color: #000;
	padding-top: 8px;
	width: 94px;
	height: 38px;
}

.button-app-header1 span img, .button-app-header2 span img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.button-app-header2:hover{
	background-color: #fff;
}

.button-header2:hover span{
	color: #000;
}

.button-app-header2 span{
	cursor: pointer;
	display: inline-block;
	position: relative;
	transition: 0.5s;
	direction: rtl;
	color: #000;
	padding-top: 8px;
	width: 94px;
	height: 38px;
}

.app-mobile-app1-pic{
	width: 384px;
	height: 440px;
}

.app-mobile-app1-pic img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

#fullName, #email{
	direction: rtl;
	padding-top: 17px;
	height: 44px;
	outline: none;
}

#fullName:focus, #email:focus{
	border: none;
	box-shadow: 0 0 0 .2rem rgba(255, 107, 102, 0.51);
}

#contactExplain{
	direction: rtl;
	padding-top: 17px;
	outline: none;
}

#contactExplain:focus{
	border: none;
	box-shadow: 0 0 0 .2rem rgba(255, 107, 102, 0.51);
}

.c2-content-right{
	margin-top: 15px;
}

.under-header-text-intro{
	text-align: center;
	margin-top: 35px;
	line-height: 2.5em;
}

.introduction-pic-box{
	width: 100%;
	height: 190px;
}

.introduction-pic-box img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.text-box-section{
	line-height: 2.5em;
	padding-top: 69px;
}

strong{
	font-family: shabnam;
	font-weight: normal;
	font-size: 1.1em;
}

p{
	direction: rtl;
}

@media screen and (max-width: 752px){
	.blog-posts{
		height: 405px !important;
	}
	.under-header-text-intro{
		text-align: center;
		margin-top: 248px;
		line-height: 2.5em;
	}

	.header-arrow{
		right: calc(53% - 22px);
	}

	.app-mobile-app1-pic{
		width: 308px;
		height: 340px;
		margin-top: 175px;
	}

	.mobile-pic-section{
		width: 440px;
		margin-top: 30px;
		display: inline-block;
		height: 350px;
	}

	.c2-content-right{
		margin-top: 0;
	}

	.app-mobile-app1-pic{
		width: 308px;
		height: 340px;
		margin-top: 20px;
	}

	.under-header-pic{
		width: 308px;
		height: 340px;
		margin-top: 192px;
	}

	.castum-padd{
		padding-right: 30px;
	}

	.header1{
		background-color: #333333;
		text-align: center;
	}

	.button-header{
		font-size: 14px;
		width: 120px;
	}

	.footer-center-col{
		margin-right: 0;
	}

	#owl-2 .owl-carousel .owl-item img{
		height: 260px;
	}

	.responsive-btn-sibApp{
		margin-top: 15px;
	}

	.box-blog{
		margin-top: 0;
		margin-bottom: 15px;
		line-height: 2em;
		height: 170px;
	}

	.c4-box-blog-text h6{
		margin-bottom: 0;
	}

	.c4-box-blog-text h5{
		margin-bottom: 0;
		font-size: 1em;
	}

	.c4-box-blog-img{
		width: 28%;
		display: inline-block;
		padding: 5px;
		height: 100px;
		vertical-align: top;
	}

	.in-p-blog{
		line-height: 2.5em;
	}

	.project-header{
		margin-top: 0;
	}

	.c2-bg4{
		width: 28px;
	}

	.c2-bg5{
		width: 28px;
	}

	.c2-bg6{
		width: 28px;
	}

	.button-more{
		margin: 15px 2px;
	}

	.c4-box-blog-text{

		width: 58%;
		display: inline-block;
		height: 100%;
		padding-top: 10px;

	}

	.c4-box-blog-img{
		width: 34%;
		display: inline-block;
		padding: 5px;
		height: 130px;
		vertical-align: top;
	}

}

@media (max-width: 991px){
	.header-logo{
		position: absolute;
		left: 0;
		top: 0;
	}

	.header-logo img{
		height: 35px;
		margin-top: 15px;
		float: left;
	}

	.header-main{
		text-align: center;
	}

	.end i{
		color: #fff;
	}

	.box7{
		padding: 0 20px;
	}

	.menu ul a{
		text-decoration: unset;
	}

	.header1{
		text-align: center;
	}

	.header1{
		background-color: #333333;
		text-align: center;
	}
}

@media screen and (min-width: 1380px) and (max-width: 3360px){

	.c2-bg2{
		width: 100%;
		left: 0;
		position: absolute;
		top: 68%;
		z-index: -1;
	}

	.c2-bg3{
		width: 100%;
		left: 0;
		position: absolute;
		top: 187%;
		z-index: -1;
	}

	.c2-bg4{
		width: 50px;
		left: 0;
		position: absolute;
		top: 87%;
		z-index: -1;
	}

	.c2-bg5{
		width: 50px;
		right: 0;
		position: absolute;
		top: 180%;
		z-index: -1;
	}

	.c2-bg6{
		width: 50px;
		left: 0;
		position: absolute;
		top: 231%;
		z-index: -1;
	}

}