:root {
    /*3 colors Standard*/
    --Color1: #e31e24;
    /*--Color1: #ededed;*/ /* عاوز اعرف ليه اللون دا اساسى ؟؟؟؟؟*/
    --Color2: #e31e24;
    --Color3: #302757;
    /*For */
    --Color4: red;
    --Color5: #1d1e4c;
    --Color6: #0D0639;
    --Color7: #fff;
    /*Special case*/
    --opacity1: rgb(48 86 120 / 40%);
}


.bg-Color1 {
    background-color: var(--Color1) !important;
}
.bg-Color2 {
    background-color: var(--Color2) !important;
}
.bg-Color3 {
    background-color: var(--Color3) !important;
}
.bg-Color4 {
    background-color: var(--Color4) !important;
}
.bg-Color5 {
    background-color: var(--Color5) !important;
}
.bg-Color6 {
    background-color: var(--Color6) !important;
}
.Color1 {
    color: var(--Color1) !important;
}

.Color2 {
    color: var(--Color2) !important;
}

.Color3 {
    color: var(--Color3) !important;
}

.Color4 {
    color: var(--Color4) !important;
}

.Color5 {
    color: var(--Color5) !important;
}

.Color6 {
    color: var(--Color6) !important;
}
.Color7 {
    color: var(--Color7) !important;
}

.bg-theme-color-adv {
    background-color: var(--Color1) !important;
}

.bg-theme-colored, .btn-theme-colored, .PriceSchedule .PriceHead, .btn-default.btn-theme-colored, .panel-group .panel-title a.active {
    background-color: var(--Color1) !important;
}
/*.text-theme-colored,
.menuzord .menuzord-menu > li.active > a i, .menuzord .menuzord-menu > li:hover > a i, .menuzord .menuzord-menu ul.dropdown li:hover > a i {
    color: var(--Color1) !important;
}*/
.btn-theme-colored {
    border-color: var(--Color1) !important;
}

.overlay-theme-colored-9:before {
    background-color: var(--Color1) !important;
}
ul.list.theme-colored li:before, ul.list.theme-colored.angle-double-right li:before, ul.list.theme-colored.angle-right li:before, ul.list.theme-colored.check-circle li:before, ul.list.theme-colored.check li:before, .list-icon.theme-colored li i, .menuzord-menu > li > .megamenu .megamenu-row li:hover > a, .menuzord-menu > li > .megamenu .megamenu-row .post a:hover, .menuzord-menu > li > .megamenu .megamenu-row li:hover > a i, .menuzord-menu > li > .megamenu .megamenu-row .post a:hover i, .pricing-table .table-list li i, .testimonial-carousel.boxed .content::after, .blog-posts .post .entry-meta li i, .widget .address li i, .icon-box.box-style1.practice-style3 i, .attorney-carousel .content .contact-area i, .attorney-address li i, .icon-box.services-style1:hover .heading, .small-title i, .drop-caps.text-colored p:first-child:first-letter, .schedule-box:hover .schedule-details .title a, .widget.dark .nav-tabs li.active a, .pagination.theme-colored li a, .pager.theme-colored a, .widget .post-title a:hover, .volunteer .info .name a, .donation-form .form-group label, .team-block .team-thumb .team-overlay .styled-icons a:hover i, .section-title .title-icon i, .portfolio-filter a, .panel-group .panel-title a, .testimonials-details::after {
    color: var(--Color1);
}



.bg-theme-color-2, .line-bottom:after, .line-bottom-center:after,
.team-block .team-thumb .styled-icons a:hover,
.work-gallery .gallery-thumb .styled-icons a:hover,
.work-gallery:hover .gallery-bottom-part,
.line-bottom-theme-colored-2:after,
.panel-group .panel-title a.active::after {
    background: var(--Color2) !important;
}
.text-theme-color-2, .widget .twitter-feed li::after, .work-gallery .gallery-bottom-part .title {
color:var(--Color2) !important;
}
.border-left-theme-color-2-6px {
    border-left: 6px solid var(--Color2) !important;
}
.border-bottom-theme-color-2-2px {
    border-bottom: 2px solid var(--Color2) !important;
}
.border-bottom-theme-color-2-1px {
    border-bottom: 1px solid var(--Color2) !important;
}


.btn-theme-colored:hover {
    background-color: var(--Color3) !important;
}

.btn-primary {
    color: #fff;
    background-color: var(--Color1);
    border-color: var(--Color3);
}
.btn-primary:hover {
    color: #fff;
    background-color: var(--Color3);
    border-color: var(--Color1);
}

ol.breadcrumb.text-left.text-black.mt-10 {
    background-image: linear-gradient(to right, rgb(223 36 130), rgb(220 184 202 / 11%), rgb(255 255 255 / 0%));
}
.preloader-dot-loading {
    width: 200px;
}
#spinner {
    left: 42%;
}
.video-popup i.fa.fa-play-circle {
    font-size: 80px;
    color: #be0202;
    text-align: center !important;
    margin: -20px 0 0 0;
}
.video-popup.HomeSec i.fa.fa-play-circle {
    position: relative;
    margin: 50px 0 0 0;

}
.GotoFA i.fa.fa {
    font-size: 150px;
    color: var(--Color1) !important;
}

.GotoFA {
    font-size: 20px;
    color: var(--Color1) !important;
}
.video-popup {
    background-size: cover;
    position: relative;
    min-height: 250px;
}

    .video-popup a {
        left: 0;
        position: absolute;
        right: 0;
        text-align: center;
        top: 5vh;
    }

.footer, .layer-overlay.overlay-dark-9::before {
    background: var(--Color5) !important;
    width: auto;
}
.container-fluid.bg-Color6.p-20::before {
    background: var(--Color6) !important;
}
.horizontal-contact-widget .widget::before, .horizontal-contact-widget .each-widget::before {
    color: var(--Color3) !important;
}
.PriceSchedule .Category {
    background: var(--Color3) !important;
}

header#header .header-top {
    height: 30px;
}

header#header .header-middle {
    height: 100px;
}

.menuzord-brand img {
    max-height: 100%;
}
.menuzord-brand {
    padding: 15px 0;
    MARGIN: 0;
}

.SideBarNewse {
    background: #eee;
    margin: 15px 0;
    padding: 5px;
    border-radius: 5px;
    box-shadow: 0px 1px 3px var(--Color3);
    cursor: pointer;
    transition: .5s;
}
    .SideBarNewse:hover {
        box-shadow: 0 0 0;
        transition: .5s;
    }
ol.breadcrumb.text-left.text-black.mt-10 {
    background-image: linear-gradient(to left, rgb(255 255 255), rgb(255 255 255 / 11%), rgb(255 255 255 / 0%));
}
section.inner-header.divider.parallax.layer-overlay.overlay-dark-5 {
    top: -7px;
}

/*---------mohamed helmy for test ----------------*/
.bg-theme-colored {
    background-color: var(--Color3) !important;
}

.menuzord-menu > li > a {
    font-size: 14px;
}
.header .header-top .list-inline {
    overflow: hidden;
    height: 20px;
}
footer ul.list.angle-double-right li:before {
content:" "!important;
}
li.widget-title {
    color: white;
    font-size: 18px;
}
footer ul.list.angle-double-right.list-border {
    display: block;
    column-count: 3;
}
/*======================================================================For Table===================================================*/
table {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
}

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

    table thead th {
        vertical-align: bottom;
        border-bottom: 2px solid #dee2e6;
    }

    table tbody + tbody {
        border-top: 2px solid #dee2e6;
    }

#header .widget {
    float: left;
}
@media (max-width: 575.98px) {
    table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    header#header .header-middle {
        height: 100%;
    }

    .xs-pull-center {
        float: none !important;
    }
    .menuzord-brand img {
        max-height: 100PX;
    }
    .menuzord-responsive .menuzord-menu > li a {
        TEXT-ALIGN: CENTER !IMPORTANT;
    }
}

@media (max-width: 767.98px) {
    footer ul.list.angle-double-right.list-border {
        display: block;
        column-count: 2;
    }
    table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    header#header .header-middle {
        height: 100%;
    }

    .xs-pull-center {
        float: none !important;
    }
    .menuzord-brand img {
        max-height: 100PX;
    }
    .menuzord-responsive .menuzord-menu > li a {
        TEXT-ALIGN: CENTER !IMPORTANT;
    }

    .SiteName {
        color: white;
        font-size: 25px;
    }
    .widget {
        display: table-header-group;
    }
    /*Mohamed Helmy start edit*/
    .menuzord-responsive .showhide {
        position: absolute;
        top: -95px;
        /*background: #302757;*/
        color: white !important;
        /* margin: 0 0 0 0; */
        /* padding: 0 0 0 0; */
    }
    .menuzord-responsive .showhide {
        padding: 5px 0px 0px 0px !important;
    }
    .menuzord .showhide em {
        width: 25px;
        height: 5px;
        margin: 5px 20px 0;
        float: right;
        background: #302757;
        padding:0px !important;
    }
    .home .maxwidth500 {
        max-width: 100% !important;
    }
    /*Mohamed Helmy end edit*/
}

@media (max-width: 991.98px) {
    table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

        table {
            border: 0;
        }
}

@media (max-width: 1199.98px) {
    table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

        
}


table thead tr {
    background: var(--Color3) !important;
    color: white !important;
}
table tr:nth-child(odd)  {
    background: #ffffff;
    color: black;
}

table tr:nth-child(even)  {
    background: #eee;
    color: black;
}
table tr:hover {
    background: #eeeeee6b;
}

.parallax {
    background-attachment: local;
    background-position:top !important;
}