﻿
@font-face {
    font-family: 'yekan';
    src: url('../fonts/Yekan-modified.eot');
    src: url('../fonts/Yekan-modified.eot#iefix') format('embedded-opentype'),
         url('../fonts/Yekan-modified.woff') format('woff'),
         url('../fonts/Yekan-modified.ttf') format('truetype'),
         url('../fonts/Yekan-modified.svg#CartoGothicStdBook') format('svg');
    font-weight: normal;
    font-style: normal;
}

.terror {
    padding: 10px 0px;
    text-align: center;
    color: red;
    display: none;
}


/*----------------------------------------------------------*/
section.collapsible
{
    margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 7px;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05);
  box-shadow: 0 1px 1px rgba(0,0,0,0.05);
}
section.collapsible .collapsible-header a:after {
    font-family:'Glyphicons Halflings';
    content:"\e113";
    float: left;
    color: white;
    cursor:pointer;
    
}
section.collapsible.collapsed .collapsible-header a:after {
    content:"\e114";
}
section.collapsible .collapsible-header {
    background-color: #428bca;
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    padding: 10px 15px;
    width: 100%;
    border: none;
    outline: none;
    text-align: right;
    cursor: default;
    border-radius:7px 7px 0px 0px;
    transition: all .4s ease-in-out;
}

section.collapsible.collapsed .collapsible-header {
    border-radius:7px 7px 7px 7px;
}

section.collapsible.collapsed .collapsible-body {
    display:none;
}

section.collapsible .collapsible-header:hover {
    background-color: #42aeca;
}

/* TOOLTIP   
----------------------------------------------------------*/
.tooltipx {
    display: inline-block;
    position: absolute;
    border: 1px solid #333;
    background-color: #161616;
    border-radius: 5px;
    padding: 10px;
    color: #fff;
    font-family: BNazanin,Tahoma;
    font-size: 12px;
    z-index: 1500;
}

.tooltipx-err {
    border: 1px solid #DE1111;
    background-color: #EC5555;
    color: #fff;
}

.div_error {
    background-color: #faeaea;
    border-color: #b94a48;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: 0px 0px 3px 2px rgba(202, 52, 52, 0.28);
}

/* el-modal-selectpicker   
----------------------------------------------------------*/


.el-selectpicker-btn {
    color: #333;
    width: 100%;
  background-color: #fff;
  /*display: block;*/
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.428571429;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid #ccc;

  border-radius: 4px;
  user-select: none;
}

.el-modal-selectpicker {
    position:absolute;
    z-index: 1040;
    display: none;
    overflow: auto;
    overflow-y: no-display;
    overflow-y: no-display;
    background-color: #fff;
    max-height: 350px;
    min-width: 160px;
    padding: 5px;
    margin: 2px 0 0;
    font-size: 14px;
    list-style: none;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.175);
    box-shadow: 0 6px 12px rgba(0,0,0,0.175);
    background-clip: padding-box;
    direction: rtl;
}

    .el-modal-selectpicker .el-modal-selectpicker-body {
        max-height: 250px;
        overflow: auto;
        overflow-x: no-display;
        overflow-y: no-display;
        margin-top: 5px;
    }

        .el-modal-selectpicker .el-modal-selectpicker-body div {
            line-height: 20px;
            padding: 10px;
            cursor: pointer;
            color:#000;
        }

            .el-modal-selectpicker .el-modal-selectpicker-body div.active {
                color: #fff;
                text-decoration: none;
                background-color: #428bca;
                outline: 0;
            }

            .el-modal-selectpicker .el-modal-selectpicker-body div.actives {
                color: #fff;
                text-decoration: none;
                background-color: #62f59c;
                outline: 0;
            }
            .el-hide {
                display:none
            }

            .el-modal-selectpicker .el-modal-selectpicker-body div:hover {
                color: #262626;
                text-decoration: none;
                background-color: #f5f5f5;
            }

/*   Datepicker 
----------------------------------------------------------*/

.el-modal-datepicker {
            position: absolute;
            z-index: 1040;
            display: none;
            overflow:no-display;
            overflow-y: no-display;
            background-color: #fff;
            max-height: 350px;
            min-width: 160px;
            margin: 2px 0 0;
            font-size: 14px;
            list-style: none;
            background-color: #fff;
            border: 1px solid rgba(0,0,0,0.15);
            border-radius: 4px;
            box-shadow: 0 6px 12px rgba(0,0,0,0.175);
            background-clip: padding-box;
            direction: rtl;
            font-family: yekan,serif !important;
            padding: 7px;
            min-width: 300px;
            max-width: 400px;
        }


            .el-modal-datepicker table {
                table-layout: fixed;
                width: 100%;
            }

                .el-modal-datepicker table td {
                    text-align: center;
                    background-color: #fff;
                    cursor: pointer;
                    transition: transform 0.1s;
                }

            .el-modal-datepicker .el-daily table thead td {
                text-align: center;
                background-color: #f1f1f1;
                color: #000000;
                line-height: 30px;
                cursor: default;
            }

                .el-modal-datepicker .el-daily table thead td.last-week {
                    color: #fb4d4d;
                }

            .el-modal-datepicker table tbody td.not-in-month {
                color: rgba(0, 0, 0, 0.32);
            }

            .el-modal-datepicker table tbody td.last-week {
                color: #fb4d4d;
            }

            .el-modal-datepicker table tbody td.not-in-month.last-week {
                color: rgba(255, 0, 0, 0.32);
            }


            .el-modal-datepicker table tbody td.today {
                text-align: center;
                background-color: #98e3fd;
                color: darkcyan;
                border-radius: 5px;
            }

            .el-modal-datepicker table tbody td.selected {
                text-align: center;
                background-color: #ff6a00;
                color: blueviolet;
                border-radius: 5px;
            }

            .el-modal-datepicker table tbody td:hover {
                background-color: #233ac5;
                color: #fff;
                transform: scale(1.15);
                border-radius: 5px;
            }

            .el-modal-datepicker table tbody td.disabled-day {
                opacity: 0.15;
                cursor: not-allowed;
            }


            .el-modal-datepicker .el-btn {
                background: #569ff7;
                font-size: 90%;
                padding: 0.3em 0.6em;
                border-radius: 5px;
                font-weight: 400;
                display: inline-block;
                text-align: center;
                color: #fff;
                cursor: pointer;
                margin: 15px 10px 10px 10px;
                width: 90px;
            }

                .el-modal-datepicker .el-btn:hover {
                    background-color: aquamarine;
                }

            /*:not(.disabled-day)*/
            .el-modal-datepicker .el-btn-today {
                float: right;
            }

        .el-btn-mil {
            float: left;
        }

        .el-modal-datepicker .el-weekly td {
            height: 40px;
        }

        .el-modal-datepicker .el-yearly td {
            height: 30px;
        }

        .el-modal-datepicker .el-weekly td {
            height: 40px;
        }

        .el-datepicker-icon {
            position: relative;
            top: 1px;
            display: inline-block;
            font-family: 'Glyphicons Halflings';
            -webkit-font-smoothing: antialiased;
            font-style: normal;
            font-weight: normal;
            line-height: 1;
        }

            .el-datepicker-icon::before {
                content: "\1f4c5";
            }

/*   Confirm 
----------------------------------------------------------*/

div.el-modal-confirm {
            position: fixed;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            z-index: 1040;
            display: block;
            overflow: auto;
            overflow-y: no-display;
            overflow-y: no-display;
            background-color: rgba(0,0,0,0.4);
            display: none;
            direction: rtl;
        }

        .el-modal-confirm-d {
            margin: auto;
            width: 60%;
            max-width: 400px;
            min-width: 300px;
            background-color: #fff;
            overflow: auto;
            border-radius: 5px;
            margin-top: 50px;
            box-shadow: 0 3px 9px rgba(0,0,0,0.5);
        }

        .el-modal-confirm-full {
            margin: 0;
            width: 100%;
            height: 100%;
            max-width: 700px;
            min-width: 300px;
            overflow: auto;
            border-radius: 0px;
            margin-top: 0;
            box-shadow: none;
            min-width: 300px;
        }

        .el-modal-confirm-header {
            background: #00A8B3;
            color: #fff;
            border-radius: 5px 5px 0 0;
            -webkit-border-radius: 5px 5px 0 0;
            border-bottom: none;
            padding: 10px;
        }

        .el-modal-confirm-full .el-modal-confirm-header {
            border-radius: 0;
            -webkit-border-radius: 0;
        }

        .el-modal-confirm-header a:after {
            font-family: 'Glyphicons Halflings';
            content: "\e014";
            float: left;
            color: #c1e5ff;
            cursor: pointer;
            padding-left: 5px;
            padding-top: 5px;
        }

        .el-modal-confirm-header span {
            font-weight: 300;
            font-family: yekan,'Open Sans', sans-serif;
            margin: 0;
            line-height: 1.428571429;
            font-size: 18px;
        }

        .el-modal-confirm-footer {
            padding: 14px 15px 15px 15px;
            text-align: left;
            border-top: 1px solid #e5e5e5;
            font-family: yekan,'Open Sans', sans-serif;
        }

        .el-modal-confirm-full .el-modal-confirm-footer
        {
            padding: 9px 10px 10px 10px;
        }

        button.el-btn {
            display: inline-block;
            padding: 6px 12px;
            margin-bottom: 0;
            font-size: 14px;
            font-weight: normal;
            line-height: 1.428571429;
            text-align: center;
            white-space: nowrap;
            vertical-align: middle;
            cursor: pointer;
            border: 1px solid transparent;
            border-top-color: transparent;
            border-right-color: transparent;
            border-bottom-color: transparent;
            border-left-color: transparent;
            border-radius: 4px;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            -o-user-select: none;
            user-select: none;
            margin: 0px 5px 0px 5px;
        }

        button.el-btn-default {
            background-color: #bec3c7;
            border-color: #bec3c7;
            color: #fff;
        }

        button.el-btn-warning {
            background-color: #f1c500;
            border-color: #f1c500;
            color: #FFFFFF;
        }

        .el-modal-confirm-body
        {
            overflow:auto;
            min-height:50px;
        }
/*   Loading 
----------------------------------------------------------*/
@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  to { 
    -webkit-transform: rotate(360deg);
  }
}
.el-loading img
{
    -webkit-animation-name:             rotate; 
    -webkit-animation-duration:         2s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-transition-timing-function:initial;
    width:40px;
    height:40px;
    }

/*   
----------------------------------------------------------*/
.xpagination {
  display: inline-block;
  padding-left:20px;
  padding-right:20px;
}

.xpagination a {
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
  border: 1px solid #ddd;
}

.xpagination a.active {
  background-color: #4CAF50;
  color: white;
  border: 1px solid #4CAF50;
}

.xpagination a:hover:not(.active) {background-color: #ddd;}

.xpagination a:first-child {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.xpagination a:last-child {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}
