@import url(../font/css/fontiran.css);

 body {
	 font-family: IRANSans !important;
	font-weight: 300;
	direction: rtl;
 background-color: #ced1d3;
            margin: 0 auto; 
        }
		
		
		 p{
	 font-size:13px;
	 color:#222;
	 line-height: 1.8;
	 margin-bottom: 0rem;
 }
		
		.en{
			font-family: Helvetica,Arial;
		}
		.bold{
			font-weight:bold;
		}
		body {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh; /* برای اطمینان از پوشش کل صفحه */
  margin: 0; /* حذف حاشیه پیش‌فرض body */
}
		
		.continre-area{
	width:calc(100vw - 200px);
	max-width: 380px; 
	 margin: 0 auto; 
	 background: #fff;
    padding: 7px;
    margin-top: 27px;
    border-radius: 10px;
    height: calc(100vh - 50px);
    max-height:644px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

		}
		
		.border-area{
			    border: 1px solid #ccc;
    height: 100%;
    width: 100%;
    padding: 13px;
	    max-height: 100%;
    overflow: hidden;
	    position: relative;
		min-height:100%;
		}
		#content{
			min-height:450px;
		}
		
		.back i{    position: relative;
    top: 2px;
    right: 0px;}
		.back a{color:#333;}
		.back{
			    position: absolute;
    left: 14px;
    border: 2px solid #333;
    padding: 5px 14px;
    color: #000;
    border-radius: 26px;
		}
		
	.btn-primary2 i {
	    text-align: right;
    position: absolute;
        right: 33px;
    background: var(--theme-deafult-dark);
    border: 1px solid var(--theme-deafult-dark);
    border-radius: 100%;
    padding: 10px;
   top: 13px;
    font-size: 16px;
	}
	
	
	.btn-primary2 {
    font-size: 20px;
    position: relative;
    border-width: 1px;
    color: #fff;
    border-color: var(--theme-deafult);
    font-weight: 500;
    border-radius: 54px;
    box-shadow: 2px 2px 0px 1px #cccccc;
   
    min-width: 245px;
        min-height: 66px;
    background: var(--theme-deafult);
    line-height: 50px;
}


.btn-outline-info{
	    font-size: 20px;
    
}
.btn-outline-info:hover,.btn-outline-info:active,.btn-outline-info:focus{
	color:#fff;
}

.text-justfy{
	text-align:justfy;
}
.rtl{
	direction:rtl;
}
.card{border:0px solid;}
.card-body{
	-webkit-box-shadow: 0px 0px 7px 0px rgba(130,130,130,.2);
-moz-box-shadow: 0px 0px 7px 0px rgba(130,130,130,.2);
box-shadow: 0px 0px 7px 0px rgba(130,130,130,.2);
	border:0px solid;
	    max-height: 600px;
    overflow: auto;
	        border-radius: 10px;
}

.btn.btn-primary2:hover {
	color:#fff;
  background-color: var(--theme-deafult2) !important;
}

.logo{
	max-height:90px;
}
		
.gif img{
	width: 71%;
}
.gif{
	    height: 84px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-outline-dark{
	font-size:11px;
	    box-shadow: 1px 1px 7px 5px #eee inset;
}
h2{
	color:var(--theme-deafult);
	font-size:20px;
}
.icon{
	max-height:24px;
	max-width:24px;
}
/***********************footer*/
    .footer-nav-area {
        position: fixed;
        -webkit-transition-duration: 500ms;
        transition-duration: 500ms;
        background-color: #ffffff;
        width: calc(100% + 18px);
        height: 62px;
        bottom:0;
        left: 0;
        right: -9px;
        z-index: 1000;
        border-top: 1px solid #ebebeb;
    }
	    .footer-nav ul li {
        position: relative;
        z-index: 1;
        -webkit-box-flex: 1;
        -ms-flex: 1 1 0px;
        flex: 1 1 0;
        list-style: none;
        text-decoration: none;
		display: flex;
    justify-content: center;
    align-items: center;
    }
	    .footer-nav ul li button {
        position: relative;
        display: block;
        font-size: 12px;
        text-align: center;
        font-weight: 500;
        text-transform: capitalize;
        line-height: 1;
        color: #1f0757;
        z-index: 1;
		    background: none;
    border: 0px;
    }
	    .footer-nav-area li.active i {
			    color: #fff;
    font-size: 33px;
    position: relative;
     top: -10px;
    right: 1px;
		}
	    .footer-nav-area i {
        font-size: 29px;
        margin-top: 7px;
        margin-bottom: 4px;
    }
	    .footer-nav ul li button span {
        -webkit-transition-duration: 500ms;
        transition-duration: 500ms;
        color: #1f0757;
        display: block;
        margin-top: 0.25rem;
        margin-bottom: 2px;
        font-size: 11px;
        font-weight: bold;
    }
	    .footer-nav.footer-style-two li.active button:before {
        border-radius: 50%;
    position: absolute;
    width: 59px;
    height: 59px;
       top: -15px;
    right: 14px;
    z-index: -10;
    background-color: var(--theme-deafult);
    content: "";
    }
	    .footer-nav ul li.active button span {
        color: var(--theme-deafult);
        width: 73px;
    }
	
	.noshow{
		opacity: 0;
    height: 0;
	width:0;
	overflow:hidden;
	z-index:-1;
	transition: all 0.5s ease-out allow-discrete;
	position:relative;
	}
	.noshow.active{
		z-index:9;
		opacity:1;
        height: auto;
		width:auto;
		transition: all 0.5s ease-out allow-discrete;
	}
	
	.card-body .btn.btn-outline-info,.card-body .btn.btn-outline-info:focus{
		    border-color: var(--theme-deafult);
    color: var(--theme-deafult);
		padding: 18px;
    border-radius: 15px;
	}
	.card-body .btn.btn-outline-info:hover,.card-body .btn.btn-outline-info:active{
		    border-color: var(--theme-deafult);
    color: #fff;
		background-color:var(--theme-deafult2);
	}
	
	.card-body .btn.btn-info,.card-body .btn.btn-info:focus{
		    border-color: var(--theme-deafult);
    color: #fff;
	background-color:var(--theme-deafult);
		border-radios:0.675rem
	}
	.card-body .btn.btn-info:hover,.card-body .btn.btn-info:active{
		    border-color: var(--theme-deafult);
    color: #fff;
		background-color:var(--theme-deafult2);
	}
/***********************footer*/
.btn-info {
	color:#fff;
}

	.loading{
	    position: fixed;
        /* left: calc(50%); */
    top: calc(50% - 42px);
    padding: 30px;
    background: #00000014;
    border-radius: 15px;	
	}	
	 .btn-outline-dark.nohover:hover{
		 
    color: #000;
    background-color: #fff;
    

	 }
html {
    scrollbar-width: thin; 
	 scrollbar-color: #888 #f1f1f1;
}


.card-body{
	scrollbar-width: thin; 
	scrollbar-color: var(--theme-deafult) #f1f1f1;
}
		@media screen and (min-width: 1024px) {
		.card-body{    padding-bottom: 100px;
		}
		.btn-outline-dark{
			font-size:9px;
		}
		#content {
    min-height: 520px;
}
		}
		@media screen and (max-width: 1024px) {
			#content {
    min-height: 520px;
}
		.continre-area{
	width:calc(100vw - 100px);
	max-width: 470px; 
		}
		.card-body{
	-webkit-box-shadow: 0px 0px 7px 0px rgba(130,130,130,.2);
-moz-box-shadow: 0px 0px 7px 0px rgba(130,130,130,.2);
box-shadow: 0px 0px 7px 0px rgba(130,130,130,.2);
	border:0px solid;
	    max-height: 485px;
    overflow: auto;
}
		}
		
		@media screen and (max-width: 767px) {
			#content {
    min-height: 560px;
}
			.card-body{
			        max-height: 700px;
        height: fit-content;
			}
		
			body {
    align-items: flex-start;
	        margin-bottom: -50px;
        max-height: calc(100vh - 50px);
}
		.continre-area{
        width: 100%;
        max-width: 100%;
		        height: calc(100vh - 50px);
        margin-top: 0;
        max-height: unset;
		
		
		
		}
		.container{
			padding-left:0;
			padding-right:0;
		}
		}