﻿div.row.filter {
    height: 0;
}

.row.filter ul {
    list-style: none;
    float: right;
    padding: 0;
}

    .row.filter ul > li {
        float: right;
        margin: 2px;
    }

        .row.filter ul > li > a {
            background-color: #32c5d2;
            color: #FFF;
            padding-left: 3px;
            padding-right: 3px;
            border-radius: 4px;
        }

a.active {
    color: #32c5d2;
}

project-item {
    display: block;
    opacity: 0;
    -webkit-animation: fade 400ms;
    animation: fade 400ms;
}

    project-item:not(div) {
        opacity: 1;
    }

@-webkit-keyframes fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.c-overlay-object {
    min-height: 100px;
}

.c-overlay-object {
    min-height: 100px;
}

.imagecontour {
    padding: 10px;
    border: solid 1px #EFEFEF;
    background-color: #FFFFFF;
}

.effect2 {
    position: relative;
}

    .effect2:before, .effect2:after {
        z-index: -1;
        position: absolute;
        content: "";
        bottom: 15px;
        right: 10px;
        width: 50%;
        top: 80%;
        max-width: 300px;
        background: #777;
        -webkit-box-shadow: 0 15px 10px #777;
        -ms-box-shadow: 0 15px 10px #777;
        box-shadow: 0 15px 10px #777;
        transform: rotate(3deg);
    }

    .effect2:after {
        -webkit-transform: rotate(-3deg);
        -moz-transform: rotate(-3deg);
        -ms-transform: rotate(-3deg);
        -o-transform: rotate(-3deg);
        transform: rotate(-3deg);
        left: 10px;
        right: auto;
    }

.img-responsive {
    width: 100%;
}

/*======================== General ========================*/
@font-face {
    font-family: 'DroidNaskh-Regular';
    src: url('../../../../fonts/DroidNaskh-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Bahij_TheSansArabic-Bold';
    src: url('../../../../fonts/Bahij_TheSansArabic-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Bahij_TheSansArabic-Light';
    src: url('../../../../fonts/Bahij_TheSansArabic-Light.ttf') format('truetype');
}

body, .form-control {
    font-family: 'Cairo', sans-serif;
}

h1, h2, h3, h4, h5, h6, a {
    font-family: 'Bahij_TheSansArabic-Light';
}

.c-content-login-form .modal-dialog .modal-content .modal-footer .c-btn-signup {
    float: none;
    display: block;
    margin-top: 14px;
}
/*================= Header ==================*/
@media (min-width: 992px) {
    .c-layout-header .c-navbar .c-mega-menu > .nav.navbar-nav > li > .c-link {
        letter-spacing: normal;
    }

    .c-layout-header.c-layout-header-4 {
        background: #ffffff;
        background: rgba(255, 255, 255, 0.8);
    }

    .c-layout-header .c-brand .c-desktop-logo {
        max-height: 80px;
    }

    .c-page-on-scroll.c-layout-header-fixed .c-layout-header .c-brand .c-desktop-logo-inverse {
        max-height: 52px;
    }

    .c-page-on-scroll.c-layout-header-fixed .c-layout-header .c-brand {
        margin: 6px 0 6px;
    }

    .c-layout-header .c-brand {
        margin: 10px 0 10px;
    }

    .c-layout-header .c-navbar .c-mega-menu.c-fonts-bold > .nav.navbar-nav > li > .c-link {
        font-weight: 700;
    }
}

.c-layout-header .c-brand .c-mobile-logo {
    margin-top: -13px;
    max-height: 52px;
}

/*=============== News ================*/
.c-content-media-1 {
    height: 100%;
}

    .c-content-media-1 .c-date {
        margin-bottom: 0;
        margin-top: 10px;
    }

    .c-content-media-1 .c-title {
        font-size: 24px;
        margin: 0 0 20px;
    }

.news-item div[class^="col-"] {
    padding: 0 10px;
}

.news-item {
    margin-bottom: 30px;
}

.c-content-media-1 p {
    font-size: 18px;
    line-height: normal;
}

/*================= Blog Grid ==================*/
.blog-grid .blog-grid-item {
    padding: 0 25px;
    margin-bottom: 30px;
}

.c-content-blog-post-card-1 .c-body .c-panel {
}
/*================= Testos ======================*/
.c-content-testimonials-4 .owl-theme .owl-controls .owl-nav div.owl-prev {
    background-position: 0px 3700%;
}

.c-content-testimonials-4 .owl-theme .owl-controls .owl-nav div.owl-next {
    background-position: 0px 3600%;
}

.c-content-testimonials-4 .c-content {
    line-height: normal;
}
/*================== Footer ======================*/
.c-layout-footer.c-layout-footer-4 .c-footer .c-links .c-nav > li > a {
    padding: 10px;
}

/*============ Hero Fullscreen Video =============*/
#hero-vid-container {
    position: relative;
    height: 100vh;
    width: 100%;
}

#hero-vid {
    position: fixed;
    top: 50%;
    left: 50%;
    -moz-min-width: 100%;
    -ms-min-width: 100%;
    -o-min-width: 100%;
    -webkit-min-width: 100%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url('/content/takamultheme/assets/base/img/layout/sliders/revo-slider/base/blank.png') no-repeat;
    -ms-background-size: cover;
    background-size: cover;
}

#play-vid-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    /*   background-color:rgba(255,255,255,0.5); */
}

    #play-vid-btn img {
        width: 100%;
        height: 100%;
        -ms-opacity: 0.7;
        opacity: 0.7;
    }

    #play-vid-btn:hover img {
        -ms-opacity: 1;
        opacity: 1;
    }

.c-content-product-4 {
    height: 400px;
}

    .c-content-product-4 .c-side-image {
        height: 400px;
    }

.news-media {
    -ms-background-size: cover;
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    min-height: 240px;
}

.entry-image .owl-controls {
    margin: 0;
    text-align: right;
    position: absolute;
    top: 30px;
    right: 30px;
}

.post-grid.grid-3 .entry {
    background: #fff;
}

.loading-gif {
    display: none;
}

@media (max-width:991px) {
    .c-layout-footer.c-layout-footer-4.c-bg-footer-8-rtl {
        background-position: 100% center;
    }
}

.c-layout-footer.c-layout-footer-4 .c-footer .c-feedback form .form-control {
    margin-bottom: 10px;
    margin-top: 10px;
}

.c-layout-footer.c-layout-footer-4 .c-footer .c-feedback form span {
    margin-top: -5px;
    margin-bottom: 15px;
}

.g-recaptcha > div {
    margin: 0 auto;
}

.rc-anchor-dark {
    background: transparent;
    border: 1px solid #8cdde4;
}

.c-layout-footer.c-layout-footer-4 .c-footer {
    padding: 40px 0;
}

.c-content-feature-2 {
    padding: 30px;
    margin-bottom: 10px;
}

    .c-content-feature-2 .c-icon-wrapper {
        float: none;
        margin: 0 auto 20px;
    }

#social-sharing {
    position: fixed;
    left: 5px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 46px;
}

    #social-sharing a {
        margin: 5px 0;
    }

.entry-content {
    clear: both;
}

.entry-title h2 {
    letter-spacing: normal;
}

.c-content-tab-2.c-opt-1 > .c-tab-content {
    background-color: #f7f5f6;
}

.c-content-tab-2.c-opt-1 > .nav li.active > .c-arrow:before {
    border-bottom-color: #f7f5f6;
}

.c-content-tab-2 > .c-tab-content .c-tab-pane p {
    color: #666;
}

.post-grid.post-masonry .entry {
    border-bottom: 2px solid #ddd;
}

.post-grid.post-masonry .entry-title,
.post-grid.post-masonry .entry-meta,
.post-grid.post-masonry .entry-content {
    padding: 0 16px;
}

.c-media.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 35px;
    height: 0;
    overflow: hidden;
}

    .c-media.video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.related-media .c-title {
    padding: 4px 8px 8px;
}

.c-layout-footer.c-layout-footer-4 .c-footer .c-about {
    line-height: normal;
}

.c-content-bar-4 > h3 {
    margin: 60px auto 40px auto;
}

.c-content-testimonials-4 .owl-nav {
    top: 150px;
}
/*============= Parallax Blocks ==============*/
@media (min-width: 992px){
    .c-content-feature-4 .c-feature-bg, .c-content-feature-4 .c-content-area, .c-content-feature-4 .c-feature-content {
        width: 50%;
    }
}

.c-layout-page {
    overflow: hidden;
}

#about-beneficiaries .c-content-list-1 > li {
    color: #fff;
    font-size: 14px;
}

#about-how-it-works .tab-content .tab-pane, #aboutPage .tab-content .tab-pane {
    padding: 2em 1.4em;
}
#aboutPage .c-content-tab-4.c-opt-3 > .tab-content {
    background-color: #fff;
}
.c-content-tab-4.c-opt-3 > .nav > li > a {
    background-color: #b2b5b6;
}

.c-content-tab-4.c-opt-3 > .nav > li:nth-child(even) > a {
    background-color: #b2b5b6;
}

#about-partners .c-name, #about-partners .c-position, #about-partners .c-socials {
    float: none;
    display: block;
    text-align: center;
}

#about-partners .c-position {
    margin-top: 10px;
    margin-bottom: 8px;
}

#preferances .form-horizontal .checkbox, .form-horizontal .radio {
    height: 120px;
    padding-top: 0;
    margin-bottom: 20px;
}

#preferances .checkbox label, #preferances .c-checkbox label {
    height: 100%;
    width: 90%;
    display: table;
    text-align: center;
    padding: 1em;
    border-radius: 1em;
    border: 2px solid #3bc5d0;
    color: #3bc5d0;
    margin: 0 auto;
    font-size: 1.2em;
    transition: all ease-out 0.3s;
}

#preferances .checkbox span, #preferances .c-checkbox span {
    display: table-cell;
    vertical-align: middle;
    position: relative;
}

#preferances .checkbox input, #preferances .c-checkbox input[type=checkbox] {
    display: none;
}

#preferances .checkbox label.selected {
    background: #c8f4f8;
    border-color: #249aa3;
    color: #249aa3;
}

#preferances .checkbox span:after, #preferances .c-checkbox span:after {
    position: relative;
    content: " ";
    display: block;
    width: 0;
    margin: 0 auto;
    height: 2px;
    top: 10px;
    background: transparent;
    transition: all ease-in-out 0.3s;
}

#preferances .checkbox .selected span:after, #preferances .c-checkbox .selected span:after {
    width: 30%;
    background: #249aa3;
}

.c-layout-header .c-cart-menu {
    width: 215px;
}

.message-avatar {
    padding-left: 0;
    padding-right: 0;
}

div.c-photo > img:first-child {
    border-radius: 50%;
}

.c-content-tab-4 > .tab-content .c-tab-items {
    padding: 15px;
}


.c-content-tab-1 .nav.tabs-left, .c-content-tab-1 .nav.nav-justified.tabs-left {
    padding-top: 20px;
    overflow-y: auto;
    max-height: 420px;
}

.c-content-tab-1 .tab-content.c-padding-sm {
    padding: 20px 0px 10px 20px;
}

.chat-history {
    max-height: 320px;
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 20px;
}

.chat-header {
    padding: 10px;
    border-bottom: 1px solid #eee;
}

    .chat-header img {
        width: 50px;
        float: left;
        border-radius: 50%;
        margin: 0 6px;
    }

    .chat-header .chat-about {
        float: right;
        margin-right: 10px;
        margin-top: 10px;
    }

    .chat-header .chat-topic {
        font-weight: bold;
        margin-bottom: 5px;
    }

    .chat-header .chat-name {
        float: left;
        margin: 12px 6px 0;
    }

    .chat-header .chat-date {
        color: #999;
    }

.chat-history ul {
    list-style: none;
    padding: 0;
}

.chat-history li {
    margin-bottom: 22px;
}

    .chat-history li div {
        border-radius: 20px;
        max-width: 85%;
        position: relative;
        padding: 20px;
    }

    .chat-history li.me div {
        background: #f7f7f7;
        float: right;
        text-align: right;
    }

    .chat-history li.them div {
        background: #e8f8f8;
        float: left;
        text-align: right;
    }

    .chat-history li div:before {
        position: absolute;
        top: 30px;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        pointer-events: none;
        border-width: 11px;
    }

    .chat-history li.me div:before {
        border-left-color: #f7f7f7;
        right: -21px;
        left: auto;
    }

    .chat-history li.them div:before {
        border-right-color: #e8f8f8;
        left: -21px;
        right: auto;
    }

    .chat-history li div small {
        color: #888;
    }

.c-content-tab-1 .nav.tabs-left > li > a {
    text-overflow: ellipsis;
    text-align: right;
    width: 100%;
}

    .c-content-tab-1 .nav.tabs-left > li > a span.badge {
        position: relative;
        float: left;
        margin: 0 5px;
        padding: 4px;
        width: 24px;
        text-align: center;
        line-height: 16px;
        font-size: 14px;
        border-radius: 50%;
        background: #5bc2ce;
        color: #fff;
    }


.ltr-dir {
    direction: ltr;
    text-align: right;
    float: left;
}


#initiative_details .c-layout-sidebar-menu {
    float: none;
}

#initiative_details .c-layout-sidebar-content {
    padding: 30px 0 30px 30px;
}

.c-shop-product-details-2 .c-product-meta > .c-product-short-desc {
    clear: both;
}

.c-progress-bar-line {
    margin-bottom: -10px;
}

    .c-progress-bar-line svg {
        transform: rotateY(180deg);
    }

    .c-progress-bar-line .progressbar-text {
        text-align: left;
    }

#init-attachments .init-gallery a, #init-attachments .init-gallery img {
    height: 150px;
    width: auto;
}

#init-attachments .init-gallery a {
    margin: 0px 0px 20px 12px;
    display: block;
    float: right;
}

#init-attachments .init-links a {
    margin-bottom: 20px;
    display: block;
}

    #init-attachments .init-links a i {
        margin-left: 8px;
    }

label {
    margin-bottom: 0;
}

.c-content-title-1 > h3 {
    margin-bottom: 10px;
}

@media (min-width: 992px) {
    .c-layout-header .c-navbar .c-mega-menu > .nav.navbar-nav > li > .c-btn-icon {
        background: none;
        outline: none;
        transition: margin 0.2s;
        margin: 20px 5px 10px 5px;
    }
}

.c-cart-menu .c-cart-menu-items i {
    margin-left: 6px;
}

.c-shop-product-tab-1 .tab-content .c-product-desc {
    padding: 15px 0;
    font-family: 'DroidNaskh-Regular';
}

.c-content-testimonials-4 .c-content {
    font-weight: 600;
}

.c-content-client-logos-slider-1 .item img {
    margin: 0 auto;
}

#captcha > div {
    margin: 0 auto;
}

.ribbon {
    position: absolute;
    left: 11px;
    z-index: 9;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
    margin-top: -5px;
}

    .ribbon span {
        font-size: 10px;
        font-weight: bold;
        color: #FFF;
        text-transform: uppercase;
        text-align: center;
        line-height: 20px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        width: 100px;
        display: block;
        background: #eb5d68;
        box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
        position: absolute;
        top: 19px;
        left: -21px;
    }

        .ribbon span::before {
            content: "";
            position: absolute;
            left: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid #4725A7;
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #4725A7;
        }

        .ribbon span::after {
            content: "";
            position: absolute;
            right: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid transparent;
            border-right: 3px solid #4725A7;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #4725A7;
        }

    .ribbon.c1 span {
        background-color: #40c6d1;
    }

    .ribbon.c2 span {
        background-color: #7e8379;
    }

.col-md-2 p {
    font-size: 80%;
}


#send-message-btn {
    background-color: #5bc2ce;
    border: none;
    color: white;
    margin-top: 10px;
}


.topic-item {
    display: inline-block;
    width: 100%;
}

    .topic-item img {
        width: 60px;
        height: auto;
        border-radius: 45%;
        float: right;
        margin: 5px;
    }

    .topic-item span.badge {
        position: relative;
        top: 5px;
    }

    .topic-item p{
        top: 15px;
        position: relative;
        margin-left: 40px;
    }

        .topic-item>span {
            float: left;
            font-size: 12px;
            bottom: 5px;
            display: block;
            position: relative;
            clear: both;
            margin-left: 15px;
        }
.c-content-login-form .modal-dialog .modal-content {
    margin-top: 100px;
}
projects {
    min-height: 200px;
}
#ngLoader {
    height: 200px; width: 100%; text-align: center;padding-top: 60px;
}
.c-content-tab-1 .nav.tabs-left, .c-content-tab-1 .nav.nav-justified.tabs-left {
    padding-bottom: 40px;
}
.topic-item .dropdown {
    position: absolute;
    left: 10px;
    top: 15px;
}
.topic-item .dropdown-menu {
    top: 110%;
    left: 0;
}
.btn-decide {
    border: 0;
    background: #fff;
    border-radius: 50%;
    opacity: 0; 
}
.btn-decide {
    border: 0;
    background: #fff;
    border-radius: 50%;
    opacity: 0; 
}

.nav-tabs li:hover .topic-item .btn-decide, .nav-tabs li.active .topic-item .btn-decide {
    opacity: 1;
}
#page-header {
    height: 200px; background-image: url('/Content/Images/About/header.jpg'); background-position: center center; background-size: cover; text-align: center;    
}
#page-header>div {
    padding: 80px 20px;    
}
#about-video {
    width: 100%;
    max-width: 800px;
    margin: 20px auto 50px;
}
#aboutPage .c-content-feature-10 > .c-list {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
#aboutPage .c-content-feature-10 > .c-list > li > .c-card {
    padding: 20px;
}
#aboutPage .c-content-feature-10 > .c-list > li > .c-card > i {
    width: 40px;
    height: 40px;
    padding: 5px;
}
#aboutPage .c-content-feature-10 > .c-list > li > .c-card > .c-content-left {
    padding-right: 50px;
}
#aboutPage .c-content-feature-10 > .c-list > li > .c-card > .c-float-left {
    margin-left: 20px;
}
#aboutPage button.close {
    font-size: 40px;
    margin-right: 5px;
    margin-top: 5px;
    color: #32c5d2;
}
#btn-about {
    box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.4);
}
#aboutPage.collapsing, #aboutPage.collapse {
    transition: height 2s ease-in;
}
@media (min-width: 992px){
    .c-layout-header-fullscreen.c-layout-header-static .c-layout-header, .c-layout-header-fixed .c-layout-header {
        z-index: 9980;
    }
}
@media (max-width: 991px){
    .c-layout-header-fullscreen.c-layout-header-mobile-fixed.c-layout-header-static .c-layout-header, .c-layout-header-fixed.c-layout-header-mobile-fixed .c-layout-header {
        z-index: 9985;
    }
}

#beta-label {
    background: #e35f66; width: 20px; height: 100%; position: absolute; right: 0px; color: #fff;
}
#beta-label span {
    transform: rotate(90deg); display: block; position: absolute; top: 50%; right: -20px; transform-origin: top;
}
@media (min-width: 992px) {
    #beta-label span {
        right: -8px;
    }
}
