body{
	max-width: 1600px;
	margin: 0 auto;
}
.underline{
	text-decoration:underline;
}
.nobold{
	font-weight: normal;
}
.main-footer a{
	font-family:vazir;
}
@font-face {
	font-family: 'vazir';
	src: url('../../fonts/Vazir-FD.eot') format('eot'),
	url('../../fonts/Vazir-FD.woff') format('woff'),
	url('../../fonts/Vazir-FD.ttf') format('truetype');
}
.navy_blue_color{
	color: #07294E;
}
.navy_blue_backcolor{
	background: #07294E;
}
.unbold{
	font-weight: normal;
}
.vazir{
	font-family:vazir;
}
.sidebar-menu li a span,.sidebar-menu li .treeview-menu li a,.btn,.control-label,h1,h2,h3,h4,h5,h6,input[type="text"],textarea,table,tr,td,th,.alert{
	font-family:vazir !important;
}
textarea{
	resize:vertical;
}
.alert {
    margin-top: 5px;
    padding: 5px;
}
.rfloat{
	float:right;
}
.dnone{
	display:none;
}
.gray{
	color:#ccc !important;
}
.tcenter{
	text-align:center;
}
.drtl{
	direction: rtl !important;
}
.tright{
	text-align:right !important;
}
.mauto{
	margin:0 auto;
}
.lfloat{
	float:left;
}
.fbsans{
	font-family:yekan;
}
.dinblock {
	display: inline-block !important;
}
.fsans{
	font-family:bsans;
}
.no-padding{
	padding:0;
}
.position-relative{
	position: relative;
}
.no-padding-left{
	padding-left: 0px !important;
}
.f11px{
	font-size: 11px !important;
}
.f12px{
	font-size: 12px !important;
}
.no-margin{
	margin:0;
}
.no-float{
	float:none;
}
.fbold{
	font-weight:bold;
}
.dblock{
	display:block;
}
.purple1_color{
	color:#70134c;
}
.purple2_color{
	color:#901b63;
}
.purple3_color{
	color:#B34288;
}
.gray_titr{
	color: #878787;
}
.black_titr{
	color: #1b252a;
}
.cpointer{
	cursor:pointer;
}
.dinline{
	display: inline;
}
.ystar{
	color:#ffcc00;
}
.f18px{
	font-size: 18px;
}
.gstar{
	color:#ccc;
}
.open_wrap{
	margin-right:230px;
}
.close_wrap{
	margin-right:0px;
}
.user-panel{	
	margin-top:10px;
}
.alert-danger{
	background: none !important;
	color: red !important;
	border: none;
	margin-bottom: 0px !important;
	margin-top: 0px !important;
}
.content-header h1{
	font-weight:normal;
	font-size:18px;
}
*,.skin-blue .treeview-menu > li > a{
	font-size:12px;
	font-weight:normal;
}
.skin-blue .treeview-menu > li > a{
	margin-right:48px;
}
.control-label{
	font-weight:normal;
}
.col-sm-10 input[type='text']{
	text-align:right;
}
.sidebar-menu li a span{
	font-size:14px;
	padding-right:10px;
}
.sidebar-menu li > a > .pull-right{
	width:35px;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}
.select2-container--default .select2-selection--single{
	border-radius:0px !important;
}
.select2-container .select2-selection--single{
	height: 32px !important;
}
.select2-container .select2-selection--single .select2-selection__rendered{
	padding-right: 0px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
	text-align: right !important;
}
.half_br{
	height: 10px;
}
.select2-results__options{
	text-align: right;
}
.select2-results__options li{
	direction: rtl !important;
}
.select2-container--default .select2-results__option[aria-selected="true"]{
	text-align: right !important;
}
.select2-container {
	z-index: 99999;
}
/* vertical cat css */
.container .row #vertical_cat{
	padding:0px;
	margin-top:20px;
}
#vertical-nav {
    font-size:12px;
    direction:rtl;
    text-align:right;
    z-index:1000;
	padding-right:5px;
}
#vertical-nav ul {
    margin:0px;
    padding:0px;
    *border-top:1px #333 solid;/*IE 7*/
}
ul.vertical-top-level {
    background-color:#ededed;
}
#vertical-nav li {
    list-style:none;
	width:200px;
}
ul.vertical-top-level li {
    border-bottom:#CCC solid 1px;
	width:200px;
}
#vertical-nav span {
    color:#0E504E;
    display:block;    
    height:25px;
    line-height:25px;
    text-decoration:none;
    width:200px;
	cursor:pointer;
}
#vertical-nav li:hover {
    background-color:#ccc;
    position:relative;
}
ul.vertical-sub-level {
    display:none; 
	z-index:9999;
}
li:hover .vertical-sub-level {
    background-color:#666;
    border:#CCC solid 1px;
    display:block;
    position:absolute;
    right:162px;
    top:0px;
}
ul.vertical-sub-level li {
    border:none;
    float:right;
    width:200px;
    *background-color:#666;/*IE 7*/    
}
#vertical-nav .vertical-sub-level {
    background-color:#ededed;
}
#vertical-nav .vertical-sub-level .vertical-sub-level {
    background-color:#ededed;
}
li:hover .vertical-sub-level .vertical-sub-level  {
    display:none;
}
li:hover .vertical-sub-level .vertical-sub-level .vertical-sub-level  {
    display:none;
}
.vertical-sub-level li:hover .vertical-sub-level {
    display:block;
    *left:0px;/*IE 7*/
}
.vertical-sub-level li:hover .vertical-sub-level li:hover .vertical-sub-level {
    display:block;
    *left:0px;/*IE 7*/
}
/* end vertical cat css */
#seller_info{
	display:none;
}
#seller_info,#unit_info{
	border-radius:10px;
	padding:10px;
	background:#ccc;
	margin-top:20px;
	line-height:30px;
}
/* reports */
.input_back{	
	text-align:center;
	float:right;
}
.report_date{
	width:100%;
	text-align:center !important;
}
.report_select{
	height:35px;	
}
.buttons{
	padding-top:20px;
}
.buttons .btn{	
    font-size: 13px;
    height: 35px;
    padding: 6px;
}
.buttons #btn_submit2{	
	margin-right:5px;
}
.container{
	width:100%;			
}
.report_table tbody tr th{
	color:#333;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	text-align:center;
}			
td, th {
	border: 1px solid red; 
} 
table {
	color: #333; /* Lighten up font color */
	font-family: Helvetica, Arial, sans-serif; /* Nicer font */
	/*width: 100% !important;*/
	border-collapse:collapse; 
	border-spacing: 0;
	direction:rtl;
	text-align:center;
}

td, th {
	border: 1px solid #CCC; height: 30px; 
} /* Make cells a bit taller */

th {		
	font-weight: bold; /* Make sure they're bold */
}

td {		
	text-align: center; /* Center our text */
}
table {
	color: #333;
	font-family: Helvetica, Arial, sans-serif;
	/*width: 640px;*/
	border-collapse:
	collapse; border-spacing: 0;		
}		
td, th {
	border: 1px solid transparent; /* No more visible border */
	height: 30px;
	transition: all 0.3s;  /* Simple transition for hover effect */
}
th {		
	font-weight: normal;
	text-align: center;
	padding:5px;
}
th input[type="text"] {
	width:40px;			
	float:none;
	margin:0 auto;
	text-align:center;
}
td {		
	text-align: center;
}
tr.head th{
	background:#ccc;
}

/* print order */
.print_container{
	border:1px solid #000;
	margin:0 auto;
	float:none;
	text-align:center;
	margin-top:20px;
}
.print_container h3{
	float:right;
}
.print_container #final_price{
	font-size:18px;
}
#print_btn_back{	
	margin:0 auto;
	float:none;
	text-align:center;
	height:100px;
	padding-top:10px;
}
#print_btn_back #btn_print{
	float:none;
}
#alert_back{	
	text-align:right;
}
#alert_back h6{
	float:right;
	margin-right:5px;
}
#alert_back button.btn{
	width:150px;
	float:right;
	margin-right:10px;
	margin-top:5px
}
/* report */
.input_back button{
	font-size:12px;
	min-width:100px;
	margin-right:5px;
}
.shop_back{
	margin-top:10px;
	height:300px;
	border:1px solid #ccc;
	background:#fff;
	padding:10px;
}
.ptitle{
	font-size:14px;
	text-align:center;
	margin-bottom:10px;
	padding:10px;
}
#cat_img_preview{
	max-height: 100px;
}
.shop_back{
	margin-top:10px;
	height:300px;
	border:1px solid #ccc;
	background:#fff;
	padding:10px;
}
.ptitle{
	font-size:14px;
	text-align:center;
	margin-bottom:10px;
	padding:10px;
}
#user_img_preview{
	max-width: 300px;
}
.red{
	color: red !important;
}
.operation{
	font-size: 16px;
}
.zindex1{
	z-index: 1;
}
.white_back{
	background: #fff;
	-webkit-box-shadow: 3px 3px 5px 6px #ccc;  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
	-moz-box-shadow:    3px 3px 5px 6px #ccc;  /* Firefox 3.5 - 3.6 */
	box-shadow:         3px 3px 5px 6px #ccc;
}
.drop_op{
	position: relative;
}
.project_container{
	background: #fff;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 5px;
	border:1px solid #ccc;
	padding: 15px;
}
.circle {
	/*width: 200px;*/
	/*margin: 6px 20px 20px;*/
	display: inline-block;
	position: relative;
	text-align: center;
	vertical-align: top;
}
.circle strong {
	position: absolute;
	top: 10px;
	left: 0;
	width: 100%;
	text-align: center;
	line-height: 26px;
	font-size: 20px;
}
.circle strong small{
	font-size: 16px;
}
.circle strong .percent{
	position: absolute;
	top: 1px;
}
.circle strong .circle_txt{
	font-size: 12px;
	position: absolute;
	left:0;
	right:0;
	top:70px;
	margin-left:auto;
	margin-right:auto;
	/*overflow: hidden;*/
	/*text-overflow: ellipsis;*/
	/*white-space: nowrap;*/
	display: block;
	display: -webkit-box;
	max-width: 200px;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.circle strong .score{
	position: absolute;
	top: 10px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
}
table .fa-edit{
	color: #129794;
}
table .fa-trash,table .fa-trash-o{
	color: #c61026;
}
.project_logo{
	box-shadow:4px 5px 5px -2px rgba(176,170,176,1)
}
.project_msg{
	height: 70px;
	overflow: hidden;
}
.btn_green{
	background: #77C426;
	color: #fff;
}
.sharjed,.sharjed span,.sended_sms,.sended_sms span{
	font-size: 16px;
}
.sharjed span.number,.sended_sms span.number{
	font-size: 18px;
}
.sms_container,.employe_container{
	min-height: 330px;
}
.border-shadow-left{
	border-left-width: 1px;
	border-left-style: solid;
	border-image:linear-gradient(to top,#eee,#ccc,#eee) 1 100%;
}
.abs_more_btn{
	position: absolute;
	left: 15px;
	bottom: 15px;
}
.all_project{
	background: #F5f1f1;
	padding: 15px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
.trash_color{
	color: #c61026;
}
.warning_color{
	color: #Fcc116;
}
.pro_desc{
	line-height: 30px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
	background: #39CCCC !important;
	padding: 5px 5px 5px 5px !important;
	border-color: #fff;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
	float: right;
	color: #1c1c1c;
	font-size: 16px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
	float: right;
}


/*= input focus effects css
=========================== */
:focus{outline: none;}

input[type="text"]{width: 100%; }

.effect-1,
.effect-2,
.effect-3{border: 0; padding: 7px 0; border-bottom: 1px solid #ccc;}

.effect-1 ~ .focus-border{position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background-color: #3399FF; transition: 0.4s;}
.effect-1:focus ~ .focus-border{width: 100%; transition: 0.4s;}

.effect-2 ~ .focus-border{position: absolute; bottom: 0; left: 50%; width: 0; height: 2px; background-color: #3399FF; transition: 0.4s;}
.effect-2:focus ~ .focus-border{width: 100%; transition: 0.4s; left: 0;}

.effect-3 ~ .focus-border{position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; z-index: 99;}
.effect-3 ~ .focus-border:before,
.effect-3 ~ .focus-border:after{content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 100%; background-color: #3399FF; transition: 0.4s;}
.effect-3 ~ .focus-border:after{left: auto; right: 0;}
.effect-3:focus ~ .focus-border:before,
.effect-3:focus ~ .focus-border:after{width: 50%; transition: 0.4s;}

.effect-4,
.effect-5,
.effect-6{border: 0; padding: 5px 0 7px; border: 1px solid transparent; border-bottom-color: #ccc; transition: 0.4s;}

.effect-4:focus,
.effect-5:focus,
.effect-6:focus{padding: 5px 14px 7px; transition: 0.4s;}

.effect-4 ~ .focus-border{position: absolute; height: 0; bottom: 0; left: 0; width: 100%; transition: 0.4s; z-index: -1;}
.effect-4:focus ~ .focus-border{transition: 0.4s; height: 36px; border: 2px solid #3399FF; z-index: 1;}

.effect-5 ~ .focus-border{position: absolute; height: 36px; bottom: 0; left: 0; width: 0; transition: 0.4s;}
.effect-5:focus ~ .focus-border{width: 100%; transition: 0.4s; border: 2px solid #3399FF;}

.effect-6 ~ .focus-border{position: absolute; height: 36px; bottom: 0; right: 0; width: 0; transition: 0.4s;}
.effect-6:focus ~ .focus-border{width: 100%; transition: 0.4s; border: 2px solid #3399FF;}

.effect-7,
.effect-8,
.effect-9{border: 1px solid #ccc; padding: 7px 14px 9px; transition: 0.4s;}

.effect-7 ~ .focus-border:before,
.effect-7 ~ .focus-border:after{content: ""; position: absolute; top: 0; left: 50%; width: 0; height: 2px; background-color: #3399FF; transition: 0.4s;}
.effect-7 ~ .focus-border:after{top: auto; bottom: 0;}
.effect-7 ~ .focus-border i:before,
.effect-7 ~ .focus-border i:after{content: ""; position: absolute; top: 50%; left: 0; width: 2px; height: 0; background-color: #3399FF; transition: 0.6s;}
.effect-7 ~ .focus-border i:after{left: auto; right: 0;}
.effect-7:focus ~ .focus-border:before,
.effect-7:focus ~ .focus-border:after{left: 0; width: 100%; transition: 0.4s;}
.effect-7:focus ~ .focus-border i:before,
.effect-7:focus ~ .focus-border i:after{top: 0; height: 100%; transition: 0.6s;}

.effect-8 ~ .focus-border:before,
.effect-8 ~ .focus-border:after{content: ""; position: absolute; top: 0; left: 0; width: 0; height: 2px; background-color: #3399FF; transition: 0.3s;}
.effect-8 ~ .focus-border:after{top: auto; bottom: 0; left: auto; right: 0;}
.effect-8 ~ .focus-border i:before,
.effect-8 ~ .focus-border i:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: #3399FF; transition: 0.4s;}
.effect-8 ~ .focus-border i:after{left: auto; right: 0; top: auto; bottom: 0;}
.effect-8:focus ~ .focus-border:before,
.effect-8:focus ~ .focus-border:after{width: 100%; transition: 0.3s;}
.effect-8:focus ~ .focus-border i:before,
.effect-8:focus ~ .focus-border i:after{height: 100%; transition: 0.4s;}

.effect-9 ~ .focus-border:before,
.effect-9 ~ .focus-border:after{content: ""; position: absolute; top: 0; right: 0; width: 0; height: 2px; background-color: #3399FF; transition: 0.2s; transition-delay: 0.2s;}
.effect-9 ~ .focus-border:after{top: auto; bottom: 0; right: auto; left: 0; transition-delay: 0.6s;}
.effect-9 ~ .focus-border i:before,
.effect-9 ~ .focus-border i:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: #3399FF; transition: 0.2s;}
.effect-9 ~ .focus-border i:after{left: auto; right: 0; top: auto; bottom: 0; transition-delay: 0.4s;}
.effect-9:focus ~ .focus-border:before,
.effect-9:focus ~ .focus-border:after{width: 100%; transition: 0.2s; transition-delay: 0.6s;}
.effect-9:focus ~ .focus-border:after{transition-delay: 0.2s;}
.effect-9:focus ~ .focus-border i:before,
.effect-9:focus ~ .focus-border i:after{height: 100%; transition: 0.2s;}
.effect-9:focus ~ .focus-border i:after{transition-delay: 0.4s;}

.effect-10,
.effect-11,
.effect-12,
.effect-13,
.effect-14,
.effect-15{border: 0; padding: 7px 15px; border: 1px solid #ccc; position: relative; background: transparent;}

.effect-10 ~ .focus-bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #ededed; opacity: 0; transition: 0.5s; z-index: -1;}
.effect-10:focus ~ .focus-bg{transition: 0.5s; opacity: 1;}

.effect-11 ~ .focus-bg{position: absolute; left: 0; top: 0; width: 0; height: 100%; background-color: #ededed; transition: 0.3s; z-index: -1;}
.effect-11:focus ~ .focus-bg{transition: 0.3s; width: 100%;}

.effect-12 ~ .focus-bg{position: absolute; left: 50%; top: 0; width: 0; height: 100%; background-color: #ededed; transition: 0.3s; z-index: -1;}
.effect-12:focus ~ .focus-bg{transition: 0.3s; width: 100%; left: 0;}

.effect-13 ~ .focus-bg:before,
.effect-13 ~ .focus-bg:after{content: ""; position: absolute; left: 0; top: 0; width: 0; height: 100%; background-color: #ededed; transition: 0.3s; z-index: -1;}
.effect-13:focus ~ .focus-bg:before{transition: 0.3s; width: 50%;}
.effect-13 ~ .focus-bg:after{left: auto; right: 0;}
.effect-13:focus ~ .focus-bg:after{transition: 0.3s; width: 50%;}

.effect-14 ~ .focus-bg:before,
.effect-14 ~ .focus-bg:after{content: ""; position: absolute; left: 0; top: 0; width: 0; height: 0; background-color: #ededed; transition: 0.3s; z-index: -1;}
.effect-14:focus ~ .focus-bg:before{transition: 0.3s; width: 50%; height: 100%;}
.effect-14 ~ .focus-bg:after{left: auto; right: 0; top: auto; bottom: 0;}
.effect-14:focus ~ .focus-bg:after{transition: 0.3s; width: 50%; height: 100%;}

.effect-15 ~ .focus-bg:before,
.effect-15 ~ .focus-bg:after{content: ""; position: absolute; left: 50%; top: 50%; width: 0; height: 0; background-color: #ededed; transition: 0.3s; z-index: -1;}
.effect-15:focus ~ .focus-bg:before{transition: 0.3s; width: 50%; left: 0; top: 0; height: 100%;}
.effect-15 ~ .focus-bg:after{left: auto; right: 50%; top: auto; bottom: 50%;}
.effect-15:focus ~ .focus-bg:after{transition: 0.3s; width: 50%; height: 100%; bottom: 0; right: 0;}


.effect-16,
.effect-17,
.effect-18{border: 0; padding: 4px 0; border-bottom: 1px solid #ccc; background-color: transparent;}

.effect-16 ~ .focus-border{position: absolute; bottom: 0; right: 0; width: 0;top:30px; height: 2px; background-color: #3399FF; transition: 0.4s;}
.effect-16:focus ~ .focus-border,
.has-content.effect-16 ~ .focus-border{width: 100%; transition: 0.4s;}
.effect-16 ~ label{position: absolute; right: 30px;  top: 3px; color: #aaa; transition: 0.3s; z-index: -1;font-size: 14px;}
.effect-16 ~ i{
	position: absolute;
	right: 0px;
	top: 9px;
	font-size: 18px;
}
.effect-16:focus ~ label, .has-content.effect-16 ~ label{top: -12px; font-size: 12px; color: #3399FF; transition: 0.3s;}

.effect-17 ~ .focus-border{position: absolute; bottom: 0; left: 50%; width: 0; height: 2px; background-color: #3399FF; transition: 0.4s;}
.effect-17:focus ~ .focus-border,
.has-content.effect-17 ~ .focus-border{width: 100%; transition: 0.4s; left: 0;}
.effect-17 ~ label{position: absolute; left: 0; width: 100%; top: 9px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-17:focus ~ label, .has-content.effect-17 ~ label{top: -16px; font-size: 12px; color: #3399FF; transition: 0.3s;}

.effect-18 ~ .focus-border{position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; z-index: 99;}
.effect-18 ~ .focus-border:before,
.effect-18 ~ .focus-border:after{content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 100%; background-color: #3399FF; transition: 0.4s;}
.effect-18 ~ .focus-border:after{left: auto; right: 0;}
.effect-18:focus ~ .focus-border:before,
.effect-18:focus ~ .focus-border:after,
.has-content.effect-18 ~ .focus-border:before,
.has-content.effect-18 ~ .focus-border:after{width: 50%; transition: 0.4s;}
.effect-18 ~ label{position: absolute; left: 0; width: 100%; top: 9px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-18:focus ~ label, .has-content.effect-18 ~ label{top: -16px; font-size: 12px; color: #3399FF; transition: 0.3s;}

.effect-19,
.effect-20,
.effect-21{border: 1px solid #ccc; padding: 7px 14px; transition: 0.4s; background: transparent;}

.effect-19 ~ .focus-border:before,
.effect-19 ~ .focus-border:after{content: ""; position: absolute; top: -1px; left: 50%; width: 0; height: 2px; background-color: #3399FF; transition: 0.4s;}
.effect-19 ~ .focus-border:after{top: auto; bottom: 0;}
.effect-19 ~ .focus-border i:before,
.effect-19 ~ .focus-border i:after{content: ""; position: absolute; top: 50%; left: 0; width: 2px; height: 0; background-color: #3399FF; transition: 0.6s;}
.effect-19 ~ .focus-border i:after{left: auto; right: 0;}
.effect-19:focus ~ .focus-border:before,
.effect-19:focus ~ .focus-border:after,
.has-content.effect-19 ~ .focus-border:before,
.has-content.effect-19 ~ .focus-border:after{left: 0; width: 100%; transition: 0.4s;}
.effect-19:focus ~ .focus-border i:before,
.effect-19:focus ~ .focus-border i:after,
.has-content.effect-19 ~ .focus-border i:before,
.has-content.effect-19 ~ .focus-border i:after{top: -1px; height: 100%; transition: 0.6s;}
.effect-19 ~ label{position: absolute; left: 14px; width: 100%; top: 10px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-19:focus ~ label, .has-content.effect-19 ~ label{top: -18px; left: 0; font-size: 12px; color: #3399FF; transition: 0.3s;}

.effect-20 ~ .focus-border:before,
.effect-20 ~ .focus-border:after{content: ""; position: absolute; top: 0; left: 0; width: 0; height: 2px; background-color: #3399FF; transition: 0.3s;}
.effect-20 ~ .focus-border:after{top: auto; bottom: 0; left: auto; right: 0;}
.effect-20 ~ .focus-border i:before,
.effect-20 ~ .focus-border i:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: #3399FF; transition: 0.4s;}
.effect-20 ~ .focus-border i:after{left: auto; right: 0; top: auto; bottom: 0;}
.effect-20:focus ~ .focus-border:before,
.effect-20:focus ~ .focus-border:after,
.has-content.effect-20 ~ .focus-border:before,
.has-content.effect-20 ~ .focus-border:after{width: 100%; transition: 0.3s;}
.effect-20:focus ~ .focus-border i:before,
.effect-20:focus ~ .focus-border i:after,
.has-content.effect-20 ~ .focus-border i:before,
.has-content.effect-20 ~ .focus-border i:after{height: 100%; transition: 0.4s;}
.effect-20 ~ label{position: absolute; left: 14px; width: 100%; top: 10px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-20:focus ~ label, .has-content.effect-20 ~ label{top: -18px; left: 0; font-size: 12px; color: #3399FF; transition: 0.3s;}

.effect-21 ~ .focus-border:before,
.effect-21 ~ .focus-border:after{content: ""; position: absolute; top: 0; right: 0; width: 0; height: 2px; background-color: #3399FF; transition: 0.2s; transition-delay: 0.2s;}
.effect-21 ~ .focus-border:after{top: auto; bottom: 0; right: auto; left: 0; transition-delay: 0.6s;}
.effect-21 ~ .focus-border i:before,
.effect-21 ~ .focus-border i:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: #3399FF; transition: 0.2s;}
.effect-21 ~ .focus-border i:after{left: auto; right: 0; top: auto; bottom: 0; transition-delay: 0.4s;}
.effect-21:focus ~ .focus-border:before,
.effect-21:focus ~ .focus-border:after,
.has-content.effect-21 ~ .focus-border:before,
.has-content.effect-21 ~ .focus-border:after{width: 100%; transition: 0.2s; transition-delay: 0.6s;}
.effect-21:focus ~ .focus-border:after,
.has-content.effect-21 ~ .focus-border:after{transition-delay: 0.2s;}
.effect-21:focus ~ .focus-border i:before,
.effect-21:focus ~ .focus-border i:after,
.has-content.effect-21 ~ .focus-border i:before,
.has-content.effect-21 ~ .focus-border i:after{height: 100%; transition: 0.2s;}
.effect-21:focus ~ .focus-border i:after,
.has-conten.effect-21 ~ .focus-border i:after{transition-delay: 0.4s;}
.effect-21 ~ label{position: absolute; left: 14px; width: 100%; top: 10px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-21:focus ~ label, .has-content.effect-21 ~ label{top: -18px; left: 0; font-size: 12px; color: #3399FF; transition: 0.3s;}

.effect-22,
.effect-23,
.effect-24{border: 0; padding: 7px 15px; border: 1px solid #ccc; position: relative; background: transparent;}

.effect-22 ~ .focus-bg{position: absolute; left: 0; top: 0; width: 0; height: 100%; background-color: transparent; transition: 0.4s; z-index: -1;}
.effect-22:focus ~ .focus-bg,
.has-content.effect-22 ~ .focus-bg{transition: 0.4s; width: 100%; background-color: #ededed;}
.effect-22 ~ label{position: absolute; left: 14px; width: 100%; top: 10px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-22:focus ~ label, .has-content.effect-22 ~ label{top: -18px; left: 0; font-size: 12px; color: #333; transition: 0.3s;}

.effect-23 ~ .focus-bg:before,
.effect-23 ~ .focus-bg:after{content: ""; position: absolute; left: 0; top: 0; width: 0; height: 0; background-color: #ededed; transition: 0.3s; z-index: -1;}
.effect-23:focus ~ .focus-bg:before,
.has-content.effect-23 ~ .focus-bg:before{transition: 0.3s; width: 50%; height: 100%;}
.effect-23 ~ .focus-bg:after{left: auto; right: 0; top: auto; bottom: 0;}
.effect-23:focus ~ .focus-bg:after,
.has-content.effect-23 ~ .focus-bg:after{transition: 0.3s; width: 50%; height: 100%;}
.effect-23 ~ label{position: absolute; left: 14px; width: 100%; top: 10px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-23:focus ~ label, .has-content.effect-23 ~ label{top: -18px; left: 0; font-size: 12px; color: #333; transition: 0.3s;}

.effect-24 ~ .focus-bg:before,
.effect-24 ~ .focus-bg:after{content: ""; position: absolute; left: 50%; top: 50%; width: 0; height: 0; background-color: #ededed; transition: 0.3s; z-index: -1;}
.effect-24:focus ~ .focus-bg:before,
.has-content.effect-24 ~ .focus-bg:before{transition: 0.3s; width: 50%; left: 0; top: 0; height: 100%;}
.effect-24 ~ .focus-bg:after{left: auto; right: 50%; top: auto; bottom: 50%;}
.effect-24:focus ~ .focus-bg:after,
.has-content.effect-24 ~ .focus-bg:after{transition: 0.3s; width: 50%; height: 100%; bottom: 0; right: 0;}
.effect-24 ~ label{position: absolute; left: 14px; width: 100%; top: 10px; color: #aaa; transition: 0.3s; z-index: -1; }
.effect-24:focus ~ label, .has-content.effect-24 ~ label{top: -18px; left: 0; font-size: 12px; color: #333; transition: 0.3s;}
/*= input focus effects css End
=============================== */
#remember { display: none; }

#remember + label {
	display: inline-block;
	position: relative;
	padding-right: 25px;
	margin-bottom: 10px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	text-align: right;
}

#remember + label:last-child { margin-bottom: 0; }

#remember + label:before {
	content: '';
	display: block;
	width: 15px;
	height: 15px;
	border: 2px solid #06284C;
	position: absolute;
	right: 0;
	top: 7px;
	-webkit-transition: all .12s, border-color .08s;
	transition: all .12s, border-color .08s;
}

#remember:checked + label:before {
	width: 10px;
	top: 0px;
	right: 5px;
	border-radius: 0;
	opacity: 1;
	border-top-color: transparent;
	border-left-color: transparent;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
#login_title{
	font-size: 16px;
}
#main_menu li{
	float: right !important
}
.glass{
	background: rgba(0,0,0,0.5);
	color: #fff;
	text-align: justify;
	direction: rtl;
	line-height: 35px;
}
.login_footer{
	position: absolute;
	bottom: 20px;
	border-top: 1px solid #807878;
}
.lbl_input{
	cursor: text;
}
#main_menu li:not(.active) a{
	color: #fff;
}
#main_menu li:not(.active) a:hover{
	background: #8a8a8c;
}

/*index*/
.cat_back{
	animation-duration: 3s;
}
.circle_link:hover{
	color: #3c8dbc;
}
.cat_box{
	min-height: 160px;
	width: 100%;
}
.cat_box .circle{
	width: 100%;
}
.gray_hr{
	border-color: #d7c6d0;
}
.btn_login{
	height: 40px;
}
#login-form,#verify_form,#forgot_pass_form{
	line-height: 30px;
}
.login_footer{
	/*position: absolute;*/
	/*bottom: 0px;*/
}
#login_form{
	/*height: 100%;*/
}
.nav-tabs{
	border-color: #807878;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover{
	background-color: rgba(1,1,1,0.4);
	color: #fff;
	border-color: #807878;
}
.nav-tabs > li > a:hover{
	border-color: #807878;
}
@media (max-width:992px){
	.cat_back{
		float: right;
	}
}
@media (max-width:768px){
	.effect-16{
		color: #fff;
	}
	.border-shadow-left{
		border-left:none;
	}
	#login_back{
		min-height: unset;
	}
	.effect-16 ~ label{
		top: 0px;
		z-index: 2;
	}
	.navy_blue_color{
		color: #98C3F0;
	}
	#remember + label::before{
		border-color: #98C3F0;
		top: 9px;
	}
	#forgot_label{
		float: left;
	}
	.login_footer{
		position: unset;
		text-align: center;
	}
	.no-padding-xs{
		padding: 0;
	}
	#cat_canvas{
		min-height: 250px;
	}
	#canvas-holder{
		overflow: scroll;
	}
	#sanabad_logo{
		border-radius: 10px;
	}
}