/*
#875A7B -> Eggplant
#00A09D -> Green
#fcefdc -> light yellow
*/
@font-face {
font-family: 'Vazir';
/*src: url('fonts/Vazir-FD.eot?#') format('eot');  IE6�8 */
src: url('fonts/Vazir-FD.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
/*src: url('fonts/Vazir-FD.ttf') format('truetype');  Saf3�5, Chrome4+, FF3.5, Opera 10+ */
}
* {
padding: 0;
margin: 0;
outline: 0;
outline: none;
font-family: Vazir, Tahoma;
box-sizing: border-box;
}
input::placeholder {
color: #e5e5e5;
text-align: right;
}
select option:checked, select option:hover {
background: #00A09D;
color: #fff;
}
::-webkit-scrollbar {
width: 5px;
height: 5px;
}
::-webkit-scrollbar-track {
box-shadow: inset 0 0 3px #777;
border-radius: 3px;
}
::-webkit-scrollbar-thumb {
background: #777;
border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
background: #00A09D;
}
::selection {
background: #00A09D;
color: #fff;
}
.ic {
font-size: 20px;
}
.ic.d180 {
transform: rotate(180deg);
}
.ic:hover {
cursor: pointer;
transition: margin-right .5s;
transition: 0.5s;
}
.ic.ibtn {
padding:0 3px;
}
body {
direction: rtl;
font: 12px/24px Vazir, tahoma;
display: flex;
flex-direction: column;
overflow: hidden;
}
a, a:visited, a:hover, a:visited:hover {
text-decoration: none;
color: #00A09D;
}
header {
background: #875A7B;
color: #eee;
height: 45px;
display: inline-flex;
}
header .r-bar {
display: inline-flex;
align-items: center;
padding: 5px;
}
header .r-bar img.logo {
height: 35px;
}
header .r-bar .title {
margin: 5px 0;
}
header .c-bar {
flex-grow: 0;
}
header .l-bar {
display: inline-flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
flex-grow: 1;
padding: 5px;
}
header .l-bar div, header .r-bar div {
padding: 3px 10px;
}
header .l-bar div:hover {
cursor: pointer;
color: #00A09D;
}
main {
display: flex;
flex-direction: row;
justify-content: stretch;
justify-items: stretch;
align-content: stretch;
align-items: stretch;
height: -webkit-calc(100vh - 45px);
height: -moz-calc(100vh - 45px);
height: -o-calc(100vh - 45px);
height: calc(100vh - 45px);
background: #f0f0f0;
}
main aside {
background: #fff;
flex-basis: 260px;
min-width: 260px;
padding: 10px;
margin: 10px;
margin-left: 0;
overflow-y: auto;
border-radius: 10px;
}
main aside.ws-menu ul, main aside ul {
list-style: none;
}
main aside.ws-menu ul li ul {
padding-right: 20px;
display: none;
background: #fbfbfb;
}
main aside.ws-menu ul li ul li ul {
background: #f6f6f6;
}
main aside.ws-menu ul li ul li ul li ul {
background: #f2f2f2;
}
main aside.ws-menu ul li ul li:before {
font-family: FontAwesome;
font-size: 10px;
float: right;
color: #777;
content: "\e3fe";
margin: 3px 0 0 7px;
transform: rotate(90deg);
}
main aside.ws-menu ul li label {
display: block;
padding: 3px 10px 3px 5px;
cursor: pointer;
border-radius:5px;
}
main aside.ws-menu ul li label:hover {
background: #00A09D;
color: #ffffff;
}
main aside.ws-menu ul li label:not(:only-child):after, main aside.ws-menu ul li label:not(:only-child).active:after {
font-family: FontAwesome;
color: #875A7B;
float: left;
}
main aside.ws-menu ul li label:not(:only-child):hover:after, main aside.ws-menu ul li label:not(:only-child).active:hover:after {
color: #ffffff;
}
main aside.ws-menu ul li label:not(:only-child):after {
content: "\f078";
}
main aside.ws-menu ul li label:not(:only-child).active:after {
content: "\f077";
}
main aside.ws-menu div.user-info {
padding-bottom: 10px;
display: flex;
}
main aside.ws-menu div.user-info .photo {
width: 60px;
height: 60px;
border: 3px solid #52b929;
border-radius: 50%;
padding: 3px;
margin-left: 20px;
text-align: center;
}
main aside.ws-menu div.user-info .photo i {
border-radius: 50%;
font-size: 38px;
color: #ddd;
}
main aside.ws-menu div.user-info .photo img {
width: 100%;
height: 100%;
border-radius: 50%;
}
main aside.ws-menu div.user-info div.info {
display: flex;
flex-direction: column;
justify-content: center;
}
main aside.ws-menu div.user-info div.info div.name {
color: #00A09D; font-size:110%;
}
main aside.ws-menu div.user-info div.info div.role {
color: #aaa;
font-size: 90%;
}
main aside.ws-menu div.bar {
display: flex;
flex-direction: row;
align-content: center;
border-bottom: 1px dashed #cccccc;
}
main aside.ws-menu div.bar div {
padding: 3px 10px;
}
main .container {
flex-grow: 1;
background: #fff;
overflow-y: auto;
margin: 10px;
padding: 10px;
border-radius: 10px;
}
main .container div.head {
display: flex;
flex-direction: column;
flex-wrap: wrap;
margin: 10px 0;
border-bottom: 1px dotted #ccc;
}
main .container div.head .title {
flex-grow: 1;
padding: 0 10px 10px;
font-size: 15px;
color: #00A09D;
}
main .container div.head .nav {
display: flex;
flex-direction: row;
}
main .container div.head .nav > li {
padding: 8px 10px;
display: inline-flex;
margin-bottom: 2px;
border-radius:5px;
}
main .container div.head .nav > li:hover {
cursor: pointer;
color: #00A09D;
background: #eeeeee;
}
main .container div.head .nav > li i {
display:flex;
align-items:center;
}
main .container div.head .nav > li i[data-label]::after {
font: 13px/10px Vazir, tahoma;
content: attr(data-label);
margin: 0 5px 0 0;
text-wrap: nowrap;
}
main .container div.head .nav > li.dropdown {
position: relative;
display: inline-block;
}

main .container div.head .nav > li.dropdown ul {
list-style: none;
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 200px;
-webkit-box-shadow: 0 6px 9px rgb(0 0 0 / 15%);
box-shadow: 0 6px 9px rgb(0 0 0 / 15%);
z-index: 1;
margin: 8px -10px 0 0;
border-radius: 5px;
}

main .container div.head .nav > li.dropdown ul li {
color: #000;
padding: 5px 10px;
border-radius: 5px;
}

main .container div.head .nav > li.dropdown ul li:hover {
background: #00A09D;
color: #fff;
}

main .container div.head .nav > li.dropdown:hover ul {
display: block;
}
@media only screen and (max-width: 480px) {
main .container div.head .nav > li i[data-label]::after {
content: '';
}
}
main .container div.panel, div.panel form {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width:100%;
}
main .container div.panel div.sub-header {
width: 100%;
padding: 5px 15px;
margin-top: 5px;
font-size: 15px;
background: #e1e1e1;
color: #00A09D;
}
.login-panel {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100vh;
}
.login-container {
padding: 20px 20px 0;
box-shadow: 0 0 20px -5px #aaa;
width: 330px;
}
.login-container .app-name {
border-bottom: 3px solid #2980b9;
height: 35px;
padding: 5px 2px 2px;
margin: 10px 0 7px 0;
text-align: center;
font-size: 180%;
}
.login-container .logo {
width: 70px;
height: 70px;
margin: 8px auto 0;
background: url('../Files/Image/logo.png') 0px 0px/70px 70px no-repeat;
}
.app-version {
padding: 25px 0 10px;
text-align: center;
font-size: 13px;
}
.login-date {
width: 270px;
background: transparent;
bottom: 55px;
left: 25px;
position: absolute;
text-align: center;
padding: 1px;
font-size: 375%;
color: #444;
line-height: 50px;
text-shadow: 0px 2px 4px rgba(80, 80, 80, 0.4);
}
.login-date[data-caption]:after {
content: attr(data-caption);
}
.ct-footer-bottunbar {
margin: 15px 0 0;
padding: 10px 10px 0 0;
border-top: 1px dotted #dfdfdf;
width: 100%;
}
.btn {
border: 0;
background: #00adff;
color: #ffffff;
padding: 5px 12px;
border-radius: 3px;
min-width: 86px;
text-align: center;
margin: 0 1px 0 0;
}
.btn:hover {
background: #38befe;
cursor: pointer;
}
.btn:disabled,
.btn:disabled:hover {
border: 1px solid #d5d5d5;
background: #ccc !important;
color: #bbb !important;
cursor: not-allowed !important;
}
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
color: #f1f1f1 !important;
}
.btn-success {
background: #4b0 !important;
}
.btn-success:hover {
background: #46a049;
}
.btn-info {
background: #07d !important;
}
.btn-info:hover {
background: #0b7dda;
}
.btn-warning {
background: #ff9800 !important;
}
.btn-warning:hover {
background: #e68a00;
}
.btn-danger {
background: #b00 !important;
}
.btn-danger:hover {
background: #da190b;
}
/* Notice */
ul.notice-list {
list-style: none;
margin: 10px 0;
padding: 10px;
-webkit-box-shadow: 0 6px 9px rgb(0 0 0 / 15%);
box-shadow: 0 6px 9px rgb(0 0 0 / 15%);
line-height: 28px;
width: 100%;
}
ul.notice-list li {
margin: 7px;
}
div.description, ul.description {
list-style: none;
margin: 10px 0;
padding: 10px;
-webkit-box-shadow: 0 6px 9px rgb(0 0 0 / 15%);
box-shadow: 0 6px 9px rgb(0 0 0 / 15%);
width: 100%;
text-align:justify;
}
div.description.c1, ul.description.c1 {
border-right: 3px solid #44cb5a;
}
div.description.c2, ul.description.c2 {
border-right: 3px solid #d44dd7;
}
.light {
color: #999;
}
/* General */
.brk {
flex-basis: 100%;
height: 0;
padding: 0;
margin: 0;
}