* {
	padding: 0;
	margin: 0;
	color: #1a1f36;
	box-sizing: border-box;
	word-wrap: break-word;
	/*font-family: masih, -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Ubuntu,sans-serif;
    */
	font-family: masih, Lalezar;
}

/*
  Masih
  */
@font-face {
	font-family: masih;
	src: url(../inc/vazir.woff);
}

.important {
    color:red;
}

.error {
	color: #aa0030;
}

.successful {
	color: #11b044;
}

.copyright {
	font-size: 1em !important;
}

#copyright {
    font-size: 1em !important;
}

table {
	text-align: center;
}

.table {
	width: 100%;
	margin-bottom: 1rem;
	color: #212529;
}

.table th,
.table td {
	padding: 0.75rem;
	vertical-align: top;
	border-top: 1px solid #dee2e6;
}

.table-striped tbody tr:nth-of-type(odd) {
	background-color: rgba(0, 0, 0, 0.05);
}

.table-bordered {
	border: 1px solid #dee2e6;
}

.table-bordered th,
.table-bordered td {
	border: 1px solid #dee2e6;
}

.table-bordered thead th,
.table-bordered thead td {
	border-bottom-width: 2px;
}

@media only screen and (max-width: 600px) {
    /*.formbg.admin {*/
    /*    background-color:red;*/
    /*    max-width:90vw;*/
    /*}*/
    .formbg.admin {
        max-width:90vw;
        /*background-color:red;*/

    }
    
    .formbg.user {
        max-width:90vw;
    }
    
    .formbg.ghioo {
        background-color:red;
    }
    img {
    width: 45%;
    margin: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    }
}

@media only screen and (min-width: 600px) {
    /*.formbg.admin {*/
    /*    background-color:red;*/
    /*    max-width:90vw;*/
    /*}*/
    .formbg.admin {
        /*max-width:90vw;*/
        max-width:50vw;
    }
    
    img {
        width: 15%;
        margin: auto;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
}

div.tbl {
    overflow-x:auto;
}

/*
  Masih
  */
body {
	min-height: 100%;
	background-color: #ffffff;
}

h1 {
	letter-spacing: -1px;
}

a {
	color: #5469d4;
	text-decoration: unset;
}

.login-root {
	direction: rtl;
	background: #fff;
	display: flex;
	width: 100%;
	min-height: 100vh;
	overflow: hidden;
}

.loginbackground {
	min-height: 692px;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	top: 0;
	z-index: 0;
	overflow: hidden;
}

.flex-flex {
	display: flex;
}

.align-center {
	align-items: center;
}

.center-center {
	align-items: center;
	justify-content: center;
}

.box-root {
	box-sizing: border-box;
}

.flex-direction--column {
	-ms-flex-direction: column;
	flex-direction: column;
}

.loginbackground-gridContainer {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: [start] 1fr [left-gutter] (86.6px)[16] [left-gutter] 1fr [end];
	grid-template-columns: [start] 1fr [left-gutter] repeat(16, 86.6px) [left-gutter] 1fr [end];
	-ms-grid-rows: [top] 1fr [top-gutter] (64px)[8] [bottom-gutter] 1fr [bottom];
	grid-template-rows: [top] 1fr [top-gutter] repeat(8, 64px) [bottom-gutter] 1fr [bottom];
	justify-content: center;
	margin: 0 -20%;
	transform: rotate(-12deg) skew(-12deg);
}

.box-divider--light-all-2 {
	box-shadow: inset 0 0 0 2px #e3e8ee;
}

.box-background--blue {
	background-color: #5469d4;
}

.box-background--white {
	background-color: #ffffff;
}

.box-background--blue800 {
	background-color: #212d63;
}

.box-background--gray100 {
	background-color: #e3e8ee;
}

.box-background--cyan200 {
	background-color: #7fd3ed;
}

.padding-top--64 {
	padding-top: 64px;
}

.padding-top--24 {
	padding-top: 24px;
}

.padding-top--48 {
	padding-top: 48px;
}

.padding-bottom--24 {
	padding-bottom: 24px;
}

/*
Masih
*/
.padding-bottom--8 {
	padding-bottom: 8px;
}
/*
Masih
*/


.padding-horizontal--48 {
	padding: 48px;
}

.padding-bottom--15 {
	padding-bottom: 15px;
}

.flex-justifyContent--center {
	-ms-flex-pack: center;
	justify-content: center;
}

/*
  Masih
  */
.formbg.admin {
    /*max-width: 50vw;*/
    /*max-width: 448px;*/
    /*max-width:448px;*/
    /*max-width:290vw;*/
    
    /*max-width:50vw;*/
}
  
/*
    Masih
*/

.formbg {
	margin: 0px auto;
	width: 100%;
	max-width: 448px;
	/* Masih */
	/*max-width: 448px;*/
	/* Masih */
	background: white;
	border-radius: 10px;
	box-shadow: rgba(60, 66, 87, 0.12) 0px 7px 14px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px 0px;
	
	/*
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	*/
}

span {
	display: block;
	font-size: 20px;
	line-height: 28px;
	color: #1a1f36;
}

label {
	margin-bottom: 20px;
}

.reset-pass a,
label {
	font-size: 20px;
	font-weight: 600;
	display: block;
}

.reset-pass>a {
	text-align: right;
	margin-bottom: 10px;
}

.grid--50-50 {
	display: grid;
	grid-template-columns: 50% 50%;
	align-items: center;
}

.btn {
	color: white;
	direction: ltr;
	font-size: 16px;
	line-height: 28px;
	padding: 8px 16px;
	width: 100%;
	min-height: 44px;
	border: unset;
	border-radius: 4px;
	outline-color: rgb(84 105 212 / 0.5);
	background-color: green;
	box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(60, 66, 87, 0.16) 0px 0px 0px 1px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px;
}

/*
    Masih
*/
select {
	font-size: 16px;
	line-height: 28px;
	padding: 8px 16px;
	width: 100%;
	min-height: 44px;
	border: unset;
	border-radius: 4px;
	outline-color: rgb(84 105 212 / 0.5);
	background-color: rgb(255, 255, 255);
	box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(60, 66, 87, 0.16) 0px 0px 0px 1px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px;
}

input[type=text]:read-only {
  background: #dddddd;
}

/*
    Masih
*/

.field input {
	/*direction: ltr;*/
	font-size: 16px;
	line-height: 28px;
	padding: 8px 16px;
	width: 100%;
	min-height: 44px;
	border: unset;
	border-radius: 4px;
	outline-color: rgb(84 105 212 / 0.5);
	background-color: rgb(255, 255, 255);
	box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(60, 66, 87, 0.16) 0px 0px 0px 1px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px;
}

input[type="submit"] {
	background-color: rgb(84, 105, 212);
	box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0.12) 0px 1px 1px 0px,
		rgb(84, 105, 212) 0px 0px 0px 1px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(60, 66, 87, 0.08) 0px 2px 5px 0px;
	color: #fff;
	font-size: 25px;
	cursor: pointer;
}

.field-checkbox input {
	width: 20px;
	height: 15px;
	margin-right: 5px;
	box-shadow: unset;
	min-height: unset;
}

.field-checkbox label {
	display: flex;
	align-items: center;
	margin: 0;
}

a.ssolink {
	display: block;
	text-align: center;
	font-weight: 600;
}

.footer-link span {
	font-size: 20px;
	text-align: center;
}

.listing a {
	color: #aa0030;
	font-weight: 600;
	margin: 0 10px;
}

.animationRightLeft {
	animation: animationRightLeft 2s ease-in-out infinite;
}

.animationLeftRight {
	animation: animationLeftRight 2s ease-in-out infinite;
}

.tans3s {
	animation: animationLeftRight 3s ease-in-out infinite;
}

.tans4s {
	animation: animationLeftRight 4s ease-in-out infinite;
}

@keyframes animationLeftRight {
	0% {
		transform: translateX(0px);
	}

	50% {
		transform: translateX(1000px);
	}

	100% {
		transform: translateX(0px);
	}
}

@keyframes animationRightLeft {
	0% {
		transform: translateX(0px);
	}

	50% {
		transform: translateX(-1000px);
	}

	100% {
		transform: translateX(0px);
	}
}

/*
Masih OLD NAVBAR

.navtop {
	background-color: rgb(84, 105, 212);
	height: 60px;
	width: 100%;
	border: 0;
}
.navtop div {
	display: flex;
	margin: 0 auto;
	width: 1000px;
	height: 100%;
}
.navtop div h1, .navtop div a, .navtop span {
	display: inline-flex;
	align-items: center;
}
.navtop div h1, .navtop span {
	flex: 1;
	font-size: 24px;
	padding: 0;
	margin: 0;
	color: #FFF;
	font-weight: normal;
}
.navtop div a {
	padding: 0 20px;
	text-decoration: none;
	color: #FFF;
	font-weight: bold;
}
.navtop div a i {
	padding: 0px 12px 0px 8px;
	color: #FFF;
}
.navtop div a:hover {
	color: #54d4b1;
}
*/
/*Masih New NAVBAR*/
.nav {
    z-index:2;
}

i {
    color:#f0f0f0;
    padding-left:10px;
}

.active i {
    color:#005f5f;
    padding-left:10px;
}


.nav ul {
  direction: rtl;
  list-style: none;
  background-color: rgb(84, 105, 212);
  text-align: center;
  padding-right: 0;
  margin: 0;
  font-size: .8em;
}

.nav h2 {
    display: block;
  text-align: center;
  background-color: rgb(84, 105, 212);
  color:#FFF;
}

.nav p {
    display:block;
    text-align:center;
    background-color:rgb(84, 105, 212);
    color:#FFF;
}

.nav li {
  font-size: 1.2em;
  line-height: 40px;
  height: 40px;
  /*border-bottom: 1px solid #888;*/
}
 
.nav a {
  text-decoration: none;
  color: #fff;
  display: block;
  transition: .7s background-color;
}
 
.nav a:hover {
  background-color: #005f5f;
}
 
.nav a.active {
  background-color: #fff;
  color: #005f5f;
  cursor: default;
}
 
@media screen and (min-width: 600px) {
  .nav li {
    width: 120px;
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
  }
 
  .nav li {
    display: inline-block;
    margin-right: -4px;
  }
  
  ul li{
  margin-left: 50px;
    }
    
    /*MASIHREYHANI*/
    input[type="submit"] {
	/*background-color: green;*/
	box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0.12) 0px 1px 1px 0px,
		rgb(84, 105, 212) 0px 0px 0px 1px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(60, 66, 87, 0.08) 0px 2px 5px 0px;
	color: #FFF;
	font-size: 16px;
	cursor: pointer;
    }
  
}

/*MASIHREYHANI*/
@media screen and (max-width: 600px) {
    input[type="submit"] {
	/*background-color: green;*/
	box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0.12) 0px 1px 1px 0px,
		rgb(84, 105, 212) 0px 0px 0px 1px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(60, 66, 87, 0.08) 0px 2px 5px 0px;
	color: #FFF;
	font-size: 16px;
	cursor: pointer;
    }  
}

/*
Masih
*/
.birthday {
    background-color:#FAED27;
}

.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: right;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
}

.selected, .accordion:hover {
  background-color: #ccc;
}

.accordion:after {
  content: '\002B';
  color: #777;
  font-weight: bold;
  float: left;
  margin-left: 5px;
}

.selected:after {
  content: "\2212";
}

.panel {
  padding: 0 18px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}