@charset "utf-8";
/* CSS Document */

/* arabic */
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 400;
    src: local('Cairo'), local('Cairo-Regular'), url(https://fonts.gstatic.com/s/cairo/v5/SLXGc1nY6HkvalIkTpu0xg.woff2) format('woff2');
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
}
/* latin-ext */
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 400;
    src: local('Cairo'), local('Cairo-Regular'), url(https://fonts.gstatic.com/s/cairo/v5/SLXGc1nY6HkvalIvTpu0xg.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 400;
    src: local('Cairo'), local('Cairo-Regular'), url(https://fonts.gstatic.com/s/cairo/v5/SLXGc1nY6HkvalIhTps.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    font-family: 'Cairo';
    background-color: #eee;
}





.color-white {
    color: #fff !important;
}

.back-green {
    background-color: #6ac9cb;
}

.back-blue {
    background-color: #4d90c8;
}

.color-green {
    color: #6ac9cb;
}

.color-blue {
    color: #4d90c8;
    padding: 0px 0px 20px 0px;
}

.input-search {
    max-width: 300px;
    margin-bottom: 20px;
}

.logo {
    display: block;
    padding: 5px;
}






.btn-menu {
    display: none;
}

.dropdown-item {
    font-size: 13px;
}


.img-logo {
    width: 150px;
}






















/*........................login....................*/
.logo-login {
    padding: 20px 0px;
}

.login-wrap {
    width: 100%;
    margin: auto;
    max-width: 525px;
    min-height: 420px;
    position: relative;
    border-radius: 35px;
    /*	background:url(../images/back-login.jpg) no-repeat center;
*/
    box-shadow: 0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19);
    z-index: 99;
}

.login-html {
    width: 100%;
    height: 100%;
    position: absolute;
    padding: 40px 60px 50px 60px;
    border-radius: 34px;
    overflow: hidden;
    background: #254F6A;
}

.login-html {
}

    .login-html .sign-in-htm,
    .login-html .sign-up-htm {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        position: absolute;
        transform: rotateY(180deg);
        backface-visibility: hidden;
        transition: all .4s linear;
    }

    .login-html .sign-in,
    .login-html .sign-up,
    .login-form .group .check {
        display: none;
    }

    .login-html .tab,
    .login-form .group .label,
    .login-form .group .button {
        text-transform: uppercase;
        transition: 1s;
    }

    .login-html .tab {
        font-size: 22px;
        margin-right: 15px;
        padding-bottom: 5px;
        margin: 0 15px 10px 0;
        display: inline-block;
        border-bottom: 2px solid transparent;
        color: #a5a5a5;
    }

    .login-html .sign-in:checked + .tab,
    .login-html .sign-up:checked + .tab {
        color: #fff;
        border-color: #1161ee;
    }

.login-form {
    min-height: 345px;
    position: relative;
    perspective: 1000px;
    transform-style: preserve-3d;
}

    .login-form .group {
        margin-bottom: 15px;
    }

        .login-form .group .label,
        .login-form .group .input,
        .login-form .group .button {
            width: 100%;
            color: #000;
            display: block;
        }

        .login-form .group .input,
        .login-form .group .button {
            border: none;
            outline: none;
            padding: 12px 20px;
            border-radius: 22px;
            background: rgba(255,255,255,1);
        }

        .login-form .group input[data-type="password"] {
            text-security: circle;
            -webkit-text-security: circle;
        }

        .login-form .group .label {
            color: #fff;
            font-size: 12px;
        }

        .login-form .group .button {
            background: #E42727;
            transition: 1s;
            cursor: pointer;
            color: #fff;
        }

            .login-form .group .button:hover {
                background: #b92222;
            }

        .login-form .group label .icon {
            width: 15px;
            height: 15px;
            border-radius: 2px;
            position: relative;
            display: inline-block;
            background: rgba(255,255,255,.1);
        }

            .login-form .group label .icon:before,
            .login-form .group label .icon:after {
                content: '';
                width: 10px;
                height: 2px;
                background: #fff;
                position: absolute;
                transition: all .2s ease-in-out 0s;
            }




            .login-form .group label .icon:before {
                left: 3px;
                width: 5px;
                bottom: 6px;
                transform: scale(0) rotate(0);
            }

            .login-form .group label .icon:after {
                top: 6px;
                right: 0;
                transform: scale(0) rotate(0);
            }

        .login-form .group .check:checked + label {
            color: #fff;
        }

            .login-form .group .check:checked + label .icon {
                background: #1161ee;
            }

                .login-form .group .check:checked + label .icon:before {
                    transform: scale(1) rotate(45deg);
                }

                .login-form .group .check:checked + label .icon:after {
                    transform: scale(1) rotate(-45deg);
                }

.login-html .sign-in:checked + .tab + .sign-up + .tab + .login-form .sign-in-htm {
    transform: rotate(0);
}

.login-html .sign-up:checked + .tab + .login-form .sign-up-htm {
    transform: rotate(0);
}

.hr {
    height: 2px;
    margin: 60px 0 50px 0;
    background: rgba(255,255,255,.2);
}

.foot-lnk {
    text-align: center;
}

.color-label {
    color: #999;
}

.color-white {
    color: #fff;
}

    .color-white:hover {
        color: #fff;
    }

.welcome-dashboard {
    color: #fff;
    text-align: center;
    font-size: 20px;
}


.overlay-div {
    position: fixed;
    background-color: rgba(0,0,0,.7);
    width: 100%;
    height: 100%;
    z-index: 8;
    top: 0px;
    left: 0px;
    display: none;
}

/*
.........................user dashboard...................*/

.main-menu {
    width: 200px;
    height: 100%;
    position: fixed;
    background-color: #fff;
    padding: 10px;
    box-shadow: 2px 5px 10px #dedede;
}

.user-icon {
    border-radius: 50%;
    padding: 5px;
    border: dashed 2px #eee;
    width: 100px;
    height: 100px;
    margin: 15px 0px;
}

.h3-user {
    font-size: 20px;
    text-transform: capitalize;
    color: #1c364a;
}

.a-links {
    padding: 0px;
    margin-top: 10px;
}

    .a-links li {
        margin-top: 5px;
        list-style: none;
    }

.active-menu {
    color: #E42727 !important;
}

.a-links li a {
    color: #254F6A;
    text-transform: uppercase;
    font-size: 15px;
    /* font-weight: bold; */
    text-decoration: none;
    font-weight: bold;
}

.icon-menu {
    text-align: left;
    /* width:30px; */
}

.container-admin {
    float: right;
    padding-left: 200px;
    width: 100%;
}

.header-admin {
    background-color: #177591;
    padding: 10px;
    /* width:100%; */
    /* height: 60px; */
    position: sticky;
    top: 0;
    z-index: 7;
}

.name-page {
    color: #fff;
    font-size: 16px;
    float: right;
    padding: 10px;
}

.container-panel {
    padding: 15px;
}

.panel-item {
    padding: 20px;
    background-color: #fff;
    min-height: 500px;
    box-shadow: 2px 5px 10px #dedede;
}

.input-sys {
}



.user-name {
    float: right;
}

.menu-drop {
    font-size: 14px;
}

.btn-edite {
    color: #fff;
}

    .btn-edite:hover {
        color: #000;
    }

.img-doc {
    width: 100px;
    height: 100px;
}

.padding-modal {
    padding: 20px;
    /* color:#fff; */
    font-size: 16px;
}

.modal-button {
    padding: 0px 0px 20px 0px;
}

.modal-content {
    border-radius: 0px;
}

.icon-pop {
    /* padding:20px; */
    color: #eaeaea !important;
    text-shadow: 0px 0px 4px #000;
    font-size: 20px;
    width: 80px;
    height: 80px;
    text-align: center;
    /* line-height: 42px; */
    display: block;
    border-radius: 50%;
    vertical-align: middle;
    padding-top: 25px;
    margin: -27px auto 0px auto;
    border: 3px solid #b11e1e;
    box-shadow: 1px 1px 5px #000;
    background-color: #E42727;
}

.table-scroll {
    width: 100%;
    overflow-y: auto;
}


.card-body {
    background-color: #fff;
}


.logo-header {
    /* padding-left: 63px; */
    width: 116px;
    display: none;
}



.max-table {
    max-width: 800px;
}

.big-menu {
    position: fixed;
    width: 300px;
    height: 100%;
    left: 0px;
    top: 0px;
    background-color: #177591;
    /* padding:20px; */
    transition: .5s;
    z-index: 9;
    /* box-shadow: 0px 0px 5px #7b7575; */
    box-shadow: 1px 0px 20px rgba(0, 0, 0, 0.08);
}

    .big-menu:lang(ar) {
        right: 0px;
        left: auto;
    }


.container-padding {
    padding-left: 300px;
}

    .container-padding:lang(ar) {
        padding-left: 0px;
        padding-right: 300px;
    }

.btn-menu {
    display: none;
    background-color: #E42727;
    color: #fff;
}

.show-menu {
    left: 0 !important;
}

    .show-menu:lang(ar) {
        left: auto !important;
        right: 0px !important;
    }

.btn-menu-close {
    position: absolute;
    right: 0px;
    top: 0px;
    background-color: #E42727;
    color: #fff;
    /* border-radius:50%; */
    padding: 5px;
    border: none;
    width: 30px;
    height: 30px;
    text-align: center;
    display: none;
    cursor: pointer;
}

    .btn-menu-close:lang(ar) {
        left: 0px;
        right: auto;
    }

.h3-pop-del {
    color: #fff;
}

.card {
    border-radius: 5px !important;
    overflow: hidden;
}

.back-dark-blue {
    background-color: #254F6A;
}

.modal-content label {
    color: #fff;
}










/*............................back colors...................*/

.back-black {
    background-color: #e2e2e2;
}

.back-red {
    background-color: #efbaba;
}

.back-bluee {
    background-color: #cdcdfd;
}

.back-yellow {
    background-color: #f9f9b3;
}

.back-green {
    background-color: #B9FFB9;
}

.back-orange {
    background-color: #FFD9B3;
}

.back-cian {
    background-color: #D1E9E9;
}

.back-Purple {
    background-color: #E2C6FF;
}

.back-pink {
    background-color: #FFBFDF;
}


.open-contact-btn {
    margin-bottom: 10px;
}

.company-name2 {
    color: #E42727;
}

.golden-btn {
    background-color: #E42727;
    border: 1px solid #a76809;
    color: #fff;
}



.btn-drash {
    position: absolute;
    top: 5px;
    right: 5px;
}

.btn-download {
    position: absolute;
    top: 5px;
    right: 40px;
}

.div-title {
    width: 100%;
    position: absolute;
    bottom: 0px;
    background-color: #E42727;
    color: #fff;
    padding: 5px;
    left: 0px;
    text-align: center;
}

.h5-pop-with-dark {
    color: #fff;
}

.table-pop td {
    color: #fff;
}

.table-pop thead {
    background-color: #E42727 !important;
}

.btn-plus-tel {
    background-color: #E42727;
    color: #fff;
    border: 1px solid #000;
}

.div-overflow {
    max-height: 100%;
    overflow-y: auto;
    min-height: 100%;
}




.bubble-bg {
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
}

.individual-bubble {
    position: absolute;
    border-radius: 100%;
    bottom: 0;
    background-color: #ccc;
    z-index: 1;
    width: 5px !important;
    height: 5px !important;
    background: #fff;
    opacity: 0.3;
    animation: fade 20s infinite;
    -webkit-animation: fade 20s infinite;
}

.overflow-hiden {
    max-width: 100%;
    overflow: hidden;
    position: relative;
    min-height: 100%;
}

@-webkit-keyframes fade {
    from {
        bottom: -24px;
        opacity: 0.5;
        visibility: visible
    }

    to {
        bottom: 120%
    }
}

@keyframes fade {
    from {
        bottom: -24px;
        opacity: 0.5;
        visibility: visible
    }

    to {
        bottom: 120%
    }
}



/*................menu.............*/

/*.main-links{padding:0px 20px;margin:0px;margin-top: 54px;}
.main-links li{
	list-style:none;
	position:relative;
}

.main-links li a{
	color:#607d8b;
	text-decoration:none;
	cursor:pointer;
	display: block;
}
.main-links li > a{color: #fff;padding: 10px 27px 10px 25px;}

.main-links li a:not([href]):not([tabindex]) {color: #fff;}
.icon-big-menu{
	
font-size:20px;
	
color: #fff;
	
position: absolute;
	
width: 23px;
	
text-align: center;
	
top: 10px;
}*/

.icon-arrow {
    position: absolute;
    right: 20px;
    top: 15px;
    transition: .5s;
}

    .icon-arrow:lang(ar) {
        right: auto;
        left: 20px;
        transform: rotate(-175deg);
    }



.rotate-arrow {
    transform: rotate(-270deg);
}

    .rotate-arrow:lang(ar) {
        transform: rotate(-270deg);
    }

.color-orange {
    color: #f9a756;
}

.active-menu-last a {
    color: #f9a756 !important;
}

.active-menu-last .icon-big-menu {
    color: #f9a756 !important;
}


.logo-profil h1 {
    font-size: 20px;
    margin-top: 10px;
    color: #fff;
}

.user-button .btn {
    background-color: transparent;
    color: #ffffff;
}

    .user-button .btn:hover {
        color: #70b8e6;
    }

.profile-img {
    width: 120px;
    height: 120px;
    margin-top: 20px; /* border: 2px solid #14576b; */
    border-radius: 50%;
}


/*.............header..........*/
.header-page {
    background-color: #fff;
    padding: 15px;
    box-shadow: 1px 0px 6px rgba(0, 0, 0, 0.08);
}

    .header-page h2 {
        font-size: 20px;
    }

.page-name {
    color: #636363;
    /* font-weight:bold; */
    font-size: 25px;
}

.active-page {
    opacity: .7;
}


/*.............three sec.............*/
.back-1 {
    background-color: #26dad2;
}

.back-2 {
    background-color: #ef5350;
}

.back-3 {
    background-color: #1976d2;
}

.section-dash {
    padding: 20px;
    color: #fff;
    margin-top: 40px;
    border-radius: 3px;
    display: block;
}

    .section-dash i {
        font-size: 30px;
        margin-bottom: 20px;
        text-shadow: 0px 1px 3px #6f6e6e;
    }

    .section-dash h3 {
        font-size: 20px;
    }

    .section-dash p {
        font-size: 20px;
    }


/*.............Recent Activity.............*/
.recent-div {
    margin-top: 20px;
}

.back-dash {
    background-color: #1976d2;
}

.h3-activity {
    font-size: 20px;
    color: #fff;
    margin: 0px;
    padding: 12px 50px 12px 10px;
}

    .h3-activity:lang(ar) {
        padding-right: 12px;
        padding-left: 50px;
    }

.head-accordion {
    cursor: pointer;
}

.card-item {
    margin-bottom: 20px;
}

.icon-accordion {
    text-align: center;
    position: absolute;
    padding-top: 14px;
    height: 41px;
    right: 0px;
    color: #fff;
    top: 3px;
    width: 40px;
    font-size: 15px;
}

    .icon-accordion:lang(ar) {
        left: 0px;
        right: auto;
    }


/** ====================
 * Lista de Comentarios
 =======================*/
.comments-container {
    margin: 60px auto 15px;
    width: 100%;
}

.comment-main-level {
    position: relative;
    padding-left: 80px;
}

    .comment-main-level:lang(ar) {
        padding-left: 0px;
        padding-right: 80px;
    }

.comments-container h1 {
    font-size: 36px;
    color: #283035;
    font-weight: 400;
}

    .comments-container h1 a {
        font-size: 18px;
        font-weight: 700;
    }

.comments-list {
    margin-top: 30px;
    position: relative;
    padding: 0px;
}



    .comments-list:after {
        content: '';
        position: absolute;
        background: #c7cacb;
        bottom: 0;
        left: 29px;
        width: 7px;
        height: 7px;
        border: 3px solid #dee1e3;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
    }

.reply-list:before, .reply-list:after {
    display: none;
}

.reply-list li:before {
    content: '';
    width: 60px;
    height: 2px;
    background: #c7cacb;
    position: absolute;
    top: 25px;
    left: -55px;
}

.reply-list li:lang(ar):before {
    right: -55px;
    left: auto;
}


.comments-list li {
    margin-bottom: 15px;
    display: block;
    position: relative;
}

    .comments-list li:after {
        content: '';
        display: block;
        clear: both;
        height: 0;
        width: 0;
    }


.reply-list {
    padding-left: 88px;
    clear: both;
    margin-top: 15px;
}

    .reply-list:lang(ar) {
        padding-right: 88px;
        padding-left: 0px;
    }

/**
 * Avatar
 ---------------------------*/
.comments-list .comment-avatar {
    width: 65px;
    height: 65PX;
    top: 0px;
    left: 0px;
    position: absolute;
    z-index: 1;
    /* float: left; */
    border: 1px solid #c7cacb;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    overflow: hidden;
}

    .comments-list .comment-avatar:lang(ar) {
        right: 0px;
        left: auto;
    }


    .comments-list .comment-avatar img {
        width: 100%;
        height: 100%;
    }

.reply-list .comment-avatar {
    width: 50px;
    height: 50px;
}

.comment-main-level:after {
    content: '';
    width: 0;
    height: 0;
    display: block;
    clear: both;
}
/**
 * Caja del Comentario
 ---------------------------*/
.comments-list .comment-box {
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.15);
    -moz-box-shadow: 0 1px 1px rgba(0,0,0,0.15);
    box-shadow: 0 1px 1px rgba(0,0,0,0.15);
}

.reply-list .comment-box {
    padding-left: 60px;
}

    .reply-list .comment-box:lang(ar) {
        padding-left: 0px;
        padding-right: 60px;
    }

.comment-box .comment-head {
    background: #FCFCFC;
    padding: 10px 12px;
    border-bottom: 1px solid #E5E5E5;
    overflow: hidden;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    position: relative;
}

    .comment-box .comment-head i {
        /* float: right; */
        /* margin-left: 14px; */
        /* position: relative; */
        /* top: 2px; */
        /* color: #A6A6A6; */
        /* cursor: pointer; */
        /* -webkit-transition: color 0.3s ease; */
        -o-transition: color 0.3s ease;
        /* transition: color 0.3s ease; */
    }

        .comment-box .comment-head i:hover {
            /*	color: #03658c;
*/
        }

.comment-box .comment-name {
    color: #283035;
    font-size: 14px;
    font-weight: 700;
    float: left;
    margin-right: 10px;
}

    .comment-box .comment-name:lang(ar) {
        float: right;
    }

    .comment-box .comment-name a {
        color: #283035;
    }

.comment-box .comment-head span {
    float: left;
    color: #999;
    font-size: 13px;
    position: relative;
    top: 1px;
}

.comment-box .comment-content {
    background: #FFF;
    padding: 12px;
    font-size: 15px;
    color: #595959;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
}

.comment-box .comment-name.by-author, .comment-box .comment-name.by-author a {
    color: #70b8e6;
}


/** =====================

 * Responsive


 ========================*/
.icons-commment { /* background-color:#eee; */
    color: #666;
    font-size: 12px;
    padding: 10px 5px;
    border-top: 1px solid #e0e0e0;
    font-weight: bold;
}

.btn-comment {
    background-color: transparent;
    border: none;
    padding: 0px;
    color: #666;
    outline: none;
    margin: 0px 5px;
    font-size: 14px;
    text-align: center;
}

.main-comment { /*	background-color:#eee;
*/
    border-radius: 5px;
    border: 1px solid #eee;
    padding: 20px;
    position: relative;
    padding-left: 135px;
    margin-top: 30px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+50,ededed+51,ffffff+100;White+Gloss+%232 */ background: rgb(255,255,255); /* Old browsers */
    background: -moz-linear-gradient(45deg, rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

    .main-comment:lang(ar) {
        padding-left: 0px;
        padding-right: 135px;
    }



.img-comment {
    width: 100px;
    height: 100px;
    position: absolute;
    left: 20px;
    top: 20px;
}

    .img-comment:lang(ar) {
        left: auto;
        right: 20px;
    }


.text-area-comment {
    height: 102px;
}

.post-button {
    margin-top: 20px;
}

.icons-dir {
    text-align: right;
}

    .icons-dir:lang(ar) {
        text-align: left;
    }

.btn-replay {
    color: #fff;
    box-shadow: 0px 0px 0px 7px rgba(117, 117, 117, 0.1);
    border-radius: 30px;
    text-transform: uppercase;
    font-size: 11px;
    margin-top: 15px;
    transition: .5s;
    margin: 0 10px;
    color: #fff;
    margin-top: 20px;
}

.btn-del {
    position: absolute;
    right: 5px;
    bottom: 0px;
    background-color: #333;
    color: #fff !important;
    border-radius: 5px 5px 0px 0px;
    padding: 3px;
    font-size: 12px;
}

    .btn-del:lang(ar) {
        right: auto;
        left: 5px;
    }

    .btn-del:hover {
        color: #fff !important;
    }

.h3-comment {
    font-size: 25px;
    text-transform: uppercase;
}



/*..................header.............*/

.shadow-div {
    background-color: transparent; /* display: block; */
    padding: 0px 20px 5px 5px;
    width: 45px;
    height: 30px;
    text-align: center;
    color: #fff !important;
    position: relative;
    cursor: pointer;
    border: none;
    font-size: 23px;
}

    .shadow-div:lang(ar) {
        padding: 5px 5px 5px 20px;
    }

.header-links {
    padding: 0px;
    margin: 0px;
}

.header-links {
    list-style: none;
}

.alert-notfication {
    position: absolute;
    left: 14px;
    top: -5px;
    background-color: #ef5350;
    animation: shadow-pulse 1s infinite;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    text-align: center;
    padding: 0px;
    font-size: 14px;
}

@keyframes shadow-pulse {
    0% {
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
    }

    100% {
        box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);
    }
}

.dropdown-menu:lang(ar) {
    left: auto !important;
    right: 0px;
    transform: translate3d(0px, 30px, 0px) !important;
}

.accout-drop {
    left: auto !important;
    right: -70px !important;
}

    .accout-drop:lang(ar) {
        left: 10px !important;
        right: auto !important;
    }



.img-flag {
    width: 25px;
}

.min-width-language {
    min-width: auto;
    max-width: 100px;
}

    .min-width-language ul {
        min-width: auto !important;
    }

.img-drop {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    position: absolute;
}

.a-link-drop {
    font-size: 15px;
    color: #333;
    margin-bottom: 3px;
    padding: 5px 0px 7px 0px;
    display: block;
}

    .a-link-drop:hover {
        text-decoration: none;
    }

.div-table {
    display: grid;
    overflow: scroll;
}

.head-accordion {
    padding: 0px;
}
/*......................innerpage................*/

.content-page {
    background-color: #fff;
    padding: 20px;
    margin-top: 20px;
    box-shadow: 5px 5px 10px #e0e0e0;
}

.image-thump {
    width: 150px;
    height: 150px;
    border-radius: 5px;
    margin-bottom: 5px;
    border: 1px solid #eee;
}

.item-image {
    margin-top: 20px;
    width: 150px;
    position: relative;
}

.btn-delet {
    position: absolute;
    left: 10px;
    top: 10px;
    box-shadow: 0px 0px 3px #0000;
    z-index: 1;
}



/*	.................menu...................*/

.notfication-div {
    background-color: #26dad2;
    padding: 7px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    position: absolute;
    color: #fff;
    text-align: center;
}

.a-header {
    position: relative;
    padding-left: 39px;
    display: block;
    width: 100%;
    border-bottom: 1px solid #dad3d3;
}

    .a-header:lang(ar) {
        padding-left: 0px;
        padding-right: 39px;
    }

    .a-header h4 {
        font-size: 14px;
        margin-bottom: 2px;
    }

    .a-header p {
        font-size: 12px;
        font-weight: bold;
        margin-bottom: 5px;
    }

.dropdown-menu ul {
    padding: 0px;
    margin: 0px;
}

    .dropdown-menu ul li {
        list-style: none;
        padding: 5px;
    }

.shadow-div:after {
    display: none;
}

.dropright-menu button {
    background-color: transparent;
    border: none;
}