Your IP : 216.73.216.111


Current Path : /home/icmq6107/clients/naddaf/wp-content/themes/crowdngo/sass/template/
Upload File :
Current File : /home/icmq6107/clients/naddaf/wp-content/themes/crowdngo/sass/template/_elements.scss

// title heading
.widget-text-heading {
    margin: 0;
    .title {
        font-size: 36px;
        font-weight: 400;
        margin: 0 0 5px;
    }
    .des {
        font-size: 13px;
    }
    &.center {
        text-align: center;
    }
}

.elementor-widget-crowdngo_heading {
    .crowdngo-heading-title {
        margin: 0 0 15px;
    }    
}

// widget vertical menu
.vertical-wrapper {
    position: relative;
    .title-vertical {
        color: $white;
        background: $theme-color;
        font-size: 18px;
        text-transform: capitalize;
        padding: 13px 20px;
        margin: 0;
        cursor: pointer;
        i {
            font-size: 16px;
            @include rtl-margin-right(15px);
        }
        .show-down {
            font-size: 18px;
            margin: 3px 0 0;
            @include rtl-float-right();
        }
    }
    .content-vertical {
        padding: 0;
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100% !important;
        z-index: 8;
    }
    &.show-always {
        .content-vertical {
            display: block;
        }
    }
}

body.home {
    .vertical-wrapper.show-in-home {
        .content-vertical {
            display: block;
        }
    }
}

.apus-vertical-menu {
    padding: 14px;
    background: $white;
    margin: 0;
    list-style: none;
    border-width: 0 1px 1px;
    border-style: solid;
    border-color: $border-color;
    > li {
        display: block;
        width: 100%;
        border-bottom: 1px dashed $border-color;

        &:last-child {
            border: none;
        }

        >a {
            font-size: 16px;
            padding: 0;
            line-height: 40px;
            background: transparent !important;

            >i,
            >img {
                font-size: 22px;
                @include rtl-margin-right(15px);
                width: 18px;
                display: inline-block;
                color: $theme-color;
            }

            .caret {
                @include rtl-float-right();
                margin: 22px 0 0;
                @include rotate(0deg);
                @include transition(all 0.2s ease-in-out 0s);
            }
        }

        .apus-container {
            padding: 10px 35px;
        }

        &:hover,
        &.active {
            >a {
                color: $theme-color;
            }
        }
    }

    li:hover {
        >.dropdown-menu {
            @include opacity(1);
            visibility: visible;
        }
    }

    .text-label {
        font-size: 12px;
        vertical-align: super;
        @include rtl-margin-left(5px);
        color: $theme-color;
        font-family: $headings-font-family;

        &.label-hot {
            color: $brand-danger;
        }

        &.label-new {
            color: $brand-success;
        }
    }

    .dropdown-menu {
        min-width: 240px;
        visibility: hidden;
        padding: 20px;
        font-size: 14px;
        @include border-radius(0);
        display: block;
        @include opacity(0);
        @include transition(all 0.2s ease-in-out 0s);
        border: none;
        @include box-shadow(0 0 5px 0 rgba(0, 0, 0, 0.15));

        >li {
            >a {
                color: $link-color;
                background: transparent !important;
                padding: 0;

                >i,
                >img {
                    font-size: 20px;
                    @include rtl-margin-right(10px);
                    width: 15px;
                    display: inline-block;
                }

                .caret {
                    @include rtl-float-right();
                    margin: 12px 0 0;
                    @include rotate(0deg);
                    @include transition(all 0.2s ease-in-out 0s);
                }
            }

            &:hover,
            &.active,
            &:active {
                >a {
                    color: $theme-color;
                }
            }
        }

        .wpb_button,
        .wpb_content_element,
        ul.wpb_thumbnails-fluid>li,
        .widget {
            margin: 0;
        }

        .widget .widget-title,
        .widget .widgettitle,
        .widget .widget-heading {
            margin: 0 0 10px;
            font-size: 18px;
            padding: 0;

            &:after,
            &:before {
                display: none;
            }
        }
    }

    .aligned-left {
        >a {
            &:hover {
                .caret {
                    @include rotate(-90deg);
                }
            }
        }

        >.dropdown-menu {
            top: -10px;
            left: 100%;
        }
    }

    .aligned-right {
        >a {
            &:hover {
                .caret {
                    @include rotate(90deg);
                }
            }
        }

        >.dropdown-menu {
            top: -10px;
            right: 100%;
            left: inherit;
        }
    }
}

// apus_custom_menu
.apus_custom_menu {
    &.center {
        text-align: center;

        li {
            display: inline-block;
            margin: 0 15px;
        }
    }

    &.left {
        text-align: left;
    }

    &.right {
        text-align: right;
    }

    &.inline {
        li {
            display: inline-block;
            vertical-align: middle;
            margin-bottom: 0;
            @include rtl-margin-right(20px);

            @include media(desktop) {
                @include rtl-margin-right(40px);
            }

            &:last-child {
                margin: 0;
            }
        }
    }
}

// slick
.slick-carousel {
    position: relative;
    margin-right: - ($theme-margin / 2);
    margin-left: - ($theme-margin / 2);
    .slick-arrow {
        background-color: $theme-color;
        padding: 0;                
        text-align: center;
        line-height: 1;
        font-size: 14px;
        color: $white;
        position: absolute;
        top: 50%;
        z-index: 3;
        text-align: center;        
        border: none;        
        @include transition($linear);
        @include inline-block();
        @include square(50px);        
        @include translate(0, -50%);        
        @include box-shadow(none);
        @include border-radius(50px);
        @include media(desktop) {
            @include opacity(0);
        }
        .textnav {
            display: none;
        }
        @include hover-focus-active() {
            background-color: $gray-base;
            color: $white;
        }
    }

    .slick-prev {
        @include rtl-left(0);     
        @include rtl-margin-left(-10px);
    }

    .slick-next {
        @include rtl-right(0);     
        @include rtl-margin-right(-10px);   
    }

    @include hover-focus-active() {
        .slick-arrow {
            @include opacity(1);                                    
        }
    }

    .slick-slide {
        outline: none !important;
        padding-left: $theme-margin / 2;
        padding-right: $theme-margin / 2;        
    }

    &.show-text {
        .textnav {
            display: inline-block;
            margin: 0 2px;
        }

        .slick-arrow {
            @include size(auto, auto);
            background: transparent !important;
            font-weight: $font-weight-medium;
            font-size: 12px;
            color: $link-color;

            &:hover,
            &:active,
            &:focus {
                color: $theme-color;
            }
        }

        .slick-prev {
            left: $theme-margin / 2;
            right: inherit;
        }

        .slick-next {
            right: $theme-margin / 2;
            left: inherit;
        }
    }

    &.p-bottom {
        .slick-list {
            padding-bottom: 5px;
        }

        .slick-arrow {
            top: 100%;
            @include translateY(-100%);
        }
    }

    .slick-track {
        margin: inherit;
    }

    // dots
    .slick-dots {
        margin: 0;
        padding: 10px 0 0;

        @include media(desktop) {
            padding: 20px 0 0;
        }

        text-align: center;
        list-style: none;
        line-height: 1;

        li {            
            margin: 0 8px;
            position: relative;
            @include inline-block();
            @include square(14px);
            @include media(desktop) {
                margin: 0 5px;
            }
            button {
                border: none;
                display: block;
                text-indent: -9999em;                                
                padding: 0;
                background: #dddcda;
                @include square(9px);
                @include center-box(absolute);
                @include border-radius(8px);
                @include transition-all();
            }

            &.slick-active button {
                background: $theme-color;                
                @include square(100%);
            }
        }
    }
}

.slick-carousel-top {
    .slick-arrow {
        @include border-radius(0px);
        top: -75px;
        @include translate(0, 0);
        @include opacity(1);
        margin: 0 !important;
    }

    .slick-next {
        right: 15px;
    }

    .slick-prev {
        left: inherit;
        right: 45px;
    }
}

// carousel
/* 
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
    -webkit-animation-duration: 1000ms;
    animation-duration: 1000ms;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.owl-carousel .owl-animated-in {
    z-index: 0;
}

.owl-carousel .owl-animated-out {
    z-index: 1;
}

.owl-carousel .fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}

/* 
 *  Owl Carousel - Auto Height Plugin
 */
.owl-height {
    -webkit-transition: height 500ms ease-in-out;
    -moz-transition: height 500ms ease-in-out;
    -ms-transition: height 500ms ease-in-out;
    -o-transition: height 500ms ease-in-out;
    transition: height 500ms ease-in-out;
}

.owl-carousel-top .owl-carousel,
.owl-carousel-top.owl-carousel {

    .owl-controls .owl-nav .owl-next,
    .owl-controls .owl-nav .owl-prev {
        @include opacity(1);
        background: #aaaaaa;
        border: none;
        color: $white;

        &:hover,
        &:active {
            background: #222222;
            color: $white;
        }
    }

    .owl-controls {
        top: -70px;
        width: 108px;
        @include rtl-right(0);
        @include translateY(0px);
    }
}

/* 
 *  Core Owl Carousel CSS File
 */
.owl-carousel {
    display: none;
    -webkit-tap-highlight-color: transparent;
    /* position relative and z-index fix webkit rendering fonts issue */
    position: relative;
    z-index: 1;
    margin-right: -($theme-margin / 2);
    margin-left: -($theme-margin / 2);
    cursor: pointer;

    &:hover {

        .owl-controls .owl-nav .owl-prev,
        .owl-controls .owl-nav .owl-next {
            @include opacity(1);
        }
    }
}

.owl-controls {
    .owl-dots {
        text-align: center;

        .owl-dot {
            cursor: pointer;
            margin: 0 5px;
            @include size(11px, 11px);
            @include border-radius(50%);
            display: inline-block;
            border: 2px solid #646a7c;
            background: #646a7c;

            &.active {
                border-color: $theme-color;
                background: $theme-color;
            }
        }
    }
}

.nav-bottom.owl-carousel {
    padding-bottom: 55px;

    .owl-controls {
        top: 100%;
    }
}

.nav-white {
    .owl-controls .owl-dots .owl-dot {
        border-color: $theme-color;
        background: transparent;

        &:hover,
        &.active {
            background: $white;
            border-color: $theme-color;
        }
    }
}

.nav-small {

    .owl-controls .owl-nav .owl-prev,
    .owl-controls .owl-nav .owl-next {
        @include size(30px, 30px);
        line-height: 28px;
        border-width: 1px;
        font-size: 18px;
    }
}

.nav-white {

    .owl-controls .owl-nav .owl-prev,
    .owl-controls .owl-nav .owl-next {
        border-color: rgba(255, 255, 255, 0.5);
        color: rgba(255, 255, 255, 0.5);

        &:hover,
        &:active {
            border-color: $theme-color;
            background-color: $theme-color;
            color: $white;
        }
    }
}

.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
}

.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    /* fix for flashing background */
    -webkit-transform: translate3d(0px, 0px, 0px);
}

.owl-carousel .owl-controls {
    position: absolute;
    top: 50%;
    width: 100%;
    @include translateY(-50%);
}

.owl-controls .owl-nav .owl-prev,
.owl-controls .owl-nav .owl-next {
    cursor: pointer;
    display: inline-block;
    @include opacity(0);
    text-align: center;
    @include transition(all 0.3s ease);
    position: absolute;
    @include translateY(-50%);
    border: 2px solid $theme-color;
    top: 50%;
    left: 15px;
    z-index: 99;
    color: $theme-color;
    font-size: 30px;
    @include size(48px, 48px);
    @include border-radius(50%);
    line-height: 42px;
    background: transparent;

    &:active,
    &:hover {
        background: $theme-color;
        color: $white;
        border-color: $theme-color;
    }
}

.owl-carousel .owl-controls .owl-nav .owl-next {
    left: inherit;
    right: 15px;
}

.owl-carousel.owl-loaded {
    display: block;
}

.owl-carousel.owl-loading {
    opacity: 0;
    display: block;
}

.owl-carousel.owl-hidden {
    opacity: 0;
}

.owl-carousel .owl-refresh .owl-item {
    display: none;
}

.owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding-right: $theme-padding / 2;
    padding-left: $theme-padding / 2;
}

.owl-carousel.owl-text-select-on .owl-item {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}

.owl-carousel .owl-grab {
    cursor: move;
    cursor: -webkit-grab;
    cursor: -o-grab;
    cursor: -ms-grab;
    cursor: grab;
}

.owl-carousel.owl-rtl {
    direction: rtl;
}

.owl-carousel.owl-rtl .owl-item {
    float: right;
}

/* No Js */
.no-js .owl-carousel {
    display: block;
}

/* 
 *  Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item .owl-lazy {
    opacity: 0;
    -webkit-transition: opacity 400ms ease;
    -moz-transition: opacity 400ms ease;
    -ms-transition: opacity 400ms ease;
    -o-transition: opacity 400ms ease;
    transition: opacity 400ms ease;
}

/* 
 *  Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
    position: relative;
    height: 100%;
    background: #000;
}

.owl-carousel .owl-video-play-icon {
    position: absolute;
    height: 80px;
    width: 80px;
    left: 50%;
    top: 50%;
    margin-left: -40px;
    margin-top: -40px;
    background: url("owl.video.play.png") no-repeat;
    cursor: pointer;
    z-index: 1;
    -webkit-backface-visibility: hidden;
    -webkit-transition: scale 100ms ease;
    -moz-transition: scale 100ms ease;
    -ms-transition: scale 100ms ease;
    -o-transition: scale 100ms ease;
    transition: scale 100ms ease;
}

.owl-carousel .owl-video-play-icon:hover {
    -webkit-transition: scale(1.3, 1.3);
    -moz-transition: scale(1.3, 1.3);
    -ms-transition: scale(1.3, 1.3);
    -o-transition: scale(1.3, 1.3);
    transition: scale(1.3, 1.3);
}

.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
    display: none;
}

.owl-carousel .owl-video-tn {
    opacity: 0;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    -webkit-transition: opacity 400ms ease;
    -moz-transition: opacity 400ms ease;
    -ms-transition: opacity 400ms ease;
    -o-transition: opacity 400ms ease;
    transition: opacity 400ms ease;
}

.owl-carousel .owl-video-frame {
    position: relative;
    z-index: 1;
}

//wpb_gmaps_widget
.wpb_gmaps_widget.wpb_content_element {
    margin: 0;
}

.widget-googlemap {
    position: relative;

    .apus-google-map {
        z-index: 1;
    }

    .map-content {
        position: absolute;
        top: 0;
        left: 0;
        @include size(100%, 100%);
    }

    .content-info {
        position: relative;
        z-index: 9;
        background: rgba(#111111, 0.8);
        padding: 30px;

        @media(min-width: 1024px) {
            padding: 65px 65px 40px;
        }
    }

    .description {
        margin: 0 0 35px;
    }

    .info-wrapper {
        margin: 0 0 40px;

        &:nth-child(2n) {
            font-weight: normal;
        }

        .icon {
            @include size(70px, 70px);
            line-height: 76px;
            text-align: center;
            border: 2px dashed #3f4143;
            @include border-radius(50%);
            @include rtl-float-left();
            @include rtl-margin-right(20px);

            i {
                font-size: 28px;
            }
        }

        .des {
            color: $white;
            overflow: hidden;
            margin: 6px 0 0;
        }
    }

    .info-top {
        border-bottom: 2px dashed #414445;
        overflow: hidden;
    }

    .info-bottom {
        margin: 40px 0;

        a {
            display: inline-block;
            text-align: center;
            line-height: 42px;
            @include size(42px, 42px);
            @include border-radius(50%);
            color: #101416;
            background: #3f4143;

            &:hover,
            &:active {
                @include gradient-horizontal($theme-color-second, $theme-color);
                color: #0e1113;
            }

            +a {
                @include rtl-margin-left(12px);
            }
        }
    }
}

// widget-social
.widget-social {
    .title {
        font-size: 14px;
        @include rtl-padding-right(25px);
        color: #191919;
        margin: 0;
    }

    &.st_small{

    }

    > * {
        @include inline-block();
    }

    .social {
        padding: 0;
        list-style: none;
        margin: 0;

        >li {
            padding: 0;
            display: inline-block;
            @include rtl-margin-right(12px);

            &:last-child {
                margin: 0;
            }
        }

        a {
            font-size: 14px;
            @include size(30px, 30px);
            line-height: 30px;

            @include media(mobile) {
                @include size(40px, 40px);
                line-height: 40px;
                font-size: 16px;
            }

            text-align:center;
            display: inline-block;
            @include transition($linear);
            color:$link-color;
            background:#eaeff4;
            @include border-radius(50%);

            &:hover,
            &:focus {
                color: $white;
                background: $theme-color;
                border-color: $theme-color;
            }
        }
    }

    &.left {
        @include rtl-text-align-left();
    }

    &.right {
        @include rtl-text-align-right();
    }

    &.center {
        text-align: center;
    }

    &.st_small {
        .social {
            a {                
                font-size: 16px;
                line-height: inherit;
                background: transparent;
                color: #c9c8c8; 
                @include square(auto);                               
                @include hover-focus-active() {
                    color: $theme-color;
                }
            }
            > li {
                @include rtl-margin-right(15px);                    
                &:last-child {
                    @include rtl-margin-right(0);
                }
                @include media(desktop) {
                    @include rtl-margin-right(28px);                    
                }             
            }
        }
    }
}

.phone_header {
    img {
        @include rtl-base-toprightbottomleft(margin, 0, 10px, 0, 0);
        vertical-align: middle;
    }
    font-size: 22px;
    line-height: 1;
    font-family: $font-family-second;
    color: $link-color;
}

.contact-us {
    text-align: center;
    .title {
        margin: 0 0 10px;
        font-size: 26px;
        @include media(desktop) {
            font-size: 36px;
        }
    }

    .des {
        margin-bottom: 20px;
        @include media(desktop) {
            margin-bottom: 50px;
        }
    }

    .form-control {
        margin-bottom: 20px;
        @include media(desktop) {
            margin-bottom: $theme-margin;
        }
    }

    textarea {
        height: 150px;
        resize: none;
    }
}

.widget-process {
    padding-top: 35px;

    .title {
        color: $theme-color;
        margin: 0;
        font-size: 14px;
    }

    .des {
        font-size: 18px;
        font-family: $font-family-three;
        color: $white;
        font-weight: normal;
        @include media(desktop) {
            font-size: 20px;
        }
    }

    .top-img {
        margin-bottom: 12px;
        @include media(desktop) {
            margin-bottom: 20px;
        }
    }

    .proces-item {
        position: relative;

        .line-space {
            position: absolute;
            @include size(190px, 35px);
            left: 100%;
            @include translateX(-50%);
            bottom: 100%;
        }

        &:last-child {
            .line-space {
                display: none;
            }
        }
    }
}

// language
.language-wrapper {
    font-size: 12px;
    display: inline-block;
    position: relative;

    &:before {
        content: '';
        position: absolute;
        top: 100%;
        left: 0;
        @include size(100%, 5px);
    }

    .selected {
        .language-current {
            >img {
                @include rtl-base-toprightbottomleft(margin, 0, 10px, 0, 0);
                vertical-align: sub;
            }

            >i {
                @include rtl-margin-left(10px);
            }
        }
    }

    .dropdown-menu {
        background: $white;
        display: block;
        @include opacity(0);
        @include translateY(10px);
        font-size: 12px;
        margin-top: 5px;
        @include border-radius(0);
        padding: 13px 18px;
        min-width: 130px;
        @include box-shadow(none);
        border: 1px solid $border-color;
        @include transition(all 0.3s ease-in-out 0s);
        visibility: hidden;
    }

    &:hover {
        .dropdown-menu {
            visibility: visible;
            @include translateY(0);
            @include opacity(1);
        }
    }

    .list-language {
        list-style: none;
        padding: 0;
        margin: 0;

        li {
            margin-bottom: 10px;

            &:last-child {
                margin-bottom: 0;
            }
        }

        a {

            &:hover,
            &:focus {
                color: $theme-color;
            }
        }

        img {
            @include rtl-margin-right(6px);
            margin-bottom: 0;
        }
    }
}

.top-info {
    line-height: 1.4;

    .item {
        i {
            @include rtl-margin-right(5px);
        }

        display: inline-block;
        vertical-align: middle;
        @include rtl-padding-right(18px);
        @include rtl-margin-right(18px);
        @include rtl-border-right(1px solid $border-color);

        &:last-child {
            margin: 0;
            padding: 0;
            border: 0;
        }
    }
}

//social-link
.social-link {
    display: inline-block;
    margin: 0 5px;
    padding: 0;

    li {
        display: inline-block;
        margin: 0 5px;

        a {
            background: #f4f4f4 none repeat scroll 0 0;
            border-radius: 100%;
            color: $text-color;
            display: inline-block;
            height: 40px;
            line-height: 38px;
            text-align: center;
            width: 40px;
            border: 1px solid $border-color;
        }
    }

    &.lighten {
        li a {
            background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
            border: 1px solid #ffffff;
            color: #ffffff;
        }
    }
}

// .widget-gallery
.widget-gallery {
    .image {
        position: relative;

        &:before {
            @include transition(all 0.2s ease-in-out 0s);
            content: '';
            @include size(100%, 100%);
            position: absolute;
            top: 0;
            left: 0;
            background: $theme-color;
            @include opacity(0);
            z-index: 2;
        }

        .content-cover {
            @include transition(all 0.2s ease-in-out 0s);
            @include opacity(0);
            position: absolute;
            text-align: center;
            width: 100%;
            top: 50%;
            left: 50%;
            @include translate(-50%, -50%);
            z-index: 9;
        }

        &:hover {
            &:before {
                @include opacity(0.9);
            }

            .content-cover {
                @include opacity(1);
            }
        }
    }

    .popup-image-gallery {
        @include size(60px, 60px);
        line-height: 60px;
        display: inline-block;
        text-align: center;
        background: $white;
        font-size: 24px;
        color: $theme-color;
        @include border-radius(50%);
        @include transition(all 0.2s ease-in-out 0s);

        &:hover,
        &:active {
            color: $theme-color;
            background: darken(#fff, 10%);
        }
    }

    .title {
        font-size: 24px;
        font-size: $font-family-second;
        margin: 0;
        color: $white;
    }

    .description {
        color: #e0dede;
        font-size: 12px;
        margin-bottom: 20px;
    }

    .gutter-default {
        margin-left: 0;
        margin-right: 0;

        >div {
            padding-right: 0;
            padding-left: 0;
        }
    }

    &.gutter30 {
        .title {
            font-size: 18px;
            font-family: $font-family-second;
        }

        .image {
            margin-bottom: 30px;
        }

        .description {
            margin-bottom: 10px;
        }

        .gutter-default {
            margin-left: -15px;
            margin-right: -15px;

            >div {
                padding-right: 15px;
                padding-left: 15px;
            }
        }
    }
}

// widget feature
.widget-features-box {
    .slick-carousel{

        .slick-dots{
            padding-top: 50px;
            display: block;
            visibility: visible;
            pointer-events: auto;
            @include opacity(1);

            @include media(desktop) {
                display: none;                
                padding-top: 0;
                visibility: hidden;
                pointer-events: none;
                @include opacity(0);
            }

        }

        .slick-arrow{                        
            @include opacity(0);
            @include square(40px); 
            pointer-events: none;

            @include media(tablet) {                                
                @include square(50px);                
            }

        }
        .slick-prev{
            @include rtl-margin-left(30px);

            @include media(tablet) {
                @include rtl-margin-left(-9px);
            }

        }
        .slick-next{
            @include rtl-margin-right(30px);

            @include media(tablet) {
                @include rtl-margin-right(-9px);
            }

        }
    }    
    img {
        @include inline-block();
    }      
    .item-inner{
        background-color: #eeeeee;
        position: relative;                
        @include rtl-padding(36px, 15px, 37px, 15px);
    }
    .features-box-image{           
        position: relative;     
        @include inline-block();
        @include square(68px); 
        margin-bottom: 40px; 
        &:before{
            content: "";
            background-color: $theme-color;
            position: absolute;
            bottom: -5px;
            @include rtl-left(-20px);
            @include square(48px);
            @include border-radius(50px);
        }          
        &.img{
            outline: none;
        } 
        &.icon{
            font-size: 58px;
            line-height: 58px;
            color: $headings-color;
            &:before {                
                @include rtl-left(-10px);
            }
            > *{
                position: relative;
                z-index:2;
            }
        }  
    }
    .features-box-content{
        a{
            color: $headings-color;
            .title{
                color: inherit;                
            }
            @include hover-focus-active() {
                .title{
                    color: $theme-color;
                }
            }
        }
        .title {
            margin: 0;
            font-size: 20px;
            text-transform: uppercase;
            font-weight: $font-weight-medium;
            @include transition($linear);
        }
        .description{
            margin-top: 8px;
        }
    }
}

.widget-story{
    border: 1px solid $border-color;    
    padding: 30px;
    @include media(desktop) {
        @include rtl-padding(38px, 53px, 43px, 33px);
    }
    .row{
        div[class*="col-"]{
            margin-bottom: 30px;
            @include media(desktop) {
                margin-bottom: 0;
            }
            &:last-child{
                margin-bottom: 0px;
            }
        }
    }
    .title{
        font-size: 27px;
        font-family: $font-family-base;
        font-weight: $headings-font-weight;
        margin: 0px 0 10px 0;
        text-align: center;
        @include rtl-padding-left(0);      
        @include media(desktop) {
            margin: 2px 0 10px 0;
            @include rtl-text-align-left();
            @include rtl-padding-left(15px);
        }
    }
    .subtitle,
    .desc{
        font-size: 16px;        
        padding: 0;
        text-align: center;
        @include media(desktop) {
            @include rtl-text-align-left();
            @include rtl-padding-left(15px);
        }
    }
    .image-wrapper{
        img{
            @include border-radius(20px);
        }
    }
    .desc{
        margin-bottom: 25px;
        @include media(desktop) {
            margin-bottom: 55px;
        }
    }
    .btn{
        margin-top: 30px;
        text-transform: uppercase;
        font-size: 16px;        
        width: 100%;
        line-height: 50px;
        padding: 0 15px;
        display: block;        
        @include media(desktop) {
            margin-top: 45px;
            padding: 0 30px;            
        }
    }
    .days{
        @include flexbox();
        @include align-items(center);
        @include rtl-padding-left(0);
        @include justify-content(center);        
        @include media(desktop) {
            @include justify-content(flex-start);
            @include rtl-padding-left(15px);
        }        
        > *{
            @include rtl-margin-right(10px);
            &:last-child{
                @include rtl-margin-right(0);
            }
        }
        .fa{
            font-size: 20px;
        }
    }
}

.apus-countdown {
    .times {
        font-size: 16px;  
        text-align: center;                      
        > div {
            line-height: 1;
            text-align: center;            
            border: none;
            position: relative;
            color: $dark-gray;
            padding: 0px 20px;
            @include inline-block();            
            @include media(desktop) {
                padding: 0px 40px;
                @include rtl-margin-right(0px);
            }
            &:last-child{
                @include rtl-margin-right(0px);
                &:after{
                    display: none;
                }
            }
            &:after{
                content: '';
                top: 0;
                position: absolute;
                background-color: $theme-color;
                @include size(2px,100%);                
                @include rtl-right(0);                
                @include transform(rotate(20deg));
            }
            > span {
                color: $headings-color;
                display: block;
                font-size: 22px;                
                margin-bottom: 4px;
                line-height: 1;
                font-weight: $headings-font-weight;           
            }
        }
    }
}

.apus-countdown-dark {
    .times {
        font-size: 11px;
        font-size: $font-family-second;
        text-transform: uppercase;
        text-align: center;

        > div {
            line-height: 1;
            text-align: center;
            padding: 5px;
            display: inline-block;
            margin: 0 2px;

            @include media(desktop) {
                padding: 10px;
            }

            @include border-radius(10px);
            background:#eaeff4;

            >span {
                color: $theme-color;
                display: block;
                font-size: 18px;
                font-family: $font-family-three;
                margin-bottom: 4px;

                @include media(desktop) {
                    font-size: 24px;
                }
            }
        }
    }
}

.widget-countdown {
    .price {
        font-size: 18px;

        strong {
            font-family: $font-family-three;
            font-size: 20px;

            @include media(desktop) {
                font-size: 30px;
            }
        }
    }

    .title {
        font-size: 30px;
        margin: 0 0 10px;

        @include media(desktop) {
            font-size: 44px;
        }
    }

    .des {
        margin-bottom: 10px;
        line-height: 1.6;

        @include media(desktop) {
            margin-bottom: 30px;
        }
    }

    &.style2 {
        .apus-countdown .times>div {
            border-color: $white;
            background-color: $white;
            @include box-shadow(0 2px 2px 0 rgba(0, 0, 0, 0.1));
        }
    }

    &.style3 {
        .apus-countdown .times>div {
            border-color: $white;
            background-color: $white;
            @include box-shadow(0 2px 2px 0 rgba(0, 0, 0, 0.1));
            @include border-radius(50%);
            min-width: 60px;

            @include media(desktop) {
                min-width: 79px;
                span {
                    margin: 4px 0;
                }
            }
        }

        .title {
            position: relative;
            padding-bottom: 5px;

            &:before {
                content: '';
                @include size(60px, 3px);
                background: $theme-color;
                position: absolute;
                top: 100%;
                @include rtl-left(0);
            }
        }
    }

    .url-bottom {
        margin-top: 10px;

        @include media(desktop) {
            margin-top: 35px;
        }
    }

    .btn {
        border-width: 2px;
        @include border-radius(50px);
    }
}

.widget-banner {
    overflow: hidden;

    .btn {
        border-width: 2px;
    }

    .image-wrapper img {
        width: auto;
    }

    .banner-content {
        img {
            margin: 0;
        }
    }

    .flex-top {
        .banner-image {
            margin-top: 10px;

            @include media(desktop) {
                margin-top: 25px;
            }
        }

        .banner-content {
            margin-top: 20px;

            @include media(desktop) {
                margin-top: 45px;
            }
        }
    }

    &.style1 {
        .inner {
            position: relative;
            height: 200px;
        }

        .banner-image img {
            max-height: 150px;
        }

        @include media(desktop) {
            .inner {
                height: 450px;
            }

            .banner-image img {
                max-height: 300px;
            }
        }

        .btn {
            position: absolute;
            bottom: 0;
            left: 50%;
            @include opacity(0);
            @include transition(all 0.2s ease-in-out 0s);
            @include translateX(-50%);
            z-index: 2;
            padding: 8px 25px;
            @include border-radius(50px);

            @include media(desktop) {
                font-size: 16px;
            }
        }

        &:hover {
            .btn {
                bottom: $theme-margin;
                @include opacity(1);
            }
        }
    }

    &.style2 {
        background-color: $theme-color;

        .inner {
            height: 150px;
        }

        .banner-image img {
            max-height: 180px;
        }

        @include media(desktop) {
            .inner {
                height: 235px;
            }

            .banner-image img {
                max-height: 200px;
            }
        }

        .banner-content {
            font-size: 20px;
            color: #252525;
            line-height: 1.3;

            strong {
                font-weight: normal;
                font-family: $font-family-three;
            }

            @include media(desktop) {
                font-size: 30px;
            }
        }
    }

    &.style3 {
        background-color: $theme-color;

        .inner {
            height: 200px;
        }

        .banner-image img {
            max-height: 180px;
        }

        .link-bottom {
            padding-top: 5px;

            @include media(desktop) {
                padding-top: 15px;
            }
        }

        @include media(desktop) {
            .inner {
                height: 286px;
            }

            .banner-image img {
                max-height: 250px;
            }
        }

        .banner-content {
            font-size: 20px;
            color: #252525;
            line-height: 1.2;

            strong {
                font-weight: normal;
                font-family: $font-family-three;
            }

            @include media(desktop) {
                font-size: 30px;
            }
        }
    }

    &.style4 {
        background-color: $theme-color;

        .inner {
            height: 120px;
        }

        .banner-image img {
            max-height: 100px;
        }

        .link-bottom {
            padding-top: 5px;
        }

        @include media(desktop) {
            .inner {
                height: 180px;
            }

            .banner-image img {
                max-height: 150px;
            }
        }

        .banner-content {
            font-size: 18px;
            color: #252525;
            line-height: 1.2;

            strong {
                font-weight: normal;
                font-family: $font-family-three;
            }

            @include media(desktop) {
                font-size: 24px;
            }
        }

        .btn {
            font-size: 12px;
            padding: 6px 25px;
        }
    }
}

.widget-testimonials {
    text-align: center;    
    padding: 0px;        
    margin: 0px;        
    .slick-dots{        
        margin-top: 30px;
        @include media(desktop) {            
            display: none !important; 
        }
    }    
    img {        
        @include inline-block();
    }
    .info{
        @include flexbox();
        @include align-items(center);
        @include justify-content(center);
        > div{
            @include rtl-margin-right(15px);
            &:last-child{
                @include rtl-margin-right(0);
            }
        }
        .name-client{
            color: $white;
            font-size: 22px;
            font-family: $font-family-base;
            font-weight: 400;
            margin: 0 0 5px 0;
            padding: 0;
        }
        .job{
            font-size: 16px;
            font-weight: $font-weight-medium;
        }
        .testimonial-info-content{
            @include rtl-text-align-left();
        }
    }
    .avarta {
        position: relative;
        &:before{
            content: '';            
            bottom: -30px;            
            margin: 0;
            border-top: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-bottom: 14px solid darken($white, 65%);
            padding: 0;    
            @include center-align(absolute);        
            @include square(0);    
            @include transition($linear);        
            font-size: 0;
            line-height: 0;             
            _border-right-color: pink;
            _border-left-color: pink;
            _filter: chroma(color=pink);
            @include media(desktop) {
                bottom: -40px;
            }
        }
        img {            
            width: 60px;
            @include border-radius(50%);
            @include media(desktop) {
                width: 80px;
            }
        }
    }
    .name-client {
        margin: 10px 0 0;
        font-size: 16px;
        @include media(desktop) {
            margin: 20px 0 0;
        }
    }
    .description {
        margin: 29px 0px 5px 0px;
        padding: 26px 20px 50px;
        position: relative;  
        min-height: auto;              
        background-color: transparent;
        border: 1px solid darken($white, 65%);
        @include transition($linear);
        @include media(desktop) {
            margin: 40px 0 0;
            padding: 36px 30px;
            min-height: 188px;      
        }    
        &:after{      
            content: "";            
            background: url('../images/icon-quote.png') transparent 0 0 no-repeat;            
            position: absolute;
            bottom: 15px;
            @include size(26px,22px);
            @include rtl-right(15px);
            @include background-size(cover);
        }    
    }
    .rating {
        margin: 10px 0 0;
        @include media(desktop) {
            margin: 20px 0 0;
        }
    }
    .testimonials-item{
        @include hover-focus-active() {
            .info{
                .avarta{
                    &:before{
                        border-bottom-color: $theme-color;
                    }
                }
            }
            .description{
                border-color: $theme-color;
            }
        }
    }    
    &.box{
        .info{
            .name-client{
                color: $headings-color;
            }
        }
        .description{
            border-color: $theme-color;
        }
        .avarta{
            &:before{
                border-bottom-color: $theme-color;
            }
        }
    }
}

// custom menu
.widget-nav-menu {
    .widget-title {
        font-size: 16px;
        margin: 0 0 10px;

        @include media(desktop) {
            margin-bottom: 20px;
        }

    }

    .menu {
        margin: 0px;
        padding: 0px;
        li {
            font-size: 12px;            
            margin: 0 0 7px;
            font-family: $headings-font-family;
            font-weight: $font-weight-medium;
            text-transform: uppercase;
            @include clearfix();

            @include media(desktop) {
                font-size: 15px;            
            }

            &:last-child {
                margin: 0;
            }
            a{
                color: #939393;
                @include rtl-float-left();
                @include hover-focus-active() {
                    color: $theme-color;
                }
            }
        }
    }

    &.horizontal{
        .menu{
            text-align: center;
            @include media(desktop) {
                @include rtl-text-align-left();
            }
            li{
                margin: 0px 10px;
                margin-bottom: 10px;
                font-size: 14px;
                @include inline-block();       
                @include media(tablet) {
                    margin-bottom: 0;
                }                
                @include media(desktop) {
                    margin-bottom: 0;
                }
                &:first-child{
                    @include rtl-margin-left(0);
                }
                &:last-child{
                    @include rtl-margin-right(0);
                }
            }
        }
    }
}

// widget action box 
.widget-action-box {
    padding: 20px 0;
    @include transition(all 0.2s ease-in-out 0s);

    @media(min-width: 1870px) {
        padding: 64px 0;

        .action-inner {
            padding: 25px;
        }
    }

    .action-inner {
        width: 50%;
        @include rtl-float-right();
    }

    .title {
        margin: 0 0 8px;
        font-size: 24px;
        font-family: $font-family-second;
    }

    .description {
        margin: 0 0 30px;
    }

    &:hover {
        @include box-shadow(0 15px 10px -10px rgba(0, 0, 0, 0.15));
    }

    &.style2 {
        &:hover {
            @include box-shadow(5px 5px 5px 0 rgba(0, 0, 0, 0.2));
        }

        padding:0;

        .box-img {
            text-align: center;
        }

        .action-v2 {
            padding: 15px 0 40px;
            display: table;
            width: 100%;

            >div {
                display: table-cell;
                vertical-align: middle;
                float: none;
            }
        }
    }
}

.widget-mailchimp {
    &.st_white {

        &,
        .title {
            color: $white;
        }

        input {
            color: $white;
            background: rgba(255, 255, 255, 0.2);
            border-color: rgba(255, 255, 255, 0.2);

            &::-webkit-input-placeholder {
                /* Chrome/Opera/Safari */
                color: $white;
            }

            &::-moz-placeholder {
                /* Firefox 19+ */
                color: $white;
            }

            &:-ms-input-placeholder {
                /* IE 10+ */
                color: $white;
            }

            &:-moz-placeholder {
                /* Firefox 18- */
                color: $white;
            }

            &:focus {
                color: $white;
                border-color: $white;
            }
        }
    }

    &.default {
        .btn {
            background-color: transparent;            
            color: $theme-color;             
            border: none;                 
            font-size: 20px;
            @include border-radius(0);
            @include rtl-padding(7px, 0px, 12px, 10px);
        }

        input[type="email"]{
            border: 0px;
            color: #9a9999;
            font-size: 16px;
            font-style: italic;
            min-width: 320px;
            background-color: transparent;
            @include rtl-padding-left(0);
            @include placeholder(#9a9999);            
        }
    }

    .title {
        margin: 0;
        font-size: 22px;
    }

    .des {
        font-size: 16px;
        font-family: $font-family-second;
    }

    .form-control {
        @include border-radius(50px 0 0 50px);
        @include rtl-border-right(0);
    }

    .btn {
        margin: 0;
        @include border-radius(0 50px 50px 0);
    }
    
    form{
        border-bottom: 2px solid #525151;
        @include media(desktop) {
            @include rtl-float-right();        
        }
    }

    .mc4wp-form-fields{
        p{
            margin: 0px;
        }
    }

}

// instagram
.instagram-pics {
    margin-left: 0;
    margin-right: 0;

    >div {
        padding-left: 0;
        padding-right: 0;
        @include rtl-float-left();
    }

    .col-xs-cus-5 {
        width: 25%;
    }

    @media(min-width:768px) {
        .col-xs-cus-5 {
            width: 20%;
        }
    }
}

.item-instagram {
    position: relative;

    .like-comments {
        position: absolute;
        z-index: 9;
        top: 50%;
        text-align: center;
        width: 100%;
        @include translateY(-50%);
        color: $white;
        font-size: 16px;
        @include transition(all 0.2s ease-in-out 0s);
        @include opacity(0);

        i {
            @include rtl-margin-right(5px);
        }

        >span+span {
            @include rtl-margin-left(30px);
        }
    }

    a {
        display: block;
        position: relative;

        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            @include size(100%, 100%);
            background: rgba(0, 0, 0, 0.3);
            @include opacity(0);
            z-index: 9;
            @include transition(all 0.2s ease-in-out 0s);
        }

        &:active,
        &:hover {
            &:before {
                @include opacity(1);
            }
        }
    }

    &:hover {
        a:before {
            @include opacity(1);
        }

        .like-comments {
            @include opacity(1);
        }
    }
}

.widget-instagram.style_large {
    .widget-title {
        text-align: center;
        font-size: 32px;
    }

    @include media(desktop) {
        .instagram-pics {
            margin-left: -15px;
            margin-right: -15px;

            >div {
                padding-left: 15px;
                padding-right: 15px;
            }
        }
    }
}

.widget-instagram.style_small {
    .instagram-pics {
        margin-left: -4px;
        margin-right: -4px;

        >div {
            padding-left: 4px;
            padding-right: 4px;
        }

        a {
            margin-bottom: 8px;
        }
    }
}

//widget-brands
.widget-brand {
    &.dark {
        background: $input-bg;
    }

    text-align: center;

    .slick-slide img {
        display: inline-block;
        @include transition(all 0.3s ease-in-out 0s);
    }

    &:hover {
        img {
            @include scale(0.8);

            &:hover,
            &:focus {
                @include scale(1);
            }
        }
    }

    padding:15px 10px;

    @include media(desktop) {
        padding: $theme-margin;
    }

    &.default {
        border: 1px solid $border-color;
    }
}

.no-space {
    margin: 0 !important;

    >.apus-container {
        >.vc_fluid {
            padding: 0;
        }
    }

    .row {
        margin: 0;

        >[class *="col"] {
            padding: 0;
        }
    }
}

.space-45 {
    margin-bottom: 45px;
}

.no-margin {
    .widget {
        margin-bottom: 0;
    }
}

@media(max-width:1199px) {
    .bg-hidden-md {
        background-image: none !important;
    }
}

@media(max-width:991px) {
    .bg-hidden-sm {
        background-image: none !important;

        >.vc_column-inner {
            background-image: none !important;
        }
    }
}

@media(min-width:992px) {
    .space-padding-lr-100 {
        padding-left: 100px;
        padding-right: 100px;
    }

    .space-padding-lr-80 {
        padding-left: 80px;
        padding-right: 80px;
    }

    .space-rl-50 {
        padding-left: 50px;
        padding-right: 50px;
    }

    .space-l-65 {
        padding-left: 65px;
    }

    .top-170 {
        margin-top: -170px;
    }

    .left-100 {
        margin-left: -100px;
    }

    .space-left-45 {
        padding-left: 45px;
    }

    .right-30 {
        @include rtl-padding-right(30px);
    }

    .padding-lr-60 {
        padding-left: 60px;
        padding-right: 60px;
    }

    .padding-lr-45 {
        padding-left: 45px;
        padding-right: 45px;
    }

    .padding-lr-55 {
        padding-left: 55px;
        padding-right: 55px;
    }

    .padding-lr-25 {
        padding-left: 25px;
        padding-right: 25px;
    }

    .space-border {
        .row {
            margin: 0;

            >[class *="col"] {
                @include rtl-border-right(1px solid $border-color);

                &:last-child {
                    border: none;
                }
            }
        }
    }
}

@include media(desktop) {
    .padding-lr-15 {
        padding-left: 15px;
        padding-right: 15px;
    }
}

.flow-hidden {
    overflow: hidden;
}

.skew-light {
    position: relative;

    &:before {
        content: '';
        background: rgba(255, 255, 255, 0.2);
        @include size(100%, 100%);
        position: absolute;
        top: 0;
        left: 0;
        -ms-transform: skewX(20deg);
        /* IE 9 */
        -webkit-transform: skewX(20deg);
        /* Safari */
        transform: skewX(20deg);
        /* Standard syntax */
    }
}

.skew-theme-right {
    position: relative;
    background: $theme-color;

    >* {
        position: relative;
        z-index: 2;
    }

    &:before {
        content: '';
        background: $theme-color;
        @include size(100%, 100%);
        position: absolute;
        top: 0;
        left: 60px;
        z-index: 1;
        -ms-transform: skewX(20deg);
        /* IE 9 */
        -webkit-transform: skewX(20deg);
        /* Safari */
        transform: skewX(20deg);
        /* Standard syntax */
    }
}

.skew-theme-left {
    position: relative;
    background: $theme-color;

    >* {
        position: relative;
        z-index: 2;
    }

    &:before {
        content: '';
        background: $theme-color;
        @include size(100%, 100%);
        position: absolute;
        top: 0;
        right: 60px;
        z-index: 1;
        -ms-transform: skewX(-20deg);
        /* IE 9 */
        -webkit-transform: skewX(-20deg);
        /* Safari */
        transform: skewX(-20deg);
        /* Standard syntax */
    }
}

.flow-theme-top-bottom-right {
    &:before {
        height: calc(100% + 172px);
        top: -110px;
    }

    &:after {
        content: '';
        position: absolute;
        @include size(100%, 100%);
        z-index: 1;
        background: $theme-color;
        right: 10%;
        top: -110px;
        height: calc(100% + 172px);
        width: 500%;
    }
}

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

    .widget-title {
        color: #fff !important;
    }
}

.border-top-theme {
    border-top: 3px solid $theme-color;
}

.font-size-36 {
    font-size: 36px !important;
}

.font-size-30 {
    font-size: 30px !important;
}

.space-left-8 {
    @include rtl-margin-left(8px);
}

.text-upper {
    text-transform: uppercase !important;
}

.space-10 {
    margin-bottom: 10px !important;
}

.space-15 {
    margin-bottom: 15px !important;
}

.space-20 {
    margin-bottom: 20px !important;
}

.space-25 {
    margin-bottom: 25px !important;
}

.space-30 {
    margin-bottom: 15px !important;

    @media(min-width: 768px) {
        margin-bottom: 30px !important;
    }
}

.space-50 {
    margin-bottom: 50px !important;
}

.space-padding-35 {
    padding: 35px 0 !important;
}

.space-padding-tb-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
}

.space-padding-tb-55 {
    padding-top: 55px !important;
    padding-bottom: 55px !important;
}

.space-top-0 {
    margin-top: 0;
}

.p-relative {
    position: relative !important;
}

.p-absolute {
    position: absolute !important;
}

.p-static {
    position: static !important;
}

.hr {
    border-top: 1px solid $border-color;
    min-height: 1px;
    width: 100%;
}

.no-float {
    float: none !important;
}

.no-padding-left {
    @include rtl-padding-left(0);
}

.no-padding-right {
    @include rtl-padding-right(0);
}

@media(min-width:1024px) {
    .padding-lr-35 {
        padding-left: 35px;
        padding-right: 35px;
    }
}

@include media(desktop) {
    .gutter-50 {
        margin-left: -25px;
        margin-right: -25px;

        .vc_column_container>.vc_column-inner {
            padding-left: 25px;
            padding-right: 25px;
        }

        .vc_row,
        .row {
            margin-left: -25px;
            margin-right: -25px;
        }
    }
}

.text-theme {
    color: $theme-color !important;
}

.bg-theme {
    background: $theme-color;
}

.border-theme {
    border-color: $theme-color;
}

.radius-3x {
    @include border-radius(3px !important);
}

.radius-50 {
    @include border-radius(50px !important);
}

.deleted_wpb_single_image {
    position: relative;
    overflow: hidden;

    &:before {
        position: absolute;
        z-index: 2;
        @include transition(all 0.2s ease-in-out 0s);
        content: '';
        @include size(100%, 100%);
        background: $theme-color;
        @include opacity(0);
        top: 0;
        left: 0;
    }

    &:after {
        position: absolute;
        @include transition(all 0.3s ease-in-out 0s);
        content: '';
        top: $theme-margin;
        left: $theme-margin;
        right: $theme-margin;
        bottom: $theme-margin;
        border: 1px solid $white;
        z-index: 3;
        @include scale(0);
    }

    &:hover {
        &:before {
            @include opacity(0.5);
        }

        &:after {
            @include scale(1);
        }
    }
}

.list-contact {
    list-style: none;
    padding: 0;
    margin: 17px 0 0 !important;

    li {
        margin: 0 0 3px;

        i {
            @include rtl-margin-right(5px);
        }
    }
}

.gutter-medium-left {
    @include media(desktop) {
        >.vc_column-inner {
            @include rtl-padding-left(5px);
        }
    }

    @media(min-width: 768px) {
        .vc_row {
            margin-left: -10px;
            margin-right: -10px;

            .vc_column-inner {
                padding-left: 10px;
                padding-right: 10px;
            }
        }
    }
}

// counter
.crowdngo-counter {
    overflow: hidden;

    .image-icon {
        @include rtl-padding-right(20px);
    }

    .counter-wrapper {
        overflow: hidden;
        font-size: 48px;
        line-height: 1.2;
        font-family: $font-family-second;
        color: $link-color;
    }

    .crowdngo-counter-title {
        color: #707070;
        font-size: 16px;
    }
}

.widget-team {
    position: relative;
    text-align: center;
    margin-bottom: 0px;

    .name-team {
        font-size: 18px;
        margin: 0 0 5px;
        font-weight: $font-weight-medium;
        @include media(desktop) {
            font-size: 20px;
        }
    }

    .job {                
        color: $entry-blog-date-color;
    }

    .bottom-info {
        padding-top: 15px;
    }

    .description {        
        margin-top: 30px;
    }

    .content {
        padding-top: 8px;        
        @include media(desktop) {
            padding-top: 15px;
        }
    }

    .top-image {        
        position: relative;
        .team-image{
            > div{
                margin-bottom: 10px;                
            }
        }
        &:before{
            top: 0;
            position: absolute;
            visibility: hidden;
            content: "";
            z-index: 1;                        
            pointer-events: none;
            background-color: $theme-color;
            @include square(100%);
            @include opacity(0);            
            @include rtl-left(0);               
            @include transition($linear);              
        }
        .social {
            margin: 0;
            padding: 15px 0;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            z-index: 2;
            @include transition($linear);
            @include opacity(0);
            @include scale(0.5, 0);

            li {                
                @include inline-block();
                margin: 0 10px;
            }

            a {
                @include transition($linear);
                @include inline-block();
                color: $white;
                font-size: 20px;
            }
        }
    }

    &:hover {
        .top-image {
            &:before{                        
                pointer-events: auto;
                visibility: visible;
                @include opacity(.82);
            } 
        }

        .social {
            @include opacity(1);
            @include scale(1, 1);
        }
    }
}

// vertical menu
.widget_apus_vertical_menu {
    .widget-title {
        font-size: 16px;
        font-weight: normal;
        margin: 0 0 10px;
        padding: 15px $theme-margin 0;
    }

    @include rtl-border-left(4px solid #2e2d2d);

    .apus-vertical-menu {
        border: none;

        >li {
            @include rtl-margin-left(-4px);

            >a {
                @include rtl-border-left(4px solid transparent);
                font-size: 16px;
                padding: 0 $theme-margin;
            }

            &.active,
            &:hover {
                >a {
                    border-color: $theme-color;
                }
            }
        }
    }

    &.darken {
        .apus-vertical-menu {
            background: transparent;

            >li {
                >a {
                    color: #eeeae2;
                    padding: 0 20px;
                }

                &.active,
                &:hover {
                    >a {
                        color: $theme-color;
                    }
                }
            }
        }

        .widget-title {
            color: #eeeae2;
            border: none;
            margin: 0;
            padding-right: 20px;
            padding-left: 20px;

            &:before {
                display: none;
            }
        }
    }
}

.tabs-v1 {
    margin-bottom: 30px;

    @include media(desktop) {
        margin-bottom: 50px;
    }

    .ps-container {
        position: relative;
    }

    .nav-tabs {
        border: none;
        display: -webkit-flex;
        /* Safari */
        display: flex;

        >li {
            width: 100%;
            @include rtl-border-right(1px solid #fff);
            margin: 0;

            &:last-child {
                border: none;
            }

            >a {
                text-align: center;
                font-size: 16px;
                font-family: $font-family-three;
                padding: 10px;
                margin: 0;
                background: #eceff6;
                text-transform: uppercase;
                white-space: nowrap;
                color: $link-color;
                border: none !important;
                @include transition(all 0.3s ease-in-out 0s);
            }

            &.active {
                >a {
                    background-color: $theme-color;
                    color: $white;
                }
            }
        }
    }

    .tab-content {
        max-width: 1460px;
        margin: 20px auto 0;

        @include media(desktop) {
            margin: 60px auto 0;
        }
    }
}

.nav.tabs-product {
    border: none;

    &.has-border {
        border-bottom: 1px solid $border-color;

        >li {
            margin-bottom: -2px;
        }
    }

    >li {
        display: inline-block;
        float: none;
        margin-bottom: 0;

        >a {
            border: none !important;
            font-size: 18px;
            color: $text-color;
            font-family: $font-family-second;
            background: transparent;
            position: relative;
            padding: 0 0 8px;

            &:before {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0;
                @include size(100%, 3px);
                background: $theme-color;
                @include transition(all 0.3s ease-in-out 0s);
                @include scale(0);
            }
        }

        &.active>a {

            &,
            &:hover,
            &:focus {
                color: $theme-color;

                &:before {
                    @include scale(1);
                }
            }
        }
    }

    &.center {
        text-align: center;

        >li {
            margin-left: 15px;
            margin-right: 15px;

            @include media(desktop) {
                margin-left: 10px;
                margin-right: 10px;
            }
        }

        margin-bottom: 25px;

        @include media(desktop) {
            margin-bottom: 35px;
        }
    }

    &.right {
        text-align: right;

        >li {
            @include rtl-margin-right(20px);

            @include media(desktop) {
                @include rtl-margin-right(40px);
            }

            &:last-child {
                @include rtl-margin-right(0);
            }
        }
    }

    &.left {
        text-align: left;

        >li {
            @include rtl-margin-left(20px);

            @include media(desktop) {
                @include rtl-margin-left(50px);
            }

            &:last-child {
                @include rtl-margin-left(0);
            }
        }
    }
}

@media(min-width: 768px) {
    .flex-middle-sm {
        display: -webkit-flex;
        /* Safari */
        display: flex;
        align-items: center;
        -webkit-align-items: center;
    }

    .flex-top-sm {
        display: -webkit-flex;
        /* Safari */
        display: flex;
        align-items: flex-start;
        -webkit-align-items: flex-start;
    }
}

.flex-middle {
    display: -webkit-flex;
    /* Safari */
    display: flex;
    align-items: center;
    -webkit-align-items: center;
}

.flex-top {
    display: -webkit-flex;
    /* Safari */
    display: flex;
    align-items: flex-start;
    -webkit-align-items: flex-start;
}

.flex-bottom {
    display: -webkit-flex;
    /* Safari */
    display: flex;
    align-items: flex-end;
    -webkit-align-items: flex-end;
}

.max-1800 {
    max-width: 1800px;
    margin-left: auto;
    margin-right: auto;
}

.cl-3,
.cl-2 {
    @include rtl-float-left();

    >.row {
        margin: 0;
    }

    .widget {
        padding-left: $theme-margin / 2;
        padding-right: $theme-margin / 2;
    }
}

.cl-3 {
    width: 58.3333%;
}

.cl-2 {
    width: 41.6667%;
}

.font-second {
    font-family: $font-family-second !important;
    font-weight: normal;
}

.max-1770 {
    max-width: 1770px;
    margin-left: auto;
    margin-right: auto;
}

.updow {
    &:hover {

        .top-img img,
        .img img,
        .image-wrapper img {
            -webkit-animation: updow 0.8s ease-in-out 0s infinite;
            animation: updow 0.8s ease-in-out 0s infinite;
        }
    }
}

.updow-infinite {
    img {
        -webkit-animation: updow 1s ease-in-out 0s infinite;
        animation: updow 1s ease-in-out 0s infinite;
    }
}

@-webkit-keyframes updow {
    50% {
        @include translateY(-10px);
    }

    0%,
    100% {
        @include translateY(0px);
    }
}

@keyframes updow {
    50% {
        @include translateY(-10px);
    }

    0%,
    100% {
        @include translateY(0px);
    }
}

@-webkit-keyframes fadeleft {
    from {
        @include opacity(1);
    }

    to {
        @include opacity(0);
        @include translate(-15px, 0);
    }
}

@keyframes fadeleft {
    from {
        @include opacity(1);
    }

    to {
        @include opacity(0);
        @include translate(-15px, 0);
    }
}

@-webkit-keyframes faderight {
    from {
        @include opacity(0);
        @include translate(15px, 0);
    }

    to {
        @include opacity(1);
        @include translate(0, 0);
    }
}

@keyframes faderight {
    from {
        @include opacity(0);
        @include translate(15px, 0);
    }

    to {
        @include opacity(1);
        @include translate(0, 0);
    }
}

// Header
.apus-header-custom-toplink {
    font-size: 16px;
    > *{
        font-size: inherit;
        @include inline-block();
        @include rtl-margin-right(30px);
        &:last-child{
            @include rtl-margin-right(0px);
        }
    }
    span{
        @include transition($linear);
    }
    .custom-toplink-btn{        
        font-weight: $font-weight-medium;
        position: relative;
        padding-bottom: 2px;
        color: $headings-color;
        &:after{
            content: "";
            background-color: $theme-color;
            position: absolute;
            bottom: 0;
            @include size(100%, 3px);
            @include rtl-left(0);
        }
        @include hover-focus-active() {
            color: $theme-color !important;
        }
    }
}

.apus-header-call-to-action{
    font-size: 16px;    
    @include media(tablet) {
        font-size: 18px;
    }
    > *{
        font-size: inherit;
        display: block;
        margin-bottom: 5px;        
        &:last-child{
            margin-bottom: 0;
        }
    }
    a{
        color: $theme-color;
        font-family: $headings-font-family;
        font-weight: $font-weight-medium;
    }
    .phone-icon{                
        text-indent: -99999px;
        @include rtl-margin-right(auto);
        @include rtl-margin-left(auto);        
        @include square(35px);            
        @include background-size(cover); 
        @include transition($linear);
        background-image: url('../images/phone-call.png');
        background-repeat: no-repeat;
        background-position: 0 0;
        background-color: transparent;                
    }
}

.elementor-element{
    &.highlight-color{       
        outline: none; 
        // &:after{
        //     background-color: darken($theme-color, 5%);
        //     position: absolute;
        //     content: "";
        //     bottom: -14px;
        //     @include rtl-left(20px);
        //     @include size(97%,14px);
        // }
    }
    &.highlight-color-2{
        &:after{
            background-color: darken($theme-color, 5%);
            position: absolute;
            content: "";
            bottom: -14px;
            @include rtl-right(18px);
            @include size(100%,14px);
        }
    }
}

.elementor-widget-apus_element_user_info{
    outline: none;
}

.crowdngo-heading-title{
    text-transform: uppercase;    
    font-size: 28px;
    position: relative;
    padding-bottom: 45px;    
    margin-bottom: 36px;
    font-weight: $font-weight-medium;
    color: $headings-color;
    @include media(tablet) {
        font-size: 32px;        
    }
    @include media(desktop) {
        padding-bottom: 56px;
        font-size: 38px;        
    }
    &:after{
        content: '';
        background-color: $theme-color;        
        bottom: 10px;
        margin: 0px;
        @include size(70px,3px);        
        @include center-align(absolute);
        @include rtl-margin-left(-30px);        
    }
    &:before{
        content: "";
        background-color: transparent;
        background-image: url('../images/heading-check.png');
        background-repeat: no-repeat;
        background-position: 0 0;
        bottom: 0;
        @include rtl-margin-left(30px);
        @include background-size(cover);
        @include square(26px);
        @include center-align(absolute);        
    }
}
.sub-heading-title{
    font-size: 18px;            
    line-height: 30px;
    font-family: $headings-font-family;          
}
.apus-heading-cause{
    .sub-heading-title{        
        @include rtl-padding-left(15px);
        @include rtl-padding-right(15px);  

        @include media(tablet) {
            @include rtl-padding-left(8%);
            @include rtl-padding-right(8%);  
        }

        @include media(desktop) {
            @include rtl-padding-left(23%);
            @include rtl-padding-right(23%);        
        }
    }
}
.apus-heading-event{
    .sub-heading-title{
        @include rtl-padding-left(15px);
        @include rtl-padding-right(15px);    
        
        @include media(tablet) {
            @include rtl-padding-left(8%);
            @include rtl-padding-right(8%);    
        }

        @include media(desktop) {
            @include rtl-padding-left(18%);
            @include rtl-padding-right(18%);    
        }
    }
}
.apus-heading-style2{
    .elementor-heading-title{
        position: relative;
        padding-bottom: 21px;
        &:before{
            content: '';
            background-color: $theme-color;            
            position: absolute;
            bottom: 0px;
            margin: 0 auto;
            @include rtl-left(0);
            @include rtl-right(0);
            @include size(85px,4px);

            @include media(tablet) {
                margin: 0px;
                @include rtl-right(auto);
            }

        }
    }
}
.apus-heading-style3{
    .elementor-heading-title{
        position: relative;
        padding-bottom: 30px;           
        &:before{
            content: '';
            background-color: $theme-color;            
            position: absolute;
            bottom: 0px;
            @include rtl-left(0);
            @include size(58px,4px);
        }
    }
}
.apus-heading-style4{
    .elementor-heading-title{
        @include rtl-padding-right(0);
        
        @include media(desktop) {
            @include rtl-padding-right(40%);
        }

    }
}
.apus-heading-style5{
    .elementor-heading-title{
        margin-bottom: 0;
        @include rtl-padding-right(0);        

        @include media(tablet) {
            margin-bottom: 30px;            
        }

        @include media(desktop) {
            margin-bottom: 35px;
            @include rtl-padding-right(40px);        
        }

    }
}
.apus-heading-style6{
    .elementor-heading-title{
        position: relative;
        padding-bottom: 30px;        
        @include rtl-padding-right(54%);        
        &:before{
            content: '';
            background-color: $theme-color;            
            position: absolute;
            bottom: 0;
            @include rtl-left(0);
            @include size(58px,4px);
        }
    }
}
.apus-paragraph-style1{
    .elementor-heading-title{
        @include rtl-padding-right(10%);
    }
}
.apus-paragraph-style2{
    .elementor-heading-title{
        @include rtl-padding-right(53%);
    }
}
.apus-about-home{
    > div{
        > div{            
            &.elementor-widget-wrap{
                @include rtl-padding-left(0);
                @include rtl-padding-right(0);

                @include media(tablet) {
                    @include rtl-padding-left(40%);
                    @include rtl-padding-right(0);
                }

                @include media(desktop) {
                    @include rtl-padding-left(45%);
                    @include rtl-padding-right(15%);
                }
            }
        }
    }    
}
.apus-about-column{
    > div{
        > div{            
            &.elementor-widget-wrap{
                @include rtl-padding-left(18.8%);                
            }
        }
    }
}
.crowdngo-latest-cause{
    @include rtl-padding-left(30px);
    @include rtl-padding-right(30px);
    @include media(desktop) {
        @include rtl-padding-left(175px);
        @include rtl-padding-right(175px);
    }
}

.apus-heading-cta{
    .elementor-heading-title{
        position: relative;
        padding-top: 40px;
        padding-left: 0;
        padding-right: 0;      
        @include media(tablet) {
            padding-left: 0;
            padding-right: 0;
        }

        @include media(desktop) {
            padding-left: 10%;
            padding-right: 10%;
        }

        &:after{
            content: "";            
            background-color: $theme-color;
            top: 0;
            @include center-align(absolute);            
            @include size(30px,4px);

            @include media(mobile) {
                @include size(58px,4px);    
            }            

        }
    }
}

.apus-paragraph-cta{
    .elementor-heading-title{
        @include media(desktop) {
            padding-left: 18%;
            padding-right: 18%;
        }
    }    
}

.apus-cta{
    position: relative;
}

.apus-cta-phone{
    @include flexbox();
    @include align-items(center);
    font-family: $headings-font-family;
    font-weight: $font-weight-medium;
    font-size: 26px; 
    line-height: 1;
    a{
        color: $white;
        @include hover-focus-active() {
            color: $theme-color;
        }
    }
    .apus-icon{        
        @include rtl-margin-right(20px);
        &.apus-icon-phone{
            display: block;
            background: url('../images/phone.png') no-repeat 0 0 transparent;
            @include square(58px);                        
            @include background-size(cover);                  
        }
    }
}

.apus-form-mission{
    @include clearfix();
    overflow: hidden;
    .form-mission-wrap{
        margin: 0px;
        position: relative;
        @include flex-direction(column);        
        @include media(tablet) {
            @include flex-direction(row);
        }
        > *{
            display: block;
            width: 100%;
            @include rtl-margin(0,0,20px,0);   
            @include media(tablet) {
                width: 50%;
                @include rtl-margin(0,30px,30px,0);   
                &:last-child{
                    @include rtl-margin-right(0);
                }
            }

            @include media(desktop) {
                margin-bottom: 40px;
            }

        }
        select,
        input[type="text"],
        input[type="email"],
        input[type="url"],
        input[type="password"],
        input[type="search"],
        input[type="number"],
        input[type="tel"],
        input[type="range"],
        input[type="date"],
        input[type="month"],
        input[type="week"],
        input[type="time"],
        input[type="datetime"],
        input[type="datetime-local"],
        input[type="color"]{
            width: 100%;     
            max-width: none;       
            padding-top: 10px;
            padding-bottom: 10px;
            background-color: transparent;
            border-color: $border-color;
            color: #adabae;
            @include placeholder(#adabae);
            @include hover-focus-active() {
                border-color: $theme-color;
            }
        }
        input[type="submit"]{
            margin: 0 auto;
            width: 100%;
            padding: 0 40px;
            line-height: 53px;
            font-size: 18px;

            @include media(mobile) {
                width: auto;
            }

            @include media(tablet) {
                width: auto;                
            }

            @include media(desktop) {
                width: auto;
                margin: 33px 0 0 0;
            }

        }
        .ajax-loader{
            position: absolute;
            top: 0;
            bottom: 0;
            margin: auto;
            @include rtl-right(0);
            @include rtl-left(0);
            
            @include media(tablet) {
                top: 60%;            
                margin: 0;
                bottom: auto;
                @include rtl-left(110px);
                @include rtl-right(auto);
            }

        }
    }        
}

.widget-video{
    &.apus-video-style-1{
        .description{            
            @include rtl-padding-right(0);
        }
        .video-wrapper-inner{
            margin-bottom: 30px;   
            @include media(desktop) {
                margin-bottom: 42px;
            }     
            .image-wrapper{
                height: auto;
                max-height: max-content;
                @include media(desktop) {
                    height: 386px;                
                }
            }
        }
    }
    .video-content{
        .title-video{
            margin: 0 0 15px 0;
            font-size: 24px;
            line-height: 34px;
        }
        .description{
            outline: none;
        } 
    }
    .video-wrapper-inner{        
        .image-wrapper{                        
            background-color: $gray-base;            
        }
    }    
}

.elementor-element{
    &.angle{        
        padding-top: 35px;
        &:before{
            content: "";
            position: absolute;            
            z-index: 2;        
            top: -35px;    
            background-color: $white;
            @include rtl-left(-15px);            
            @include size(105%,70px);
            @include rotate(2deg);
        }
    }
}

.elementor-image-gallery{
    .gallery{
        .gallery-item{   
            a{
                position: relative;
                display: block;
                &:before{
                    top: 0;
                    position: absolute;
                    visibility: hidden;
                    content: "";
                    z-index: 1;
                    background-color: $theme-color;                             
                    pointer-events: none;
                    @include square(100%);
                    @include opacity(0);
                    @include rtl-left(0);               
                    @include transition($linear);  
                }
                &:after{
                    content: "";                  
                    z-index: 2;      
                    background-color: $white;
                    background-image: url('../images/icon-zoom.png');
                    background-position: center center;
                    background-repeat: no-repeat;
                    visibility: hidden;
                    pointer-events: none;
                    position: absolute;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    top: 0;
                    margin: auto;
                    @include transform(scale(0));
                    @include opacity(0);
                    @include background-size(26px,24px);
                    @include border-radius(50px);       
                    @include square(55px);                                        
                    @include transition($linear);
                }
                @include hover-focus-active() {
                    &:before{                        
                        pointer-events: auto;
                        visibility: visible;
                        @include opacity(.82);
                    }                    
                    &:after{
                        visibility: visible;
                        pointer-events: auto;
                        @include opacity(1);
                        @include transform(scale(1));
                    }
                }
            }
        }
    }
}