/*
    show_manager_panel => 1
    .a-cards .a-card article => 1
    #sitemap_panel => 1
    svg => 1
    .curve => 1
    .menu_item_nav_service => 1
    svg => card-body => 2
    menu_panel > navbar-brand => 2
    img-zoom => 2
    scroll_to_top => 5
    carousel-indicators => 7
    menu_fix => 8
    page-loading-progress => 9
    .carousel-caption => 10
    .morvarid-search-panel => 11
    #search_main_panel => 11

    color:
    light: #f8f9fa => rgb(248, 249, 250)
    warning: #ffc107 => rgb(255, 193, 7)
    warning > hover: #e0a800
    dark: #343a40 => rgb(52, 58, 64)
    success: #28a745 => rgba(40, 167, 69, 1)
    success > hover: #218838
    secondary: #6c757d
    primary: #007bff => rgb(0, 123, 255)
    info: #17a2b8 => rgb(23, 162, 184)
    info > hover: #138496
    danger: #dc3545 => 	rgb(220, 53, 69)
    danger > hover: #c82333
    orange: #fd7e14
    purple: #6f42c1
    pink: #e83e8c
    card > border-color: rgba(0, 0, 0, 0.125)
    card > card-header > background: rgba(0, 0, 0, 0.03)

    alert > background
    primary: #cce5ff
    secondary: #e2e3e5
    success: #d4edda
    info: #d1ecf1
    warning: #fff3cd
    danger: #f8d7da
    light: #fefefe
    dark: #d6d8d9

    col-X: 0 - 575
    col-sm-X: 576 - 767;
    col-md-X: 768 - 991;
    col-lg-X: 992 - 1199;
    col-xl-X: 1200 - X;

    h1: 2.5rem
    h2: 2rem
    h3: 1.75rem
    h4: 1.5rem
    h5: 1.25rem = 20px
    h6: 1rem = 16px
    p: none
    small: none

    1rem = 16px
*/

/*#region BOOTSTRAP*/
hr {
    background: #f8f9fa;
}

ul {
    margin-bottom: 0;
}

a {
    text-decoration: none !important;
}

select {
    text-align-last: center;
}

input {
    text-align: center;
}

    input[type = checkbox] {
        cursor: pointer;
    }

p, h1, h2, h3, h4, h5, h6, label, .alert {
    margin-bottom: 0;
}

input[name=Email],
input[name=Password],
input[name=ConfirmPassword],
input[name=Price],
input[name=Priority],
input[name=Link],
input[name=Phone],
input[name=Mobile],
input[name=WorkingHours],
input[name=Website],
input[name=Instagram],
input[name=Telegram],
input[name=Whatsapp],
input[name=Sheba],
input[name=Developers],
input[name=Publishers],
input[name=WikipediaLink],
input[name=Size],
input[name=Stars],
input[name=Writers],
input[name=Directors],
input[name=ProductionCompanies],
input[name=Countries],
input[name=Genres],
input[name=Runtime],
input[name=Budget],
input[name=ImdbLink],
input[name=Year],
input[name=Creators],
input[name=Television],
input[name=Seasons],
input[name=Epoisodes],
input[name=Tags],
input[name=Username],
input[name=UserName],
input[type=email],
input[type=password],
input[type=tel],
input[type=number],
select[name=Platform],
select[name=Engine],
select[name=ReleaseYear],
select[name=ReleaseMonth],
select[name=ReleaseDay],
select[name=Repack],
select[name=Crack],
select[name=Format] {
    direction: ltr;
    font-family: auto;
}

@media (min-width: 768px) {
    .dropdown:hover > .dropdown-menu {
        display: block;
    }
}

.dropdown-menu {
    right: 0;
    margin: 0;
    padding: 0;
    border: none;
    /*background-color: #343a40;*/
    background: none;
}

    .dropdown-menu .dropdown-item,
    .dropdown-menu .dropdown-item {
        padding: 0.5rem;
        border-radius: 0.25rem;
        color: #f8f9fa;
        background-color: #343a40;
        animation: dropdown-item-rotate 1.5s ease 1;
    }

        .dropdown-menu .dropdown-item:hover,
        .dropdown-menu .dropdown-item:focus {
            text-decoration: none;
            color: #343a40;
            background-color: #ffc107;
        }

@keyframes dropdown-item-rotate {
    0% {
        transform: perspective(600px) rotateY(90deg);
    }

    100% {
        transform: perspective(600px) rotateY(0deg);
    }
}

.dropdown-menu .dropdown-item:nth-of-type(1) {
    animation-delay: 0s;
}

.dropdown-menu .dropdown-item:nth-of-type(2) {
    animation-delay: 0.1s;
}

.dropdown-menu .dropdown-item:nth-of-type(3) {
    animation-delay: 0.2s;
}

.dropdown-menu .dropdown-item:nth-of-type(4) {
    animation-delay: 0.3s;
}

.dropdown-menu .dropdown-item:nth-of-type(5) {
    animation-delay: 0.4s;
}

.dropdown-menu .dropdown-item:nth-of-type(6) {
    animation-delay: 0.5s;
}

.dropdown-menu .dropdown-item:nth-of-type(7) {
    animation-delay: 0.6s;
}

.dropdown-menu .dropdown-item:nth-of-type(8) {
    animation-delay: 0.7s;
}

.dropdown-menu .dropdown-item:nth-of-type(9) {
    animation-delay: 0.8s;
}

.dropdown-menu .dropdown-item:nth-of-type(10) {
    animation-delay: 0.9s;
}

.dropdown-menu .dropdown-item:nth-of-type(11) {
    animation-delay: 1s;
}

.dropdown-menu .dropdown-item:nth-of-type(12) {
    animation-delay: 1.1s;
}

.dropdown-menu .dropdown-item:nth-of-type(13) {
    animation-delay: 1.2s;
}

.dropdown-menu .dropdown-item:nth-of-type(14) {
    animation-delay: 1.3s;
}

.dropdown-menu .dropdown-item:nth-of-type(15) {
    animation-delay: 1.4s;
}

.dropdown-menu .dropdown-item:nth-of-type(16) {
    animation-delay: 1.5s;
}

.dropdown-menu .dropdown-item:nth-of-type(17) {
    animation-delay: 1.6s;
}

.dropdown-menu .dropdown-item:nth-of-type(18) {
    animation-delay: 1.7s;
}

.dropdown-menu .dropdown-item:nth-of-type(19) {
    animation-delay: 1.8s;
}

.dropdown-menu .dropdown-item:nth-of-type(20) {
    animation-delay: 1.9s;
}

.media {
    /*border-radius: 5px;
    padding: 5px;
    margin-bottom: 20px;*/
}

.list-inline .list-inline-item:not(:last-child) {
    margin-right: 1rem !important;
}

.ml-auto, .mx-auto {
    margin-left: unset !important;
    margin-right: auto !important;
}

.card {
    margin-bottom: 1rem;
}

.carousel-inner .carousel-caption {
    bottom: 40px;
}

    .carousel-inner .carousel-caption a:hover {
        color: #dc3545 !important;
    }

.carousel-inner img {
    width: 100%;
    /*min-height: 215px;
    max-height: 610px;*/
}

.carousel-indicators {
    z-index: 7;
}

    .carousel-indicators .active {
        background-color: #ffc107;
    }

.carousel-control-prev,
.carousel-control-next {
    opacity: 1;
    width: 10%;
    transition: 0.5s;
}

    .carousel-control-prev:hover,
    .carousel-control-prev:focus,
    .carousel-control-next:hover,
    .carousel-control-next:focus {
        opacity: 1;
        background-color: rgba(52, 58, 64, 0.5);
    }

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffc107' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffc107' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

.pagination {
    margin: 1rem 0 0.5rem;
}

    .pagination .page-item .page-link {
        background: none;
        border: none;
        color: #343a40;
        transition: 0.5s;
    }

        .pagination .page-item .page-link:hover {
            background: #343a40;
            color: #f8f9fa !important;
        }

    .pagination .page-item:first-child .page-link {
        border-radius: 0 5px 5px 0;
    }

    .pagination .page-item:last-child .page-link {
        border-radius: 5px 0 0 5px;
    }

    .pagination .page-item.active .page-link {
        background: #ffc107;
        color: #343a40 !important;
    }

        .pagination .page-item.active .page-link:hover {
            background: #343a40;
            color: #f8f9fa !important;
        }

.close {
    opacity: 1;
    color: #f8f9fa !important;
}

.modal-header .close {
    padding: 0.375rem 0.75rem;
    margin: 0;
}

.nav-tabs {
    /*border-color: #343a40;*/
}

    .nav-tabs .nav-link.active,
    .nav-tabs .nav-item.show .nav-link {
        color: #f8f9fa !important;
        background-color: #343a40;
        border-color: rgba(0, 0, 0, 0.125);
    }

    .nav-tabs .nav-link {
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #343a40;
    }

        .nav-tabs .nav-link:hover,
        .nav-tabs .nav-link:focus {
            color: #343a40 !important;
            background-color: #ffc107;
            border-color: rgba(0, 0, 0, 0.125);
        }

.navbar-toggler {
    /*border-color: #f8f9fa;*/
}

@media (min-width: 1200px) {
    .modal-dialog {
        max-width: 900px;
        margin: 1.75rem auto;
    }
}

@media (min-width : 992px) and (max-width : 1199px) {
    .modal-dialog {
        max-width: 717px;
        margin: 1.75rem auto;
    }
}

@media (min-width : 768px) and (max-width : 991px) {
    .modal-dialog {
        max-width: 693px;
        margin: 1.75rem auto;
    }
}

@media (min-width : 576px) and (max-width : 767px) {
    .modal-dialog {
        max-width: 501px;
        margin: 1.75rem auto;
    }
}

.toast {
    display: none;
    background-color: rgba(248, 249, 250, 1);
    position: fixed;
    bottom: 10px;
    left: 10px;
    z-index: 8;
}

    .toast:not(:last-child) {
        margin-bottom: 0;
    }

.toast-header {
    background: none;
}

    .toast-header .btn {
        padding: .175rem .50rem;
    }

        .toast-header .btn:hover {
            background: #dc3545;
            color: #f8f9fa !important;
        }

.validation-summary-errors {
    margin-bottom: 1rem;
    color: #dc3545;
}

    .validation-summary-errors ul {
        list-style: none;
    }

@supports ((position: -webkit-sticky) or (position: sticky)) {
    .sticky-top {
        z-index: 7;
    }
}
/*#endregion*/

/************************* aparat *************************/

.h_iframe-aparat_embed_frame {
    position: relative;
}

    .h_iframe-aparat_embed_frame .ratio {
        display: block;
        width: 100%;
        height: auto;
    }

    .h_iframe-aparat_embed_frame iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

/************************* youtube *************************/

.iframe_container_youtube {
    position: relative;
    width: 100%;
    padding-bottom: 50.25%;
    height: 0;
}

    .iframe_container_youtube iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 0.25rem;
    }

/************************* Image Hover Zoom *************************/

.img-zoom {
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s; /* Safari */
}

    .img-zoom:hover {
        -webkit-transform: scale(1.25, 1.25);
        -ms-transform: scale(1.25, 1.25);
        transform: scale(1.25, 1.25);
        transition-duration: 0.3s;
        -webkit-transition-duration: 0.3s; /* Safari */
        z-index: 2;
    }

.img_zoom_1_to_1_05 {
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s; /* Safari */
}

    .img_zoom_1_to_1_05:hover {
        -webkit-transform: scale(1.05, 1.05);
        -ms-transform: scale(1.05, 1.05);
        transform: scale(1.05, 1.05);
        transition-duration: 0.5s;
        -webkit-transition-duration: 0.5s; /* Safari */
        z-index: 2;
    }

.img_zoom_1_to_1_5 {
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s; /* Safari */
}

    .img_zoom_1_to_1_5:hover {
        -webkit-transform: scale(1.5, 1.5);
        -ms-transform: scale(1.5, 1.5);
        transform: scale(1.5, 1.5);
        transition-duration: 0.5s;
        -webkit-transition-duration: 0.5s; /* Safari */
        z-index: 2;
    }

.img_zoom {
    -webkit-transform: scale(1.25, 1.25, 1.25, 1.25) !important;
    -ms-transform: scale(1.25, 1.25, 1.25, 1.25) !important;
    transform: scale(1.25, 1.25) !important;
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s; /* Safari */
}

.img_zoom_1_5_rotate_15_hover {
    -webkit-transform: rotate(15deg) scale(1.5, 1.5);
    -ms-transform: rotate(15deg) scale(1.5, 1.5);
    transition: 0.5s ease-in-out;
    transition-duration: 0.5s;
    -webkit-transition: 0.5s ease-in-out;
    -webkit-transition-duration: 0.5s; /* Safari */
}

.img_zoom_1_25_hover {
    -webkit-transform: scale(1.25, 1.25);
    -ms-transform: scale(1.25, 1.25);
    transform: scale(1.25, 1.25);
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s; /* Safari */
}

.img_zoom_1_5_hover {
    -webkit-transform: scale(1.5, 1.5);
    -ms-transform: scale(1.5, 1.5);
    transform: scale(1.5, 1.5);
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s; /* Safari */
}

.img_zoom_2_hover {
    -webkit-transform: scale(2, 2);
    -ms-transform: scale(2, 2);
    transform: scale(2, 2);
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s; /* Safari */
}

.img_zoom_test {
    -webkit-transform: scale(1, 1, 1, 1) !important;
    -ms-transform: scale(1, 1, 1, 1) !important;
    transform: scale(1, 1) !important;
    transition-duration: 0.75s;
    -webkit-transition-duration: 0.75s; /* Safari */
}

.img_zoom_hover_test {
    -webkit-transform: scale(1.25, 1.25);
    -ms-transform: scale(1.25, 1.25);
    transform: scale(1.25, 1.25);
    transition-duration: 0.75s;
    -webkit-transition-duration: 0.75s; /* Safari */
}

/************************* Image Hover Rotate *************************/

.img_rotate_15_hover {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
    transition: .5s ease-in-out;
    -webkit-transition: .5s ease-in-out;
}

.img_rotate_45_hover {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: .5s ease-in-out;
    -webkit-transition: .5s ease-in-out;
}

/************************* jahate gharar dadane yek element dar markaze ye element e digar *************************/

.centered-background {
    position: relative;
    text-align: center;
    color: #f8f9fa;
}

.center-target {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.center-target-slide {
    position: absolute;
    top: 10%;
    left: 10%;
    right: 10%;
    bottom: 10%;
}

/************************* scrollbar *************************/

::-webkit-scrollbar {
    width: 7.5px;
    height: 7.5px;
}

::-webkit-scrollbar-track {
    /*box-shadow: inset 0 0 5px #f8f9fa;
    border-radius: 5px;*/
    background-color: #ffc107;
}

::-webkit-scrollbar-thumb {
    background: #343a40;
    border-radius: 5px;
}

/************************* validation *************************/

i.fa-star {
    color: #dc3545;
    position: absolute;
    font-size: 10px;
    top: 5px;
    right: 5px;
}

/************************* marbut be panael manager mojud dar master page haye adminlayout va userlayout *************************/

@media (min-width:768px) {
    .manager_fix {
        position: fixed !important;
        top: 0;
    }
}

/************************* marbut be namayeshe chart ha ba harizontal scroll *************************/

@media (max-width:575px) {
    .panel-width {
        overflow-x: auto;
    }

    .body-width {
        width: 575px;
        display: inline-block;
        float: right;
    }
}

@media (max-width:991px) {
    .panel-width-991 {
        overflow-x: auto;
    }

    .body-width-991 {
        width: 991px;
        display: inline-block;
        float: right;
    }
}

@media (max-width:767px) {
    .panel-width-767 {
        overflow-x: auto;
    }

    .body-width-767 {
        width: 767px;
        display: inline-block;
        float: right;
    }
}

@media (max-width:575px) {
    .panel-width-575 {
        overflow-x: auto;
    }

    .body-width-575 {
        width: 575px;
        display: inline-block;
        float: right;
    }
}

/************************* marbut be namayeshe jadavele bakhshe modiriat ba harizontal scroll *************************/

@media (max-width:992px) {
    .ul-width {
        overflow-x: auto;
    }

    .li-width {
        width: 1000px;
        display: inline-block;
        float: right;
    }

    .div-full-width {
        width: 100%
    }

    .span-width-50 {
        display: inline-block;
        width: 5%;
        padding: 0;
        float: right;
    }

    .span-width-100 {
        display: inline-block;
        width: 10%;
        padding: 0;
        float: right;
    }

    .span-width-150 {
        display: inline-block;
        width: 15%;
        padding: 0;
        float: right;
    }

    .span-width-200 {
        display: inline-block;
        width: 20%;
        padding: 0;
        float: right;
    }

    .span-width-250 {
        display: inline-block;
        width: 25%;
        padding: 0;
        float: right;
    }

    .span-width-300 {
        display: inline-block;
        width: 30%;
        padding: 0;
        float: right;
    }

    .span-width-350 {
        display: inline-block;
        width: 35%;
        padding: 0;
        float: right;
    }

    .span-width-400 {
        display: inline-block;
        width: 40%;
        padding: 0;
        float: right;
    }

    .span-width-450 {
        display: inline-block;
        width: 45%;
        padding: 0;
        float: right;
    }

    .span-width-500 {
        display: inline-block;
        width: 50%;
        padding: 0;
        float: right;
    }

    .span-width-600 {
        display: inline-block;
        width: 60%;
        padding: 0;
        float: right;
    }

    .span-width-700 {
        display: inline-block;
        width: 70%;
        padding: 0;
        float: right;
    }

    .span-width-800 {
        display: inline-block;
        width: 80%;
        padding: 0;
        float: right;
    }

    .span-width-900 {
        display: inline-block;
        width: 90%;
        padding: 0;
        float: right;
    }

    .span-width-1000 {
        display: inline-block;
        width: 100%;
        padding: 0;
        float: right;
    }
}

.span-width-50,
.span-width-100,
.span-width-150,
.span-width-200,
.span-width-250,
.span-width-300,
.span-width-350,
.span-width-400,
.span-width-450,
.span-width-500,
.span-width-600,
.span-width-700,
.span-width-800,
.span-width-900,
.span-width-1000 {
    display: flex;
    align-items: center;
    justify-content: center
}

/*#region Fix Menu*/
/*@media (min-width: 768px) {
    .menu_fix {
        position: fixed !important;
        z-index: 8;
        width: 100%;
        top: 0;
    }
}*/
/*#endregion*/

/************************* Modal Gallery Image *************************/

.modal-background {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9;
    /* HEX: #343a40 convert to RGB: rgba(52,58,64,0.5) */
    background-color: rgba(52,58,64,0.75);
}

/************************* Page Loading Bar *************************/

.page-loading-progress {
    position: fixed;
    /*left: 0px;
    top: 0px;*/
    width: 100%;
    /*height: 100%;*/
    z-index: 9;
}

.page-loading-bar {
    background-color: #ffc107;
    width: 0%;
    height: 5px;
    border-radius: 5px;
}

/************************* class e pgwSlider *************************/

.pgwSlider .ps-caption a {
    padding: 10px;
    background: #6c757d;
    opacity: 0.75;
}

ul.pgwSlider > li span, .pgwSlider > .ps-list > li span,
.pgwSlider .ps-current .ps-prev,
.pgwSlider .ps-current .ps-next {
    background: #6c757d !important;
}

.pgwSlider .ps-caption a:hover,
.pgwSlider .ps-prev:hover,
.pgwSlider .ps-next:hover {
    opacity: 1 !important;
}

.pgwSlider .baner-text {
    color: #f8f9fa;
    background: #343a40;
    padding: 10px;
    border-radius: 5px;
    position: absolute;
    bottom: 0;
    right: 25px;
}

@media (max-width: 575px) {
    .ps-list {
        display: none;
    }
}

@media (min-width: 1200px) {
    .pgwSlider .ps-current {
        width: 80%;
    }

    ul.pgwSlider,
    .pgwSlider ul {
        width: 20%;
    }

    .pgwSlider .ps-list-title {
        font-size: 16px;
    }

    .pgwSlider .ps-current-title {
        font-size: 30px;
    }

    .pgwSlider .ps-current-description {
        font-size: 20px;
    }
}

@media (min-width : 992px) and (max-width : 1199px) {
    .pgwSlider .ps-current {
        width: 80%;
    }

    ul.pgwSlider,
    .pgwSlider ul {
        width: 20%;
    }

    .pgwSlider .ps-list-title {
        font-size: 14px;
    }

    .pgwSlider .ps-current-title {
        font-size: 28px;
    }

    .pgwSlider .ps-current-description {
        font-size: 18px;
    }
}

@media (min-width : 768px) and (max-width : 991px) {
    .pgwSlider .ps-current {
        width: 80%;
    }

    ul.pgwSlider,
    .pgwSlider ul {
        width: 20%;
    }

    .pgwSlider .ps-list-title {
        font-size: 12px;
    }

    .pgwSlider .ps-current-title {
        font-size: 26px;
    }

    .pgwSlider .ps-current-description {
        font-size: 16px;
    }
}

@media (min-width : 576px) and (max-width : 767px) {
    .pgwSlider .ps-list-title {
        font-size: 10px;
    }

    .pgwSlider .ps-current-title {
        font-size: 24px;
    }

    .pgwSlider .ps-current-description {
        font-size: 14px;
    }
}

@media (min-width : 400px) and (max-width : 575px) {
    .pgwSlider .ps-current-title {
        font-size: 22px;
    }

    .pgwSlider .ps-current-description {
        font-size: 12px;
    }
}

@media (min-width : 300px) and (max-width : 399px) {
    .pgwSlider .ps-current-title {
        font-size: 20px;
    }

    .pgwSlider .ps-current-description {
        display: none
    }

    .ps-caption br {
        display: none
    }
}

@media (min-width : 200px) and (max-width : 299px) {
    .pgwSlider .ps-current-title {
        font-size: 12px;
    }

    .pgwSlider .ps-current-description {
        display: none
    }

    .ps-caption br {
        display: none
    }
}

@media (max-width: 199px) {
    .pgwSlider .ps-current-title {
        font-size: 10px;
    }

    .pgwSlider .ps-current-description {
        display: none
    }

    .ps-caption br {
        display: none
    }
}

/************************* jahate inke dar size kamtar az 768px, bakhshe slidere foroushgah penhan shavad *************************/

@media (max-width:992px) {
    .display_slide_panel {
        display: none;
    }

    .display_small_slide_panel {
        display: block !important;
    }
}

/************************* SVG Panel *************************/
/* > 1200 */
@media (min-width: 1200px) {
    .panel_svg_top {
        position: absolute;
        top: -44px;
        left: 0;
        transform: rotate(0.55deg);
    }

    .panel_svg_bottom {
        position: absolute;
        bottom: -46px;
        left: 0;
        z-index: 1;
        transform: rotate(180.45deg);
    }

    .column {
        width: 25%;
        padding: 0 5px;
    }

    .column_cat {
        width: 33.33333%;
        padding: 0 5px;
    }
}

/* 992 - 1200 */
@media (max-width: 1200px) {
    .panel_svg_top {
        position: absolute;
        top: -45px;
        left: 0;
        transform: rotate(0.6deg);
    }

    .panel_svg_bottom {
        position: absolute;
        bottom: -45px;
        left: 0;
        z-index: 1;
        transform: rotate(180.6deg);
    }

    .column {
        width: 25%;
        padding: 0 5px;
    }

    .column_cat {
        width: 33.33333%;
        padding: 0 5px;
    }
}

/* 768 - 992 */
@media (max-width: 992px) {
    .panel_svg_top {
        position: absolute;
        top: -44px;
        left: 0;
        transform: rotate(1deg);
    }

    .panel_svg_bottom {
        position: absolute;
        bottom: -45px;
        left: 0;
        z-index: 1;
        transform: rotate(180.9deg);
    }

    .column {
        width: 25%;
        padding: 0 5px;
    }

    .column_cat {
        width: 33.33333%;
        padding: 0 5px;
    }
}

/* 579 - 768 */
@media (max-width: 768px) {
    .panel_svg_top {
        position: absolute;
        top: -43px;
        left: 0;
        transform: rotate(1.7deg);
    }

    .panel_svg_bottom {
        position: absolute;
        bottom: -44px;
        left: 0;
        z-index: 1;
        transform: rotate(181.4deg);
    }

    .column {
        width: 50%;
        padding: 0 5px;
    }

    .column_cat {
        width: 33.33333%;
        padding: 0 5px;
    }
}

/* 0 - 579 */
@media (max-width: 576px) {
    .panel_svg_top {
        position: absolute;
        top: -48px;
        left: 0;
        transform: rotate(0.5deg);
    }

    .panel_svg_bottom {
        position: absolute;
        bottom: -48px;
        left: 0;
        z-index: 1;
        transform: rotate(180.5deg);
    }

    .column {
        width: 100%;
        padding: 0 5px;
    }

    .column_cat {
        width: 100%;
        padding: 0 5px;
    }
}

/************************* Magnify for Zoom on Image *************************/

.img-magnifier-container {
    position: relative;
}

.img-magnifier-glass {
    position: absolute;
    border: 3px solid #ffc107;
    border-radius: 50%;
    cursor: none;
    /*Set the size of the magnifier glass:*/
    width: 250px;
    height: 250px;
}

@media (max-width: 991px) {
    .magnify_btn_display {
        display: none;
    }
}

/************************* Project Image Column *************************/

.column div {
    margin-top: 5px;
    width: 100%;
    overflow: hidden
}

    .column div img {
        margin-top: 5px;
        width: 100%;
    }

/************************* Category Image Column *************************/

.column_cat div {
    margin-top: 5px;
    width: 100%;
    overflow: hidden
}

    .column_cat div img {
        margin-top: 5px;
        width: 100%;
    }

/************************* About Page => Personal Element *************************/

@media (min-width: 576px) {
    .about_div_img {
        text-align: right;
    }
}

@media (max-width: 575px) {
    .about_div_img {
        text-align: center;
        margin-bottom: 1rem;
    }
}

/************************* Public *************************/

@media (min-width : 768px) and (max-width : 991px) {
    .element_display {
        display: none;
    }
}

@media (min-width: 768px) {
    .element_right {
        text-align: right;
    }
}

@media (max-width: 767px) {
    .element_margin_bottom {
        margin-bottom: 1rem;
    }

    .element_center {
        text-align: center;
    }
}

/************************* Footer Page *************************/

@media (max-width: 768px) {
    .footer_div_margin_bottom_768 {
        margin-bottom: 2rem;
    }
}

@media (max-width: 991px) {
    .footer_div_margin_bottom_991 {
        margin-bottom: 2rem;
    }
}

/************************* Manager Panel > ul *************************/

@media (max-width: 767px) {
    .manager_ul_margin_top {
        margin-top: 0.5rem;
    }
}

















/************************* CUSTOM CHECKBOX *************************/

.checkbox_label {
    display: block;
    position: relative;
    padding-right: 30px;
    font-size: 20px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* checkbox_label the browser's default checkbox */
    .checkbox_label input {
        position: absolute;
        opacity: 0;
        height: 22px;
        width: 22px;
        right: -2px;
        top: 5px;
        z-index: 1;
    }

/* Create a custom checkbox */
.checkbox_span {
    position: absolute;
    top: 5px;
    right: 0;
    height: 20px;
    width: 20px;
    background-color: rgba(0, 0, 0, 0.125);
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, 0.125);
    cursor: pointer
}

/* On mouse-over, add a grey background color */
.checkbox_label:hover input ~ .checkbox_span {
    /*background-color: #dc3545;*/
}

.checkbox_span:hover {
    background-color: #ffc107;
}

/* When the checkbox is checked, add a blue background */
.checkbox_label input:checked ~ .checkbox_span {
    background-color: #ffc107;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkbox_span:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.checkbox_label input:checked ~ .checkbox_span:after {
    display: block;
}

/* Style the checkmark/indicator */
.checkbox_label .checkbox_span:after {
    left: 7px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/************************* JQUERY UI SLIDER *************************/

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
    border-radius: 0.25rem !important;
}

.ui-slider .ui-slider-range {
    background: #6c757d !important;
}

.ui-slider-horizontal .ui-slider-handle {
    top: -.4em !important;
}

.ui-slider .ui-slider-handle {
    width: 1.5em !important;
    height: 1.5em !important;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border-radius: 100% !important;
    background: #ffc107 !important;
    border: none !important;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
    background: #138496 !important;
    cursor: pointer !important;
    border: none !important;
}

/************************* Sweet Alert *************************/
.swal-modal {
    padding: 1.25rem;
}
.swal-text {
    text-align: justify;
    color: #343a40 !important;
    margin-bottom: 1rem;
    padding: unset;
}

.swal-footer {
    text-align: center;
    padding: unset;
    margin-top: unset;
}

.swal-button {
    padding: 0.375rem 0.75rem;
    border: unset !important;
    box-shadow: unset !important;
    background-color: #343a40;
    color: #f8f9fa;
}

    .swal-button:hover {
        background-color: #ffc107 !important;
        color: #343a40;
    }

.swal-button-container {
    margin: unset;
}

.swal-icon {
    margin: 0 auto 1rem;
}

.swal-icon--info:after,
.swal-icon--info:before {
    background-color: #ffc107 !important;
}

.swal-icon--info {
    border-color: #ffc107 !important;
}

.swal-icon:first-child {
    margin-top: unset;
}
/************************* Google reCaptcha *************************/
.g-recaptcha {
    margin-bottom: 1rem;
}

    .g-recaptcha div {
        width: unset !important;
        height: unset !important;
    }

@media (min-width : 500px) and (max-width : 575px) {
    .g-recaptcha {
        transform: scale(0.9);
        -webkit-transform: scale(0.9);
    }
}

@media (min-width : 400px) and (max-width : 499px) {
    .g-recaptcha {
        transform: scale(0.8);
        -webkit-transform: scale(0.8);
    }
}

@media (min-width : 300px) and (max-width : 399px) {
    .g-recaptcha {
        transform: scale(0.5);
        -webkit-transform: scale(0.5);
    }
}

@media (max-width: 299px) {
    .g-recaptcha {
        transform: scale(0.4);
        -webkit-transform: scale(0.4);
    }
}

/************************* GOOGLE MAP PANEL *************************/

.google_map_panel iframe {
    width: 100%;
    height: 500px;
    border: none;
    border-radius: 0.25rem;
}

/************************* Contact Page => Map Element *************************/

@media (max-width: 991px) {
    .contact_element_margin_bottom {
        margin-bottom: 2rem;
    }
}

/*#region Page Scroll Bar*/
/*.progress_container {
    width: 100%;
    height: 5px;
    background: #6c757d;
    display: none;
}

.progress_bar {
    height: 5px;
    background: #ffc107;
    width: 0%;
}*/
/*#endregion*/

/************************* Spinner Color *************************/

.fa-spinner {
    color: #ffc107;
}

/************************* Light Gallery *************************/

.lg-backdrop.in {
    opacity: 0.75 !important;
}

.lg-outer {
    direction: ltr;
}

.lg-progress-bar .lg-progress {
    background-color: #ffc107 !important;
}

.lg-outer .lg-thumb-item.active,
.lg-outer .lg-thumb-item:hover {
    border-color: #ffc107 !important;
}

/************************* CUSTOM SELECT-OPTION *************************/

.selectbox {
    position: relative;
}

    .selectbox select {
        background-color: #343a40;
        color: #f8f9fa;
        width: 100%;
        border: none;
        -webkit-appearance: button;
        -moz-appearance: button;
        -webkit-appearance: none;
        -moz-appearance: none;
        outline: none;
        border-radius: 0.25rem;
        padding: 0.75rem;
        cursor: pointer;
        transition-duration: 0.5s;
        -webkit-transition-duration: 0.5s; /* Safari */
    }

        .selectbox select:hover {
            background-color: #ffc107;
            color: #343a40;
        }

    .selectbox .fa-caret-down {
        position: absolute;
        left: 10px;
        color: #f8f9fa;
    }

    .selectbox img {
        position: absolute;
        right: 10px;
        color: #f8f9fa;
        height: 25px
    }

@media (min-width: 576px) {
    .selectbox select {
        font-size: 1.25rem;
    }

        .selectbox select option {
            font-size: 1rem;
        }

    .selectbox .fa-caret-down {
        top: 10px;
        pointer-events: none;
    }

    .selectbox img {
        top: 14px;
        pointer-events: none;
    }
}

@media (max-width: 575px) {
    .selectbox select {
        font-size: 1rem;
    }

        .selectbox select option {
            font-size: .75rem;
        }

    .selectbox .fa-caret-down {
        top: 7px;
    }

    .selectbox img {
        top: 11px;
        pointer-events: none;
    }
}

/*#region ANALOG CLOCK*/
#clock_panel {
    display: flex;
    overflow: hidden;
}

    #clock_panel div {
        position: relative;
        width: 400px;
        height: 400px;
    }

        #clock_panel div img {
            position: absolute;
            top: 0;
            left: 0;
        }
/*#endregion*/

/*#region PLACEHOLDER*/
/* Chrome/Opera/Safari */
::-webkit-input-placeholder {
    /*color: #f8f9fa;*/
}

/* Firefox 19+ */
::-moz-placeholder {
    /*color: #f8f9fa;*/
}

/* IE 10+ */
:-ms-input-placeholder {
    /*color: #f8f9fa;*/
}

/* Firefox 18- */
:-moz-placeholder {
    /*color: #f8f9fa;*/
}
/*#endregion*/

/*#region SLIDERPRO*/
.sp-mask {
    /*border-radius: 0.25rem;*/
}

.slider-pro p.sp-layer {
    border-radius: 0.25rem;
    font-size: 1.25rem !important;
}

.sp-arrow:before,
.sp-arrow:after {
    background: rgba(248, 249, 250, 0.75);
}

.sp-arrow:hover:before,
.sp-arrow:hover:after {
    background: rgba(14, 118, 188, 0.75);
}

.sp-black {
    background: rgba(52, 58, 64, 0.75) !important;
    color: #f8f9fa !important;
}

.slider-pro a:hover p {
    background: rgba(14, 118, 188, 0.75) !important;
}

.sp-fade-full-screen {
    color: rgba(248, 249, 250, 0.75);
}

    .sp-fade-full-screen:hover {
        color: rgba(14, 118, 188, 0.75);
    }
/*#endregion*/

/*#region Pnecil | Share | Calendar | Like | Print*/
#pencil_button,
#share_button,
#calendar_button {
    width: 35px;
    height: 35px;
    background: #ffc107;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: .3s linear;
    position: relative;
}

    #pencil_button span,
    #share_button span,
    #calendar_button span {
        position: absolute;
        width: 100%;
        height: 100%;
        background: #343a40;
        color: #f8f9fa;
        transition: .6s linear;
        border-radius: 25px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #pencil_button a,
    #share_button a,
    #calendar_button a {
        flex: 1;
        font-size: 16px;
        color: #f8f9fa;
        text-align: center;
        transform: translateX(100%);
        opacity: 0;
        transition: 0.3s linear;
    }

        #pencil_button a i,
        #share_button a i,
        #calendar_button a i {
            line-height: 33px;
        }

    #pencil_button:hover,
    #share_button:hover,
    #calendar_button:hover {
        width: 150px;
        transform: scale(1.25);
    }

        #pencil_button:hover span,
        #share_button:hover span,
        #calendar_button:hover span {
            transform: translateX(100%);
            transition-delay: .3s;
        }

        #pencil_button:hover a,
        #share_button:hover a,
        #calendar_button:hover a {
            opacity: 1;
            transform: translateX(0);
        }

    #pencil_button a:nth-of-type(1),
    #share_button a:nth-of-type(1),
    #calendar_button a:nth-of-type(1) {
        transition-delay: 0.15s;
    }

    #share_button a:nth-of-type(2) {
        transition-delay: 0.3s;
    }

    #share_button a:nth-of-type(3) {
        transition-delay: 0.45s;
    }

    #share_button a:nth-of-type(4) {
        transition-delay: 0.6s;
    }

#pencil_button,
#share_button,
#calendar_button,
#print_button {
    margin-right: 1.5rem;
}

#like_button,
#print_button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 35px;
    width: 35px;
    border-radius: 100%;
    cursor: pointer;
    background: #343a40;
    transition: 0.5s;
}

    #like_button:hover,
    #print_button:hover {
        background: #ffc107;
        transform: scale(1.25);
    }
/*#endregion*/

/*#region Carousel*/
.carousel-details {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.carousel-details-background {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

    .carousel-details-background a {
        /*width: 150px;*/
    }

@media (max-width : 299px) {
    .carousel-details-background .carousel_title_1 {
        display: none;
    }

    .carousel-details-background .carousel_title_2 {
        display: none;
    }

    .carousel-details-background .carousel_title_3 {
        display: none;
    }
}

@media (min-width : 300px) and (max-width : 575px) {
    .carousel-details-background .carousel_title_1 {
        margin-bottom: 1rem;
        font-size: 1.5rem;
    }

    .carousel-details-background .carousel_title_2 {
        margin-bottom: 0.5rem;
        font-size: 1rem;
    }

    .carousel-details-background .carousel_title_3 {
        font-size: 0.75rem;
    }
}

@media (min-width : 576px) and (max-width : 767px) {
    .carousel-details-background .carousel_title_1 {
        margin-bottom: 1rem;
        font-size: 2.25rem;
    }

    .carousel-details-background .carousel_title_2 {
        margin-bottom: 0.5rem;
        font-size: 1.25rem;
    }

    .carousel-details-background .carousel_title_3 {
        font-size: 1rem;
    }
}

@media (min-width : 768px) and (max-width : 991px) {
    .carousel-details-background .carousel_title_1 {
        margin-bottom: 1rem;
        font-size: 3rem;
    }

    .carousel-details-background .carousel_title_2 {
        margin-bottom: 0.5rem;
        font-size: 1.75rem;
    }

    .carousel-details-background .carousel_title_3 {
        font-size: 1.25rem;
    }
}

@media (min-width : 992px) and (max-width : 1199px) {
    .carousel-details-background .carousel_title_1 {
        margin-bottom: 2rem;
        font-size: 4rem;
    }

    .carousel-details-background .carousel_title_2 {
        margin-bottom: 1rem;
        font-size: 2.25rem;
    }

    .carousel-details-background .carousel_title_3 {
        font-size: 1.5rem;
    }
}

@media (min-width : 1200px) {
    .carousel-details-background .carousel_title_1 {
        margin-bottom: 2rem;
        font-size: 5rem;
    }

    .carousel-details-background .carousel_title_2 {
        margin-bottom: 1rem;
        font-size: 3rem;
    }

    .carousel-details-background .carousel_title_3 {
        font-size: 2rem;
    }
}

.carousel_animation {
    animation-duration: 1.5s;
    animation-fill-mode: both;
}

.carousel_fadeinup {
    animation-delay: 0.5s;
    animation-name: CarouselFadeInUp;
}

.carousel_fadeinup_1 {
    animation-delay: 1.5s;
    animation-name: CarouselFadeInUp;
}

.carousel_fadeinup_2 {
    animation-delay: 2s;
    animation-name: CarouselFadeInUp;
}

.carousel_fadeindown {
    animation-delay: 1s;
    animation-name: CarouselFadeInDown;
}

.carousel_fadeindown_1 {
    animation-delay: 0.5s;
    animation-name: CarouselFadeInDown;
}

.carousel_fadeindown_2 {
    animation-delay: 1s;
    animation-name: CarouselFadeInDown;
}

@keyframes CarouselFadeInUp {
    0% {
        opacity: 0;
        transform: translateY(50px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}

@keyframes CarouselFadeInDown {
    0% {
        opacity: 0;
        transform: translateY(-50px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}
/*#endregion*/

/*#region ELHAM FORM*/
/*jahate inke .line embed dorosti kar konad bayad az required hatman estefade konam var type ellipse input ham nabayad email bashad*/
.elham-form .elham-input {
    position: relative;
    width: 100%;
    height: 40px;
}

    .elham-form .elham-input input,
    .elham-form .elham-input textarea,
    .elham-form .elham-input select {
        position: absolute;
        width: 100%;
        height: 100%;
        background: transparent;
        box-shadow: none;
        border: none;
        outline: none;
        z-index: 1;
    }

    .elham-form .elham-input .text {
        position: absolute;
        top: 0;
        right: 10px;
        line-height: 40px;
        transition: 0.5s;
        pointer-events: none;
        font-size: 16px;
        color: #343a40;
    }

    .elham-form .elham-input input:focus + .text,
    .elham-form .elham-input input:valid + .text,
    .elham-form .elham-input input:active + .text {
        top: -30px;
        right: 0;
        font-size: 14px;
    }

    .elham-form .elham-input .line {
        position: absolute;
        bottom: 0;
        display: block;
        width: 100%;
        height: 2px;
        background-color: #343a40;
        transition: 0.5s;
        border-radius: 2px;
        pointer-events: none;
    }

    .elham-form .elham-input input:focus ~ .line,
    .elham-form .elham-input input:valid ~ .line,
    .elham-form .elham-input input:active ~ .line {
        height: 100%;
        background-color: #ffc107;
    }

.elham-form .elham-textarea {
    position: relative !important;
    height: 100px;
}

    .elham-form .elham-textarea textarea {
        height: 100%;
        resize: none;
    }

    .elham-form .elham-textarea .text {
        line-height: 155px;
    }

    .elham-form .elham-textarea textarea:focus + .text,
    .elham-form .elham-textarea textarea:valid + .text {
        top: -85px;
        right: 0;
        font-size: 14px;
    }

    .elham-form .elham-textarea textarea:focus ~ .line,
    .elham-form .elham-textarea textarea:valid ~ .line {
        height: 100%;
        background-color: #ffc107;
    }

.elham-form .elham-option {
    position: relative !important;
    height: 40px;
}

    .elham-form .elham-option .text {
        top: -30px;
        right: 0;
        font-size: 14px;
    }

    .elham-form .elham-option .line {
        height: 100%;
        background-color: #ffc107;
    }
/*#endregion*/

/*#region Morvarid Hover*/
.morvarid-parent-hover {
    position: relative;
}

    .morvarid-parent-hover .morvarid-child-hover {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 0;
        border-radius: 0.25rem;
        height: 5px;
        transition: 0.5s;
    }

    .morvarid-parent-hover:hover .morvarid-child-hover,
    .morvarid-parent-hover:focus .morvarid-child-hover {
        width: 100%;
    }

.morvarid-parent-color-light {
    color: #f8f9fa;
}

    .morvarid-parent-color-light:hover,
    .morvarid-parent-color-light:focus {
        color: #f8f9fa;
    }

.morvarid-parent-color-dark {
    color: #343a40;
}

    .morvarid-parent-color-dark:hover,
    .morvarid-parent-color-dark:focus {
        color: #343a40;
    }

.morvarid-child-bg-light {
    background: #f8f9fa;
}

.morvarid-child-bg-dark {
    background: #343a40;
}

.morvarid-child-bg-warning {
    background: #ffc107;
}
/*#endregion*/

/*#region Owl Carousel Slider*/
.owl-carousel {
    direction: ltr;
}

    .owl-carousel .owl-nav {
        position: absolute;
        top: 40%;
        width: 100%;
        pointer-events: none;
    }

        .owl-carousel .owl-nav .owl-prev,
        .owl-carousel .owl-nav .owl-next {
            color: #343a40 !important;
            pointer-events: auto;
        }

        .owl-carousel .owl-nav .owl-prev {
            margin-left: 1rem;
        }

        .owl-carousel .owl-nav .owl-next {
            float: right;
            margin-right: 1rem;
        }

            .owl-carousel .owl-nav .owl-prev:hover,
            .owl-carousel .owl-nav .owl-next:hover {
                color: #ffc107 !important;
            }

    .owl-carousel .owl-item img {
        display: unset !important;
        width: unset !important;
    }
/*#endregion*/

/*#region TOPIC CARD*/
.a-cards {
    display: flex;
    justify-content: center;
}

    .a-cards a {
        width: 100%;
    }

    .a-cards .a-card {
        background: #f8f9fa;
        border-radius: 0.25rem;
        overflow: hidden;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        position: relative;
        transition: all 0.5s ease;
        height: 405px;
        /*box-shadow: 0px 20px 30px -10px rgba(0, 0, 0, 0.1);
        max-width: 320px;
        min-width: 280px;
        margin: 0 0 1rem;
        border: 1px solid #343a40;*/
    }

        .a-cards .a-card:before {
            width: calc(100% + 100px);
            content: "";
            position: absolute;
            border-radius: 0.25rem 0.25rem 100% 100%;
            transition: all 0.5s ease-out;
            top: 0;
            height: 175px;
            background-image: linear-gradient(to top, #343a40 0%, #ffc107 100%);
        }

        .a-cards .a-card article {
            z-index: 1;
            display: flex;
            align-items: center;
            flex-direction: column;
            text-align: center;
        }

            .a-cards .a-card article h5 {
                color: #f8f9fa;
                margin: 1rem;
                padding: 0;
                text-align: center;
                height: 48px;
                overflow: hidden;
                transition: 0.5s;
            }

            .a-cards .a-card article .a-pic {
                width: 165px;
                height: 165px;
                overflow: hidden;
                border-radius: 100%;
                box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.3);
                transition: all 0.5s ease;
                margin: 0;
            }

                .a-cards .a-card article .a-pic img {
                    width: 100%;
                }

            .a-cards .a-card article .a-desc {
                transition: all 0.5s ease-out;
                padding: 0;
                text-align: justify;
                color: #343a40;
                height: 125px;
                margin: 1rem;
                overflow: hidden;
                text-align: justify;
                direction: rtl;
            }

        .a-cards .a-card:hover {
            box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.3);
        }

            .a-cards .a-card:hover:before {
                height: 100%;
                border-radius: 0.25rem;
            }

            .a-cards .a-card:hover h5 {
                color: #343a40;
            }

            .a-cards .a-card:hover .a-pic {
                box-shadow: 0px 0px 0px 10px rgba(52, 58, 64, 0.5);
            }

                .a-cards .a-card:hover .a-pic img {
                    -webkit-filter: grayscale(0%);
                    filter: grayscale(0%);
                }

            .a-cards .a-card:hover .a-desc {
                color: #f8f9fa;
            }
/*#endregion*/

/*#region BRUSH HOVER*/
.brush-hover {
    position: relative;
    overflow: hidden;
    transition: 1s;
    border: none;
    min-width: 75px;
}

    .brush-hover .brush-hover-point {
        position: absolute;
        top: 0;
        left: 0;
        width: 50%;
        height: 100px;
        transition: transform 0.5s ease;
    }

        .brush-hover .brush-hover-point:nth-child(1) {
            transform-origin: 50% 0;
            transform: translate(-25%, -25%) rotate(-10deg) scale(1, 0);
        }

        .brush-hover .brush-hover-point:nth-child(2) {
            transform-origin: 50% 100%;
            transform: translate(15%, -25%) rotate(10deg) scale(1, 0);
            transition-delay: 0.2s;
        }

        .brush-hover .brush-hover-point:nth-child(3) {
            transform-origin: 50% 0;
            transform: translate(55%, -25%) rotate(-10deg) scale(1, 0);
            transition-delay: 0.4s;
        }

        .brush-hover .brush-hover-point:nth-child(4) {
            transform-origin: 50% 100%;
            transform: translate(100%, -25%) rotate(10deg) scale(1, 0);
            transition-delay: 0.6s;
        }

    .brush-hover .brush-hover-label {
        position: relative;
    }

    .brush-hover:hover > .brush-hover-point:nth-child(1) {
        transform: translate(-25%, -25%) rotate(-10deg) scale(1, 1);
    }

    .brush-hover:hover > .brush-hover-point:nth-child(2) {
        transform: translate(15%, -25%) rotate(10deg) scale(1, 1);
    }

    .brush-hover:hover > .brush-hover-point:nth-child(3) {
        transform: translate(55%, -25%) rotate(-10deg) scale(1, 1);
    }

    .brush-hover:hover > .brush-hover-point:nth-child(4) {
        transform: translate(100%, -25%) rotate(10deg) scale(1, 1);
    }

.brush-hover-dark {
    color: #f8f9fa;
    background-color: #343a40;
}

    .brush-hover-dark:hover {
        color: #343a40;
    }

.brush-hover-point-warning {
    background-color: #ffc107;
}
/*#endregion*/

/*#region FIXED BACKGROUND*/
.background-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    clip: rect(0, auto, auto, 0);
}

.background-image {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    -webkit-background-size: cover;
    background-position: center center;
}

.content-panel {
    position: relative;
}
/*#endregion*/

/*#region SCROLL TO TOP*/
#scroll_to_top {
    position: fixed;
    bottom: 15px;
    right: 10px;
    z-index: 11;
    display: none;
    background-color: #ffc107;
    transition: 0.5s;
}

    #scroll_to_top:hover {
        background-color: #343a40;
        color: #f8f9fa;
    }
/*#endregion*/

/*#region HD ACCORDION*/
.hd-accordion {
    display: flex;
}

.hd-accordion-item {
    position: relative;
    z-index: 1;
    flex: 1;
    overflow: hidden;
    transition: 0.7s cubic-bezier(0.79, 0.01, 0.25, 1);
}

    .hd-accordion-item .hd-accordion-bg {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        background-position: center center;
        background-size: cover;
        transition: 0.5s ease;
    }

    .hd-accordion-item .hd-accordion-content {
        flex: 1;
        background-color: #ffc107;
        opacity: 0;
        display: flex;
        justify-content: center;
        transition: 0.5s ease;
        overflow: hidden;
        height: 450px;
    }

        .hd-accordion-item .hd-accordion-content .hd-accordion-profile {
            display: flex;
            justify-content: center;
            text-align: center;
            flex-direction: column;
            opacity: 0;
            transition-delay: 0.5s;
            transition: 1s cubic-bezier(0.79, 0.01, 0.25, 1);
            /*transform: translateY(70px);*/
            transform: scale(0.5);
            -webkit-transform: scale(0.5);
        }

            .hd-accordion-item .hd-accordion-content .hd-accordion-profile a i {
                color: #343a40;
                transition: 0.5s;
            }

            .hd-accordion-item .hd-accordion-content .hd-accordion-profile a:hover i {
                transform: scale(1.25);
            }

    .hd-accordion-item:hover {
        flex-grow: 2;
    }

        .hd-accordion-item:hover .hd-accordion-content {
            opacity: 1;
        }

            .hd-accordion-item:hover .hd-accordion-content .hd-accordion-profile {
                opacity: 1;
                /*transform: translateY(0);*/
                transform: scale(1);
                -webkit-transform: scale(1);
            }
/*#endregion*/

/*#region Gradient Hover*/
.btn-gradient-success {
    background: linear-gradient(to right, #28a745, #218838, #28a745);
    color: #f8f9fa;
}

.btn-gradient-info {
    background: linear-gradient(to right, #17a2b8, #138496, #17a2b8);
    color: #f8f9fa;
}

.btn-gradient-dark {
    background: linear-gradient(to right, #343a40, #23272b, #343a40);
    color: #f8f9fa;
}

.btn-gradient-light {
    background: linear-gradient(to right, #f8f9fa, #e2e6ea, #f8f9fa);
    color: #343a40 !important;
}

.btn-gradient-warning {
    color: #f8f9fa;
}

.btn-gradient {
    transition: 0.5s;
    background-size: 200%;
}

    .btn-gradient:hover {
        background-position-x: 100%;
        transform: translateY(-7.5px);
    }

.btn-gradient-warning:hover {
    background: linear-gradient(to right, #ffc107, #e0a800, #ffc107);
    color: #343a40;
}

.btn-gradient-info:hover {
    color: #f8f9fa;
}

/*.btn-gradient:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 50%;
        height: 100%;
        background: rgba(255, 255, 255, 0.2);
    }*/

.btn-gradient:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: rgba(0, 0, 0, 1);
    border-radius: 50%;
    transform: scale(0);
    filter: blur(5px);
    transition: 0.5s;
    z-index: -1;
}

.btn-gradient:hover:before {
    transform: scale(1);
    bottom: -15px;
}
/*#endregion*/

/*#region SVG CHECKBOX*/
.hamid-checkbox {
    text-align: right;
}

    .hamid-checkbox input[type=checkbox] {
        display: none;
        pointer-events: none;
    }

        .hamid-checkbox input[type=checkbox] + label {
            cursor: pointer;
        }

            .hamid-checkbox input[type=checkbox] + label svg {
                width: 30px;
                stroke: #343a40;
                stroke-width: 7;
                fill: none;
            }

                .hamid-checkbox input[type=checkbox] + label svg .box {
                    stroke-dasharray: 300;
                    stroke-dashoffset: 0;
                }

                .hamid-checkbox input[type=checkbox] + label svg .check {
                    stroke-dasharray: 80;
                    stroke-dashoffset: 80;
                    fill: none;
                }

            .hamid-checkbox input[type=checkbox] + label span {

            }

        .hamid-checkbox input[type=checkbox]:checked + label .box {
            stroke-dashoffset: 300;
            transition: stroke-dashoffset 0.3s linear;
        }

        .hamid-checkbox input[type=checkbox]:checked + label .check {
            stroke: #28a745;
            stroke-dashoffset: 0;
            transition: stroke-dashoffset 0.3s linear;
        }

.reverse .box {
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 0.3s linear;
}

.reverse .check {
    stroke-dashoffset: 80;
    transition: stroke-dashoffset 0.3s linear;
}
/*#endregion*/

/*#region Morvarid Search Panel*/
.morvarid-search-panel {
    background-color: #ffc107;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    clip-path: circle(25px at calc(35px) calc(100% - 35px));
    transition: clip-path 1s;
    cursor: pointer;
    z-index: 12;
    position: fixed;
}

    .morvarid-search-open {
        clip-path: circle(100%);
        cursor: unset;
    }

    .morvarid-search-panel.morvarid-search-open .morvarid-search-icon {
        display: none;
    }

    .morvarid-search-panel .morvarid-search-icon {
        height: 50px;
        width: 50px;
        position: absolute;
        bottom: 10px;
        left: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 100%;
        color: #343a40;
        transition: 0.5s;
    }

        .morvarid-search-panel .morvarid-search-icon:hover {
            background: #343a40;
            color: #f8f9fa;
        }

    .morvarid-search-form {
        position: absolute;
        height: 50px;
        border: 2px solid #343a40;
        border-radius: 30px;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
    }

    .search-input {
        border: none;
        width: 100%;
        height: 100%;
        background: none;
        color: #343a40;
        outline: none;
        padding: 0 25px 0 50px;
        text-align: right;
    }

    .morvarid-search-btn {
        position: absolute;
        top: 3.5px;
        left: 3.5px;
        width: 40px;
        height: 40px;
        border-radius: 100%;
        border: none;
        outline: none;
        cursor: pointer;
        background: none;
        color: #343a40;
    }

        .morvarid-search-btn .fa-search {
            margin-top: 6px;
        }

        .morvarid-search-btn:hover {
            background: #343a40;
            color: #f8f9fa;
        }

    .morvarid-search-close {
        position: absolute;
        right: 10px;
        top: 10px;
        color: #343a40;
        border-radius: 100%;
        width: 50px;
        height: 50px;
    }

        .morvarid-search-close .fa-times {
            margin-top: 11px;
        }

        .morvarid-search-close:hover {
            background: #343a40;
            color: #f8f9fa;
        }

    @media (max-width: 575px) {
        .morvarid-search-form {
            width: 90%;
        }
    }

    @media (min-width : 576px) and (max-width : 767px) {
        .morvarid-search-form {
            width: 300px;
        }
    }

    @media (min-width : 768px) and (max-width : 991px) {
        .morvarid-search-form {
            width: 350px;
        }
    }

    @media (min-width : 992px) and (max-width : 1199px) {
        .morvarid-search-form {
            width: 400px;
        }
    }

    @media (min-width: 1200px) {
        .morvarid-search-form {
            width: 450px;
        }
    }
/*#endregion*/

/*#region Bimled Search Panel element_margin_bottom_max_767*/
#search_main_panel {
    position: fixed;
    bottom: 10px;
    left: 10px;
    background: #ffc107;
    height: 50px;
    border-radius: 40px;
    padding: 5px;
    z-index: 11;
    cursor: pointer;
    transition: 0.5s;
}

    #search_main_panel input {
        border: none;
        background: none;
        outline: none;
        float: left;
        padding: 0;
        color: #f8f9fa;
        font-size: 16px;
        line-height: 40px;
        width: 0px;
        transition: 0.5s;
    }

    #search_main_panel button {
        color: #343a40;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: #ffc107;
        display: flex;
        justify-content: center;
        align-items: center;
        border: none;
        display: none;
        cursor: pointer;
        float: right;
        transition: 0.5s;
    }

    #search_main_panel a {
        color: #343a40;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: none;
        display: flex;
        justify-content: center;
        align-items: center;
        float: right;
        transition: 0.5s;
    }

    #search_main_panel:hover {
        background: #343a40;
    }

        #search_main_panel:hover a {
            color: #f8f9fa;
        }

    #search_main_panel button:hover {
        background: #343a40;
        color: #f8f9fa;
    }

/*#search_main_panel:hover > input {
    width: 240px;
    margin: 0 10px;
}

#search_main_panel:hover > button {
    display: unset;
}

#search_main_panel:hover > a {
    display: none;
}*/

.search-input-open {
    margin: 0 10px;
}

@media (max-width : 399px) {
    .search-input-open {
        width: 160px !important;
    }

    .search-panel-open {
        bottom: 80px !important;
    }
}

@media (min-width : 400px) and (max-width : 575px) {
    .search-input-open {
        width: 180px !important;
    }

    .search-panel-open {
        bottom: 80px !important;
    }
}

@media (min-width : 576px) and (max-width : 767px) {
    .search-input-open {
        width: 150px !important;
    }
}

@media (min-width : 768px) and (max-width : 991px) {
    .search-input-open {
        width: 200px !important;
    }
}

@media (min-width : 992px) and (max-width : 1199px) {
    .search-input-open {
        width: 220px !important;
    }
}

@media (min-width : 1200px) {
    .search-input-open {
        width: 240px !important;
    }
}
/*#endregion*/

/*#region select2*/
.select2-container .select2-selection--single {
    height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px
}

.select2-search--dropdown .select2-search__field {
    height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px;
    left: 1px;
}
/*#endregion*/


/*#region label*/
.label {
    padding: .25rem .75rem;
    border: 1px solid transparent;
    border-radius: .75rem;
}

.label-primary {
    color: #004085;
    background-color: #cce5ff;
    border-color: #b8daff;
}

.label-secondary {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.label-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.label-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.label-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.label-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.label-light {
    color: #818182;
    background-color: #fefefe;
    border-color: #fdfdfe;
}

.label-dark {
    color: #1b1e21;
    background-color: #d6d8d9;
    border-color: #c6c8ca;
}
/*#endregion*/

/*#region select2*/
.select2 {
    width: 100% !important;
}
/*#endregion*/

/*#region overlay*/
.overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: black;
    z-index: 0;
    opacity: 0;
    display: none;
    transition: opacity linear 0.3s, z-index linear 0.3s;
    align-content: center;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 10px;
}

    .overlay.show {
        display: block;
        opacity: 0.4;
        z-index: 2150;
    }
/*#endregion*/