@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&family=Tajawal:wght@400;500&display=swap');

@font-face {
    font-family: 'Font Awesome 5 Brands';
    font-style: normal;
    font-weight: normal;
    src: url("font/fa-brands-400.eot");
    src: url("font/fa-brands-400.eot?#iefix") format("embedded-opentype"),
        url("font/fa-brands-400.woff2") format("woff2"),
        url("font/fa-brands-400.woff") format("woff"),
        url("font/fa-brands-400.ttf") format("truetype"),
        url("font/fa-brands-400.svg#fontawesome") format("svg"); 
}


.fab {
    font-family: 'Font Awesome 5 Brands';
    font-style: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    display: inline-block;
}

@font-face {
    font-family: 'Font Awesome 5 Free';
    font-style: normal;
    font-weight: 400;
    src: url("fonts/fa-regular-400.eot");
    src: url("fonts/fa-regular-400.eot?#iefix") format("embedded-opentype"),
        url("font/fa-regular-400.woff2") format("woff2"),
        url("font/fa-regular-400.woff") format("woff"),
        url("font/fa-regular-400.ttf") format("truetype"),
        url("font/fa-regular-400.svg#fontawesome") format("svg");
}

.far {
    font-family: 'Font Awesome 5 Free';
    font-weight: 400;
    font-style: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    display: inline-block;
}

@font-face {
  font-family: 'Font Awesome 5 Solid';
  font-style: normal;
  font-weight: 900;
  src: url("font/fa-solid-900.eot");
  src: url("font/fa-solid-900.eot?#iefix") format("embedded-opentype"),
        url("font/fa-solid-900.woff2") format("woff2"),
        url("font/fa-solid-900.woff") format("woff"),
        url("font/fa-solid-900.ttf") format("truetype"),
        url("font/fa-solid-900.svg#fontawesome") format("svg");
}

.fa, .fas {
    font-family: 'Font Awesome 5 Solid';
    font-weight: 900;
    font-style: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

  display: inline-block;
}

body {
  
  direction: rtl;
  line-height: 25px;
  font-weight: 400;
  font-style: normal;
  color: #1f1f1f;
  font-size: 16px;
  margin: 0;
  background-color: #fff;
  text-rendering: optimizeLegibility !important;
}
td {
    font-size: 16px;
}
Body.PopBody {
    background-color: white;
    margin: 0;
    padding: 5px;
    background-image: none;
}
a {
    color: var(--danger);
    text-decoration: none;
    transition: 0.3s ease-in-out;
}

a:hover,
a:focus {
    color: #323232;
    text-decoration: none;
}
.text-muted {
    font-size: 13px;
}
/*********************/

.site-header {
    /*overflow: hidden;*/
    padding-bottom: 0;
    transition: 0.2s ease-in-out;

}
.site-header .navbar-brand {
    height: auto;
    padding: 0;
}
.navbar-topline {
    line-height: 33px;
    overflow: hidden;
    min-height: 42px;
}

.topmenu.navbar {
    
    z-index: 100 !important;
    
    transition: 0.3s ease-in-out;

    min-height: 100px;
    border-top: none;
    border-left: none;
    border-right: none;
    /*border-bottom: 1px solid #e1e1e1;*/
    /*box-shadow: 0px 4px 7px rgba(0, 0, 0, 0.1);*/
}

.top-menu-bg.sticky {
    
    box-shadow: 0 0 30px rgba(0,0,0,.2);
}
.top-menu-bg {
    background-color: #fff;
    box-shadow: 0 1px 1px rgba(0,0,0,.2);
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;

}

.topmenu.navbar .menubgcolor {
    /*background-color: #fff;*/ /*#d71a21;*/
    /*border-bottom: 1px solid #eee;*/
}
.is-sticky .topmenu.navbar .menubgcolor {
    box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.3);
}
.site-header .header-wrap-extras {
    padding-top: 27px;
}
.site-header .header-extras {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between; 
}
.flexbox-container {
    display: flex;
}
.flexwrap {
    flex-wrap: wrap;
}
.flexnowrap {
    flex-wrap: nowrap;
}
.flex-middle {
    align-content: center;
    align-items: center;
    display: flex;
}
.flex-column {
    flex-direction: column;
    display: flex;
}
.site-header .extras-menu {
    padding: 0;
    position: relative; 
    align-items: center;
    justify-content: flex-end;
    
}
.product-extra-search .searchbox-bootstrap {
    width: 100%;
}
.home-link {
    border-right:0 !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
}
.home-link i {
    padding-left: 5px;
    font-size: 18px;
}




.topmenu .logo-main {
    /*width:18%;*/
    padding-top: 5px;
}

.side-logo-main {
    overflow: hidden;
    display: block;
}

.side-logo-main img {

    display: block;
    padding: 10px;
    width: 188px;
}

.top-contact {
    margin-top: 5px;
    /*direction: ltr;*/
    
    overflow: hidden;
}
.top-contact .clock {
    text-align: center;
    margin-top: 10px;
    font-size: 14px;
    font-weight: 500;
}
.top-contact ul.fa-social a i {

    color: #fff;
    font-size: 18px;

}
.top-contact ul.fa-social a:hover i {

    color: #fff;
}

.top-contact ul.fa-social {
    padding: 0;
    margin: 0 auto;
    list-style: none;
}
.top-contact ul.fa-social li {
    vertical-align: middle;
    margin-left: 10px;
    float: left;
}
.top-contact ul.fa-social li a {
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 34px;
    background-color:#707070;
    color: #fff;
    float: left;
    border-radius: 50%;
    
}

.top-contact ul.fa-social a.facebook:hover {background-color: #45619d;}
.top-contact ul.fa-social a.twitter:hover {background-color: #00acee;}
.top-contact ul.fa-social a.linkedin-in:hover {background-color: #0077b5;}
.top-contact ul.fa-social a.telegram:hover {background-color: #2399d6;}
.top-contact ul.fa-social a.whatsapp:hover {background-color: #189d0e;}
.top-contact ul.fa-social a.youtube-play:hover {background-color: #da4834;}
.top-contact ul.fa-social a.instagram:hover {background-color: #983bf7;}
.top-contact ul.fa-social a.rss:hover {background-color: #eba832;}

/****************************/
.topmenu.navbar {
    /*min-height: 120px;
    width: 100%;
    z-index: 99;
    border-bottom: 1px solid #e9c37c;
    
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);*/
    
    /*top: 0px !important;*/

    min-height: 46px;
    margin-bottom: 0;
    border: 0;
    z-index: 100;
    transition: all 0.3s ease-in-out;
    border-radius: 0;
}
.is-sticky .topmenu.navbar {

}
.topmenu .navbar-toggle {
    float: left;
    margin-left: 10px;
}

.topmenu .logo-main {
    /*width:18%;*/
    padding-top: 5px;
}

.side-logo-main {
    overflow: hidden;
    display: block;
}

.side-logo-main img {

    display: block;
    padding: 10px;
    width: 188px;
}

.topmenu .menu-container {
    /*height: 67px !important;*/

    position: relative;
}

.topmenu .menu-shadow {
    display: block;
    width: 92%;
    left: 4%;
    position: absolute;
    top: 13px;
    z-index: -1;
    height: 100%;
    margin: 0 auto;
    opacity: 0.80;
    transition: opacity 0s linear;
    background-color: #d92300;
}
.is-sticky .topmenu .menu-shadow {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0s linear;
}

.searchbar-block {
    min-height: 46px;
    background-color: #14535c;
}
.searchbar-block .admin {
    display: inline-block;
    padding: 0 0 0 20px;
    line-height: 45px;
}
.searchbar-block .admin .title, .searchbar-block .admin .name {
    color: #fff;
    font-size: 16px;
    font-weight:500 ;
    font-family: 'Cairo', sans-serif;
}
.news-search-form {
    padding-top: 7px;
    padding-right: 30px;
}
.news-search-form input {
    border: 1px solid #d71a21;
    border-radius: 4px;
    font-size: 14px;
}
button.search-submit {
    cursor: pointer;
    transition: opacity .4s ease;
    line-height: 1.4;
    border-radius: 4px;
    background-color: #d71a21;
    color: #fff;
    height: 30px;

}
button.search-submit span {
    font-size: 15px;
    font-weight: 500;
    font-family: 'Cairo';
}
.news-ticker-bar {
    min-height: 40px;
    background-color: #fcfcfc;
    border-bottom: 1px solid #971217;
}

/*** add ad button ***/
.navbar-container a.main {
    width: 40px;
    height: 40px;
    border-bottom-color: #E30B1C;
    border: 7px #FFFFFF;
    position: absolute;
    display: flex;
    justify-content: center;
    background-color: #E30B1C;
    border-radius: 7pt;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    cursor: pointer;
    filter: drop-shadow(2px 2px 10px rgba(0, 0, 0, 0.1019607843));
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1019607843);
}
.navbar-container a.main i {
    height: 28px;
    width: 12px;
    position: absolute;
    bottom: 5px;
    z-index: 9;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    color: #fff;
}
/*************************************************/

@media (min-width: 992px) {
    #collapsemenu ul.navbar-nav { 
        /*margin-top: 10px;*/
    }
    .topmenu.navbar #collapsemenu ul.navbar-nav {
        /*margin-top: 10px;*/
    }
    .topmenu.navbar #collapsemenu ul.navbar-nav {
        margin-top: 0px;
    }
}
@media (min-width: 768px) {
    
    .top-contact-bar {
        min-height: 90px;

    }
    /* trick to prevent colapsing behaviour case I set colapse to every menu link in single page design */
    .topmenu.navbar .collapsing { height:inherit !important; }

    #collapsemenu > ul { padding-right: 0; }

    .topmenu.navbar #collapsemenu ul.navbar-nav {
        transition: 0.3s ease-in-out;
    }
    .topmenu.navbar #collapsemenu ul.navbar-nav {
        transition: 0.3s ease-in-out;
    }
    .topmenu .menu-container {
        padding: 0;
    }

    .topmenu.navbar .navbar-header a#logo {
        margin-top: 3px;
        display: none;
    }

}
@media (min-width: 992px) and (max-width: 1199px) {
    .searchbar-block .admin {
        display: inline-block;
        padding: 0 0 0 15px;
        line-height: 45px;
    }
    .searchbar-block .admin .title, .searchbar-block .admin .name {
        font-size: 15px;
        font-weight:500;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    
    .top-contact-bar {
        min-height: 80px;
        overflow: hidden;
    }

    .top-contact a {
        margin: 0;
    }
    .topmenu.navbar #collapsemenu ul.navbar-nav {
        margin-top: 0;
    }
    .searchbar-block .admin .title, .searchbar-block .admin .name {
        font-size: 14px;
        font-weight:500 ;
    }
    .top-contact ul.fa-social li {
        margin-left: 5px;
    }

    .top-contact ul.fa-social li a {
        width: 30px;
        height: 30px;
        line-height: 29px;
    }
    .top-contact ul.fa-social li a i{
        color: #fff;
        font-size: 13px;
    }
    
}
@media (max-width: 767px) {
    
    body.side-right .love-sticky.fullmenu-container.sticky {
        height: 100%;

    }
    body.side-right {
        background-color: rgba(0, 0, 0, 0.2);
        height: 100%;
        overflow: hidden;
    }
    .top-contact-bar {
        border-bottom: 1px solid #eee;
        padding-bottom: 5px;
    }
    .client-section .owl-carousel .owl-thumbnail a img {
        margin: 5px;
    }

    .top-contact a {
        margin: 0;
    }
    .topmenu.navbar .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .navbar-fixed-top .navbar-collapse {
        max-height: 100% !important;
    }
    .topmenu.navbar {
        box-shadow: none;
        padding: 0;
    }
    
    
    

    .topmenu.navbar-inverse,
    .topmenu.navbar-default {
        background-color: #3b393b;
        margin-bottom: 0;
    }
    
    .topmenu.navbar-fixed-top {
        /*position: absolute;
        left: 10px;*/
    }
    
    .topmenu.navbar-default .navbar-collapse {
        padding-right: 15px;
        padding-left: 15px;
        overflow-x: visible;
        -webkit-overflow-scrolling: touch;
        border-top: 1px solid transparent;
        -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.1);

        margin-right: 0;
    }

    nav.navbar.bootsnav .navbar-toggle {
        margin:5px ;
        padding: 7px 7px 3px 7px;
    }
    .navbar-header .navbar-toggle {
        position: relative;
        float: none;
        padding: 10px 10px 5px 10px;
        margin-top: 5px;
        margin-right: 8px;
        margin-bottom: 5px;
        background-color: #d71a21;
        background-image: none;
        border: 1px solid #d71a21;
        border-radius: 0;
        margin-right: 10px;

        transition: 0.3s ease-in-out;
    }
    .navbar-header .navbar-toggle .icon-bar {
        background-color: #fff;
        width: 26px;
        margin-bottom: 6px;
        transition: 0.2s ease-in-out;

    }

    .navbar-header .navbar-toggle:hover .icon-bar, .navbar-header .navbar-toggle:focus .icon-bar {
        background-color: #000;
    }
    .topmenu .navbar-toggle, 
    .topmenu .navbar-toggle:hover, 
    .topmenu .navbar-toggle:focus {
        /*float: left;*/
        /*margin-left: 10px;*/
        background-color: #d71a21;
    }

    .pull-left-xs {
        float: left !important;
    }
    .topmenu.navbar .navbar-brand {
        width: calc(100vw - 95px);
        max-width: 150px;
        margin-left: 10px;
        height: auto;
    }

    .topmenu.navbar {
        box-shadow: none;
        border:0;
        padding: 0;
        min-height: 40px;
    }

    .topmenu.navbar .navbar-header {
        /*box-shadow: 0 3px 6px rgba(0,0,0,0.5);
        padding: 5px 0 5px 0;*/
        background-color: #282828;
        min-height: 40px;
        text-align: center;
    }
    .topmenu.navbar .navbar-header a#logo {
        margin-top: 5px;
        opacity: 0;
        transition: 0.8s ease-in-out;
    }
    .topmenu.navbar .navbar-header a#logo img {
        height: 40px;
    }
    .is-sticky .topmenu.navbar .navbar-header a#logo {
        opacity: 1;
    }

    .topmenu ul.navbar-nav {
        margin-right: 0px;
        padding: 0;
    }

    .topmenu.navbar-inverse,
    .topmenu.navbar-default {
        background-color: transparent;
        margin-bottom: 0;
    }
    .topmenu.navbar-fixed-top {
        /*position: absolute;
        left: 10px;*/
    }
    .navbar-default .navbar-toggle .icon-bar {
        height: 3px;
        background-color: #fff;
    }
    .topmenu.navbar-default .navbar-collapse {
        padding-right: 15px;
        padding-left: 15px;
        overflow-x: visible;
        -webkit-overflow-scrolling: touch;
        border-top: 1px solid transparent;
        -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
        max-height: 100%;
    
        background-color: rgba(40,40,40, 0.9) ;
    }
    nav.navbar.bootsnav.navbar-mobile .navbar-collapse {
        z-index: 9999 !important;
    }

    nav.topmenu.navbar.bootsnav.navbar-mobile .navbar-collapse { /* mobile menu bg color */ 
        background-color: #fff;
        box-shadow: 10px 0 15px 0 rgba(0,0,0,.5);
    }
    
    .top-link-xs {
        width: 70%;
        margin-top: 5px;
        margin-right: 5px;
    }
    .navbar-close {
        background-color: transparent;
        border: 0;
        padding: 0;
        position: absolute;
        top: 5px;
        left: 5px;
    }
    .navbar-close i {
        color: #fff;
        z-index: 99;
        width: 30px;
        height: 30px;
        line-height: 29px;
        transition: 0.3s ease-in-out;
        background-color: #d71a21;
        border-radius: 0;
        display: block;
        border-radius: 5px;
    }
    .navbar-close i::before {
        font-size: 17px !important;
        font-family: 'Font Awesome 5 Solid';
        font-weight: 900;
        font-style: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\f00d";
        color: #fff;
        line-height: 29px;
    }
    nav.navbar.bootsnav.navbar-mobile ul.nav {
        padding-right: 0;
        padding-left: 0;
        margin-right: 0;
        margin-left: 0;
        width: auto;
    }
    .home-link {
        background-color: transparent;
        color: #fff;    
        margin-top: 5px;
    }
    .home-link a, .home-link i, .topmenu .navbar-nav > li.home-link > a {
        color: #d71a21;
        transition: 0.3s ease-in-out;
    }
    .topmenu .navbar-nav > li.home-link > a:hover,
    .topmenu .navbar-nav > li.home-link > a:focus,
    .home-link a:hover i, li.home-link > a:focus i {
        color: #000;

    }
    nav.navbar.bootsnav li.dropdown > a.dropdown-toggle::before {
        content: "\f107";

        font-family: 'Font Awesome 5 Solid';
        font-weight: 900;
        font-style: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;

    }
    nav.bootsnav .megamenu-content {
        margin-left: 15px;
        margin-right: 15px;
    }
    nav.navbar.bootsnav .dropdown .megamenu-content .col-menu ul > li > a {
        padding-top: 0;
        padding-bottom: 0;
    }

    
    ul.menu-col li a, 
    .topmenu .navbar-nav > li > a, .top-contact a, 
    .topmenu ul.navbar-nav > li ul.dropdown-menu > li > a,
    .topmenu .navbar-nav > li.active-link > a:hover {
        color: #000;
    }
    
    .topmenu .navbar-nav > li.active-link > a {
        color: #fff;
    }
    /*.top-contact a:hover, 
    .top-contact a:focus, 
    .topmenu .navbar-nav > li > a:hover, 
    .topmenu .navbar-nav > li > a:focus, 
    .navbar-close:hover i, .navbar-close:focus i, 
    ul.menu-col li a:hover, ul.menu-col li a:focus, 
    .topmenu ul.navbar-nav > li ul.dropdown-menu > li > a:hover, 
    .topmenu ul.navbar-nav > li ul.dropdown-menu > li > a:focus {
        color:#db9d2f;
    }*/

    nav.navbar.bootsnav.navbar-mobile ul.nav {
        border-top: none;

    }

    /******************************/

    #collapsemenu > ul.navbar-nav > li > ul.dropdown-menu {
        
        margin-bottom: 0px !important;
        margin-top: 0px !important;
        /*
        box-shadow: none !important;
        
        color: white;
        position: relative;
        top: auto;
        left: auto;
        float: none;
        
        padding-top: 0;
        padding-bottom: 0;
        margin-top: 0;
        margin-bottom: 2px;

        font-size: 14px;
        
        list-style: none;
        background-color: transparent !important;

        border:0;
        border-radius: 0;
        
        min-width: 220px;
        
        
        animation-duration: 0s !important;
        animation-fill-mode: none !important;
        -webkit-box-shadow: none !important;
        */
        
        /*margin-top: 0px; 
        background-color: rgba(31, 48, 71, 0.7);
        color: white;
        padding: 0;
        border: 1px solid rgba(87, 168, 231, 0.7) !important ;
        border-radius: 5px;*/
    }
    #collapsemenu .dropdown-menu > li > a {
        padding-right: 15px;
        padding-left: 15px;
    }
    #collapsemenu ul.navbar-nav > li > ul.dropdown-menu > li > a {
        color: #fff;
    }

    .top-contact .clock {
        text-align: center;
        margin-top: 5px;
        font-size: 10px;
        font-weight: 400;
    }
    .top-contact ul.fa-social a i {
        color: #fff;
        font-size: 13px;
    }
    .top-contact ul.fa-social li {
        margin-left: 5px;
    }
    .top-contact ul.fa-social li a {
        width: 30px;
        height: 30px;
        line-height: 30px;
    }
    .top-contact ul.fa-social li a i{
        color: #fff;
        font-size: 13px;
    }
    .site-header .navbar-brand {
        padding:10px 0 7px 0;
    }
    .searchbar-block {
        min-height: 40px;
    }
    .searchbar-block .admin {
        display: inline-block;
        padding: 0 0 0 15px;
        line-height: 40px;
    }
    .searchbar-block .admin .title, .searchbar-block .admin .name {
        font-size: 12px;
        font-weight:500 ;
    }

    /********* search block xs *************/
    .navbar-container {
        width: 100%;
    }
    .dropdown.show .dropdown-menu.show {
        display: block !important;
    }
    .search-block-xs button.search-button {
        line-height: 18px;
        background-color: transparent;
        border: 0;
    }
    .search-block-xs button.search-button::before {
        content: "";
        display: none;
    }
    .search-block-xs button.search-button i {
        color: #cccccc;
        font-size: 20px;
        padding-top: 8px;
    }
    .search-block-xs button.search-button span {
        color: #cccccc;
        font-size: 13px;
        font-weight: 600;
    }

    .search-block-xs #search-box {
        min-width: 55vw;
        border: 0;
        padding: 0;
        margin: 0;
    }
    .news-search-form {
        padding: 0;
    }
    .search-block-xs #search-box.dropdown-menu {
         /*left: 0;
        right: auto;*/
        background-color: #fff;
    }

    .sticky-logo-xs {
        margin-right: auto;
        margin-left: auto;
        display: inline-block;
    }

}

/***************** Bottom and Contactus *********/
#contact input, #contact textarea {

    border-radius: 0;
    
}
#contact i {

    margin-left: 5px;
    margin-right: 5px;
}
.scroll-top-wrapper {

     overflow:hidden;
     text-align:center;
     width:40px;

     position:fixed;
     opacity:0;
     visibility:hidden;
     z-index:99;
     color:#fff;
     height:40px;
     line-height:38px;
     /*right:20px;*/
     bottom:30px;

    transition:all 0.5s ease-in-out;

    background-color: #D92300;
    border-radius: 50%;
    border: 1px solid #D92300;

}
.scroll-top-wrapper i.fa {
    line-height: 32px;
    font-size: 20px;
    color: #fff;

    transition:all 0.5s ease-in-out;
}
.scroll-top-wrapper:hover i.fa {
    color: #D92300;


}
.scroll-top-wrapper:hover {
    box-shadow: 0px 2px 9px -5px rgba(0, 0, 0, 0.3);
    color: #fff;
}
.scroll-top-wrapper.show {
     visibility:visible;
     cursor:pointer;
     opacity:1
}

.form-group-upload {
    border: 1px solid #cccccc;
    border-radius: 3px;
}
.upload-block {
    
}
.upload-control {
        padding: 2px;
}
@media (min-width: 768px) {

    .topbars-Wrapper {
        position: absolute;
        top: -31px;
        right: 0;
        left: 0;
        z-index: 99;
    }

    .upload-block {
        display: table;
        padding-left: 5px;
        padding-right: 5px; 
    }
    .upload-control {
        max-width: 250px;
        display: table-cell !important;
        white-space: nowrap;
        
    }
}
@media (max-width: 767px) {
    .upload-control {
        overflow: hidden;
        
        max-width: 100%;
    }
    .prevent-excced-width {
        max-width: 100%;
        overflow: hidden;
    }
}
/************************************************/

.header-data-social ul {
  display: inline-block;
  margin-right: 30px;
}


.topmenu .navbar-nav > li > a {
    line-height: 25px;
    color: #d71a21; /*222*/
    font-family:"Cairo";
}
.topmenu .navbar-nav > li > a::before {
    position: absolute;
    bottom: 0;
    
    width: 0;
    height: 3px;
    background: #fff;
    content: "";
    webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;

    display: none;
}

.topmenu .navbar-nav > li > a:hover, .topmenu .navbar-nav > li > a:focus {
    color: #1f1f1f;
}
.topmenu .navbar-nav > li > a:hover::before {
    width: 100%;
}

.topmenu .navbar-nav > li.active-link > a {
    color: #fff;
}
.topmenu .navbar-nav > li.active-link > a::before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: #D92300;
    content: "";
    webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

/* remove the background on hover over sub menu items */
.topmenu ul.navbar-nav > li ul.dropdown-menu > li > a:hover, 
.topmenu ul.navbar-nav > li ul.dropdown-menu > li > a:focus {
    background-color: transparent;
    
}




/*#collapsemenu > ul > li.menu-item-has-children:hover > a::before {
    top: 100%;
    opacity: 1;
    z-index: 9999;
}*/

/** Sub menu **/


#collapsemenu ul.navbar-nav li li {
    display: block;
    position: relative;
    margin: 0;
}
#collapsemenu ul.navbar-nav li li a {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    padding: 8px 0;
    text-transform: none;
    transition: 0.5s;
    display: inline-block;
    position: relative;
    background-color: transparent;
    white-space: nowrap;
    line-height: 1;
    border: none;
}
#collapsemenu ul.navbar-nav li li a:hover {
    color: #fff;
}

    /*#collapsemenu > ul > li.menu-item-has-children > a::before {
        content: "";
        position: absolute;
        top: 120%;
        left: calc(50% - 5px);
        width: 13px;
        height: 13px;
        transform: rotate(45deg);
        border-left: 1px solid #cccccc;
        border-top: 1px solid #cccccc;
        background-color: #fff;
        z-index: -1;
        padding: 0;
        margin: -9px -7px 0 0;
        transition: top 0.25s ease 0s, opacity 0.1s;
        opacity: 0;
    }*/

@media (min-width: 768px) and (max-width: 991px) {
    #collapsemenu ul.navbar-nav ul.more-link {
        right: -90px !important;
    }
    .topmenu .navbar-nav > li > a {
        font-size: 14px !important;
    }
}

@media (min-width: 768px) {
    


    #collapsemenu ul.navbar-nav ul {
        /*top: 100%;
        width: auto;
        min-width: 180px;
        border: 1px solid rgba(0, 0, 0, 0.2);
        background-color: #fff;
        padding: 5px 0 10px 0;
        border-radius: 0;
        box-shadow: none;

        margin: 0;
        list-style-type: none;
        right: -43px !important;*/
    }
    #collapsemenu ul.navbar-nav li:hover > ul {

        top: 90%;
        /*opacity: 1 !important;
        z-index: 999;
        top: 95%;
        transform: scaleX(1);*/
    }
    #collapsemenu ul.navbar-nav li:first-child > ul {
        left: -30px;
    }

}

@media (max-width: 767px) {

    .topmenu .navbar-nav > li > a:hover, .topmenu .navbar-nav > li > a:focus {
        color: #d71a21;
    }
    /*
    .dropdown-submenu {
        padding: 0;
    }
    .menu-item-has-children ul.dropdown-submenu {
        height: 0;
        overflow: hidden;
        background-color: #fff;
    }
    .menu-item-has-children.on ul.dropdown-submenu {
        height: 100%;
    }
    */
    #collapsemenu ul.navbar-nav > li > ul.dropdown-menu > li > a {
        padding-top: 4px !important;
        padding-bottom: 4px !important;
        font-size: 14px !important;
    }
}
/******* sidebar-nav *****************/

.topmenu .sidebar-nav {
    padding: 10px 10px 20px 10px;
}

.topmenu .sidebar-nav li a {
    font-size: 16px;
}


/**********************/
/**********************/

.top-section {
    background-color: white;
}

.SearchBlock {}

.menu-container #logo {
    text-align: center;
    width: 0;
    transition: 0.3s ease-in-out;
    max-width: 0px;
    margin: 0;
    padding: 0;
    background-color: #fff;
    
    overflow: hidden;
    min-height: 26px;
    display: flex;
    align-content: center;
    align-items: center;
    height: 67px;
    border-radius: 3px;
}

.menu-container #logo img {
    border: 1px solid #fff;
    max-width: 140px;
    display: flex;
    align-self: center;
    overflow: hidden;
   
    margin-right: 5px;
    margin-left: 5px;
}
.is-sticky .menu-container #logo {
    width: 140px !important;
    max-width: 140px;
    min-height: 26px;
    display: flex;
    align-content: center;
    align-items: center;
    
    
}
.special-font-text {
    color: #4075a7;
    vertical-align: text-top;
}

.text-white {
    color: white;
}
.text-white a {
    color: white;
}
.text-white a:hover {
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
}

.topmenu.navbar .navbar-brand { /*.affix-top*/

    
    max-width: 201px;
    height: 85px;
    margin: 0;
    padding: 0;
    background-size: contain;
    transition: 0.2s ease-in-out;
    
}
/*
.topmenu.navbar.affix .navbar-brand {

    width: 55px;
    margin: 5px 0 0 0;
    padding: 0;
    background-size: contain;
    transition: 0.3s ease-in-out;
    height: 65px;

}
*/

.topmenu.navbar .navbar-brand img {
    max-height: 100%;
    /*transition: 0.3s ease-in-out;*/
}

.topmenu.navbar #collapsemenu > ul > li.dropdown > a i.arrow {
    transition: all 0.2s ease;
    display: inline-block;
    justify-content: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;
    line-height: 12px;
    height: 17px;

    margin-left: 3px;
    margin-right: 3px;
    vertical-align: middle;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
@media (max-width: 767px) {

    .topmenu.navbar #collapsemenu > ul > li.dropdown > a i.arrow {
        vertical-align: text-top !important;
        margin-top: 8px !important;
        font-size: 26px;
        margin-left: 10px;
        margin-right: 10px;
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
}

.topmenu.navbar #collapsemenu > ul > li.dropdown > a i.arrow::after {

    content: "\f078";
    font-family: 'Font Awesome 5 Solid';
    font-style: normal;
    font-size: 60%;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.topmenu.navbar #collapsemenu > ul > li.dropdown > a.open i.arrow, .topmenu.navbar #collapsemenu > ul > li.dropdown.on > a i.arrow {
    transform: rotateZ(-180deg);
    -webkit-transform: rotateZ(-180deg);
}
/****************************************/
#collapsemenu ul.navbar-nav > li > ul.dropdown-menu > li > a {
    color: #1f1f1f;

    position: relative;
    display: block;
    width: auto;
    height: auto;
    padding: 5px 25px;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 14px;
    line-height: 25px;
    cursor: pointer;
    transition: all 0.3s ease-in-out !important;
    -webkit-transition: all 0.3s ease-in-out !important;
    border-bottom: none;
    font-family: 'Cairo', sans-serif;
}

#collapsemenu ul.navbar-nav > li > ul.dropdown-menu > li > a:hover, #collapsemenu ul.navbar-nav > li > ul.dropdown-menu > li > a:focus {
    color: #000;
}
/*
#collapsemenu ul.navbar-nav > li > ul.dropdown-menu > li > a::before {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: #d92300;
    content: "";
    webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
#collapsemenu ul.navbar-nav > li > ul.dropdown-menu > li > a:hover::before {
    width: 100%;
}
*/
.header-carousel {
    /*height: 100%;*/


}
.carousel-bg {

    /*background: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,0));
    width: 100%;
    height: 100%;*/

    position: absolute;
    top: 0;
    left: 0;
}
/**************/
.header-carousel .carousel-inner > .carousel-item img.img-slide {
    /*height: calc(100vh - 120px);
    width: 100vw;
    overflow: hidden;*/

    width: 100%;
    min-width: 0;
    min-height: 0;
    height: auto;
    position: relative;
    vertical-align: middle;
}

.carousel-control {
    width: auto;
}
.carousel-control:hover, .carousel-control:focus, .carousel-control {
    opacity: 1 !important;
}
.carousel-control-prev, .carousel-control-next {
    background-image: none;
    margin-right: 0;
    margin-left: 0;
    width: auto;
    z-index: 99;
}
.carousel-control-prev .carousel-control-prev-icon,
.carousel-control-next .carousel-control-next-icon {

    background-size: 12px;
    height: 44px;
    width: 44px;
    color: white;
    line-height: 44px;
    font-weight: normal !important;
    /*text-shadow: 2px 2px 2px black;*/
    background-color: rgba(0, 0, 0, 0.3);
    transition: 0.5s;

}
a.carousel-control:hover .fa-angle-left, a.carousel-control:hover .fa-angle-right,
a.carousel-control:focus .fa-angle-left, a.carousel-control:focus .fa-angle-right {
    background-color: rgba(0, 0, 0, 0.5);
}
.carousel-caption2 {
    
    position: absolute;
    display: block;
    visibility: visible;
    
    top: 55px;
    z-index: 5;
    width: 55%;
    /*position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);*/
    /*background: url(../text-sli.png);*/
    
}
.carousel-caption2 h5 {
    z-index: 5;
    font-size: 15px;
    line-height: 14px;
    font-weight: 400;
    color: #d71a21;
    letter-spacing: 0px;
    visibility: inherit;
    transition: none 0s ease 0s;
    text-align: inherit;
    border-width: 0px;
    margin: 0px;
    padding: 0px;
    min-height: 0px;
    min-width: 0px;
    max-height: none;
    max-width: none;
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
    transform-origin: 50% 50% 0px;
}
.carousel-caption2 p {
    z-index: 7;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: rgb(102, 102, 102);
    letter-spacing: 0px;
    visibility: inherit;
    transition: none 0s ease 0s;
    text-align: inherit;
    border-width: 0px;
    padding: 0px;
    margin-top: 20px;
    min-height: 0px;
    min-width: 0px;
    max-height: none;
    max-width: none;
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
    transform-origin: 50% 50% 0px;

    width: 60%;
}

.carousel-caption2 h3 {
    z-index: 6;
    font-size: 30px;
    line-height: 35px;
    font-weight: 500;
    color: rgb(0, 0, 0);
    letter-spacing: 0px;
    visibility: inherit;
    transition: none 0s ease 0s;
    text-align: inherit;
    border-width: 0px;
    padding: 0px;
    margin-top: 15px;
    min-height: 0px;
    min-width: 0px;
    max-height: none;
    max-width: none;
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
    transform-origin: 50% 50% 0px;
    text-transform: uppercase;

}
.carousel-caption2 .btn {
    margin-top: 20px;
}
.carousel-indicators {
    bottom: 0px;
}
.carousel-indicators .active {
    background-color: #000;
    width: 10px;
    height: 10px;
}
.carousel-indicators li {
    border: none;
    background-color: #ccc;
    margin: 0 5px 0 5px !important;
    width: 10px;
    height: 10px;
}
/**************************************************/
/******************************************/
@media (min-width: 768px) {
    

    /* trick to prevent colapsing behaviour case I set colapse to every menu link in single page design */
    .topmenu.navbar .collapsing { height:inherit !important; }

    .topmenu.navbar.affix-top {
        background-color: transparent ;
        transition: 0.3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
    }
    .topmenu.navbar.affix {
        background-color: #1e304b;
        transition: 0.3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
    }

    #collapsemenu > ul { margin-top: 7px; }
    

    .topmenu.navbar.affix-top #collapsemenu ul.navbar-nav {
        margin-top: 30px;
        transition: 0.3s ease-in-out;
    }
    .topmenu.navbar.affix #collapsemenu ul.navbar-nav {
        margin-top: 12px;
        transition: 0.3s ease-in-out;
    }

    /*.topmenu.navbar #collapsemenu > ul > li:not(.dropdown) > a::after {
        content: '';
        position: absolute;
        top: 100%;
        left: 50%;
        width: 0;
        height: 2px;
        margin-top: 4px;
        transition: .3s all ease;
        background: linear-gradient(90deg, #edeff0 0%, #ffffff 100%);
    }
    .topmenu.navbar #collapsemenu > ul > li:not(.dropdown):hover > a::after {
        left: 0;
        width: 100%;
    }
    
    
    #collapsemenu ul.navbar-nav > li > ul.dropdown-menu::before {
        width: 10px;
        height: 10px;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-bottom: 10px solid rgba(87, 168, 231, 0.7);
        display: block;
        content: "";
        margin-top: -10px;
        float: right;
        margin-right: 30px;
    }
    */
    

    .topmenu .navbar-header {
        max-width: 200px;   
    }
}

.topmenu ul.navbar-nav {
    margin-right: 0;
    padding-right: 0;
    float: none;
}

@media (min-width: 992px) and (max-width: 1199px) {

    .topmenu ul.navbar-nav {
        margin-right: 0;
        padding-right: 0;
        padding-top: 0;
        padding-bottom: 0;
    }
    .topmenu .navbar-header {
        max-width: 350px;   
    }

    .topmenu.navbar .navbar-brand {
        width: 300px;
    }
    #collapsemenu > ul {
        /*margin-top: 25px;*/
    }
    .carousel-caption2 {
        top: 35px;
        
    }
    .carousel-caption2 h3 {
        font-size: 22px;
        line-height: 27px;
    }
    .carousel-caption2 p {
        margin-top: 10px;
        margin-bottom: 0;
    }

}

@media (min-width: 768px) and (max-width: 991px) {
    
    .topmenu.navbar {
        /*min-height: 130px;*/
    }

    .topmenu.navbar.affix-top .navbar-brand, .topmenu.navbar.affix .navbar-brand {
        width: 90px;
        height: 80px;
        margin-left: 5px;
    }
    
    .topmenu .navbar-header {
        /*max-width: 100%;
        text-align: center;
        margin-right: auto;
        margin-left: auto;
        float: none;*/
    }
    .topmenu.navbar .navbar-brand {
        /*margin-right: auto;
        margin-left: auto;
        float: none;
        display: block;*/
    }
    .topmenu ul.navbar-nav {
        /*margin-right: auto !important;
        margin-left: auto !important;
        clear: both !important;
        margin-top: 0 !important;
        float: none !important;
        display: table;*/
    }

    .topmenu .navbar-right {
        padding-right: 10px;
    }
    .topmenu .navbar-left {
        padding-left: 10px;
    }
    .topmenu .Social {
        width: 205px !important;
    }
    .topmenu .navbar-nav > li {

    }
    .topmenu .navbar-nav > li > a {

    }

    .topmenu .Social a {
        width: 27px !important;
        height: 27px !important;
        background-size: 27px !important;
    }
}


@media (min-width: 480px) and (max-width: 767px) {
    #NewsPage img,
    .main-container p img {
        max-width: 100% !important;
    }

    .HomeProductBlock header {
        font-size: 21px;
    }


    
}


@media (max-width: 767px) {
    
    
    /*****************************/
    header#header {
        height: auto;
        width: 100%;
        padding-top: 0;
        position: relative;
    }
    
    .header-data-social p, .header_top_item span {
        /*display: none;*/
    }
    .header_top_item a.top-phone {
        border: 1px solid #edfbef;
        padding: 2px 5px;
        border-radius: 10px;
    }
    
    .carousel-control .fa-angle-left,
    .carousel-control .fa-angle-right {

        font-size: 35px;

    }
    .carousel-inner > .carousel-item > img, .carousel-inner > .carousel-item > a > img {
        width: 100% !important;
    }
    .carousel-control.left, .carousel-control.right {
        display: none;
    }
    .carousel-indicators {
        bottom: 0px;
    }
    .carousel-caption2 {
        top: 10px;
        width: 65%;
    }
    .carousel-caption2 h3 {
        font-size: 15px;
        line-height: 23px;
        margin-top: 10px;
        margin-bottom: 5px;
    }
    .carousel-caption2 p {
        margin: 0;
    }
    /************************/
    .footer-menu-section.footer-logo {
        min-height: auto !important;
        margin-bottom: 30px;
    }
    .footer-menu-section .footer-menu li {
       
        overflow: hidden;
        font-size: 14px;
        margin-bottom: 10px !important;
    }
    .footer-menu-section .footer-menu li span, 
    .footer-menu-section .footer-menu li a {
        font-size: 14px !important; 
        margin-bottom: 0 !important;
    }
    .footer-menu-section .footer-menu {
        
    }
    .NewsLetterBlock {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .scroll-top-wrapper {
        /*bottom: 20px;*/
    }

}

@media screen and (orientation: portrait) and (max-width: 379px) {
    .searchbar-block .admin {
        display: inline-block;
        padding: 0 0 0 10px;
    }
    .searchbar-block .admin .title, .searchbar-block .admin .name {
        font-size: 10px;
        font-weight:500 ;
    }
}


@media screen and (orientation: landscape) and (max-width: 767px) {

}

.bottomfooter-container {
    background-color: #111111;
    display: block;
    position: relative;
    padding: 0 0 3px 0 ;
    border-top: 1px solid rgba(255, 255, 255, 0.2); 
    overflow: hidden;
}

.footer-copyright {
    font-weight: 600;
    font-size: 15px;
    color: #C0C1C2;
    line-height: 25px;
}
.poweredby {
    letter-spacing: 1px;
    font-size: 12px;
    color: #e5e7ef;
}
.footer-copyright a, .poweredby a {
    color: #797979;
    font-size: 13px;
    padding-right: 10px;
    font-weight: 300;
    white-space: nowrap;
}
.footer-copyright a:hover, .poweredby a:hover {
    color: white;
}
.real-developer {
    font-size: 13px;
    float: left;
    color: rgba(255, 255, 255, 0.8);
    line-height: 18px;
}
.real-developer a, .real-developer a:hover {
color: rgba(255, 255, 255, 0.9);
direction: ltr;
}


/***************************************************/

#ContactForm {
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 30px 50px 30px;
    border-radius: 3px;
    margin-bottom: 50px;
    position: relative;
    margin-bottom: 7px;
}

.Contact-page #ContactForm {
    background-color: rgba(217, 35, 0, 0.01);
    border: 1px solid rgba(217, 35, 0, 0.6);
    padding: 30px 50px 30px;
    border-radius: 3px;
    margin-bottom: 50px;
    position: relative;
    margin-bottom: 7px;
}

#ContactForm .form-control {
    background-color: rgba(255, 255, 255, 0.6);
    color: #000;
}
.Contact-page #ContactForm {
    padding: 30px 29px 30px;
    margin-top: 30px;
}

#ContactForm h2 {
    margin-bottom: 5px;
    text-align: center;
    color: #fff;
    text-transform: capitalize;
    font-weight: 600;
}
#ContactForm p {
    text-align: center;
    color: #fff;
    text-transform: capitalize;
}
#ContactForm p label {
    font-size: 17px;
    display: block;
    text-align: center;
    text-align-last: center;
    text-shadow: 1px 1px 1px #000;
    background-color: rgba(255, 255, 255, 1);
    margin: 20px;
    padding: 3px;
    z-index: 99999;

}
#ContactForm .form-control, #ContactForm .btn {
    border-radius: 0;
}
/****************************************************/

@media (max-width: 767px) {
    .poweredby {
        letter-spacing: 0;
        text-align: center !important;
        color: #e5e7ef;
    }

}




@media (min-width: 768px) {}

@media (min-width: 480px) and (max-width: 767px) {}

@media (max-width: 479px) {

    .HeaderTitle {
        font-size: 27px;
    }
    #ContactForm {
        padding: 30px 10px 30px;

    }
}

/*************** Footer Area ***************/
.top-border {
    border-top: 1px solid rgba(0, 43, 70, .3);
}
.bottom-border {
    border-bottom: 1px solid rgba(0, 43, 70, .3);
}
.main-footer-container {
    min-height: 370px;
    background-color: #111111;
    position: relative;
    color: #C0C1C2;
    padding-top: 50px;
    padding-bottom: 60px;
}

.main-footer-container.container-fluid {
    padding-left: 0;
    padding-right: 0;
}
.footer-menu-section {
    overflow: hidden;
}
.footer-menu-section.footer-logo {
    display: flex;
    align-content: center;
    align-items: center;
    height: 100%;
    min-height: 150px;
    justify-content: center;
}

.footer-menu-section p {
    color: #C0C1C2;
    line-height: 26px;
    font-size: 14px;
    text-align: justify;
    
}
.footer-menu-section .Contactus {
    color: #FFF;
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 10px 0;
    font-family:"Cairo" !important;
    
    position: relative;
    padding-bottom: 15px;

}
.footer-menu-section .footer-menu ul.submenu {
    list-style-type: none;
    overflow: hidden;
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
   

}
.footer-menu-section .footer-menu li {
    white-space: normal;
    margin-bottom: 15px;
    font-family: 'Cairo', sans-serif;
    font-weight: 500;
    
}

.footer-menu-section .footer-menu li i {
    color: #d92300;
    padding-right: 3px;
    padding-left: 3px;
    font-size: 5px;
    width: 20px;
    font-weight: 300;
    display: inline-block;
    vertical-align: top;

    transition-delay: 0s;
    transition-duration: 0.4s;
    transition-property: all;
    transition-timing-function: ease;
    display: none;
}

.footer-menu-section .footer-menu li span {
    display: inline-block;
}

.footer-menu-section .footer-menu li span,
.footer-menu-section .footer-menu li a {
    text-decoration: none;
    color: #DDDDDD;
    white-space: normal;
    font-size: 16px;
    transition-delay: 0s;
    transition-duration: 0.3s;
    transition-property: all;
    transition-timing-function: ease;
    font-weight: 500;
    margin-bottom: 15px;
    white-space: nowrap;
}
.footer-menu-section .footer-menu li a:hover {
    text-decoration: none;
    color: #fff;
}
.footer-menu-section .footer-menu li a:hover i {
    color: #000;
}
.dl-contact dt {
    width: 30px;
    text-align: center;
    margin-bottom: 4px;
    padding-top: 5px;
}
.dl-contact dd {

    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 4px;
    color: #fff;
    margin-left: 10px;
    margin-right: 10px;
    font-size: 14px;
}
.dl-contact dd a {
    color: #fff;
}
.dl-contact dt i {
    font-size: 15px;
    color: #D92300;
}
.dl-horizontal dt {
    overflow: hidden;
    
    text-overflow: ellipsis;
    white-space: nowrap;

}
.footer-social-block {
}
.footer-social .footer-title, .footer-social .social {
    display: table-cell;
    white-space: nowrap;
    vertical-align: top;
    font-weight: 800;
}
/*************************/
.footer-contact {
   
}
.glow-shadow {
    -webkit-filter: drop-shadow(0px 0px 1px rgba(255, 255, 255, 1));
    filter: drop-shadow(0px 0px 1px rgba(255, 255, 255, 1)); 
}
.vat-container img {
    max-height: 70px;
}
.footer-contact address {
    color: #ededed;
}
.footer-contact i.fa {
    width: 15px;
    vertical-align: baseline;
}
.footer-contact a:hover {
    text-decoration:none;
}

.footer-title
{
    line-height:33px;
    vertical-align: top;
    margin: 0;
}

.address-list div {

    padding: 0 0 10px 0;
    line-height: 22px;

}
.address-list .padding {

    display: block;
    
}
.address-list time {
    line-height: 22px;
}
.contact-form .address-list div {

    padding-top: 7px;
    padding-bottom: 7px;
}

/************* social icons ***************/

.footer-title {
    color: #58a9e8;
}
.footer-social
{
   overflow:hidden;
   clear:both;
   
}
.footer-social ul.fa-social
{   
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer-social .fa-social li {

    vertical-align: middle;
    margin-left: 8px;
    float: right;

}
.footer-social a 
{
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 39px;
    color: #fff;
    border-radius: 3px;
    display: block;
}
.top-contact ul.fa-social a i {
    color: #fff;
    font-size: 15px;
}
.top-contact ul.fa-social a:hover i {
    color: #fff;
}

.footer-social a.facebook {background-color: #45619d;}
.footer-social a.twitter {background-color: #00acee;}
.footer-social a.linkedin-in {background-color: #0077b5;}
.footer-social a.telegram {background-color: #2399d6;}
.footer-social a.whatsapp {background-color: #189d0e;}
.footer-social a.youtube-play {background-color: #da4834;}
.footer-social a.instagram {background-color: #983bf7;}
.footer-social a.rss {background-color: #eba832;}

.footer-social a.facebook:hover {background-color: #fff; color: #45619d;}
.footer-social a.twitter:hover {background-color: #fff; color: #00acee;}
.footer-social a.linkedin-in:hover {background-color: #fff; color: #0077b5;}
.footer-social a.telegram:hover {background-color: #fff; color: #2399d6;}

.footer-social a.whatsapp:hover {background-color: #fff; color: #189d0e;}
.footer-social a.youtube-play:hover {background-color: #fff; color: #da4834;}
.footer-social a.instagram:hover {background-color: #fff; color: #983bf7;}
.footer-social a.rss:hover {background-color: #fff; color: #eba832;}

/***********************/
.LoginBlock {
    text-align: center;
    padding-top: 10px;
}
/*******************************************/
@media (min-width: 768px) {
    
}
@media (min-width: 768px) and (max-width: 991px) {
    
    .footer-menu-section .footer-menu li span,
    .footer-menu-section .footer-menu li a {
        font-size: 13px;
    }
    .footer-social .footer-title {

        letter-spacing: 0px;
        font-size: 80%;
        padding-right: 0;
        padding-left: 0;
    }

    .main-footer-container {
        min-height: 370px;
        background-attachment: fixed;
        background-size: cover;
    }
    #ContactForm {
        padding: 20px 5px 15px;
    }

}
@media (max-width: 767px) {
    
    .main-footer-container {
        min-height: 370px;  
        background-attachment: fixed;
        background-size: cover;
    }
    .bottomfooter {
        padding-top: 2px;
        font-size: 12px;
        color: silver;
    }

    .contact-form > h2 {
        font-size: 22px;
    }
    .contact-form .address-list div {
        padding-left: 1px;
        padding-right: 1px;
    }
    
    .NewsLetterBlock .input-group-addon {
        display: table-caption !important;
        margin-bottom: 5px !important;
        width: 100% !important;
    }
    .footer-social .footer-title, .footer-social .social {
        display: block !important;
    }
    .footer-social a 
    {
        margin: 0 4px 0 3px;
    }
}


/************** .Net Fixed ********************/
.hr-line {
  border-bottom: 1px solid rgba(0,0,0,.12) !important;
}
.error-container label.error {
    display: block;
    
}
label.error {
    color: red;
    padding-right: 2px;
    font-size: 11px;

}
.mdl-textfield label.error {
   
    position: absolute;
    bottom: -2px;
    left: 5px !important;
    z-index: 1;
    white-space: nowrap;
}
.form-group {
    position: relative;
}
.input-group label.error {
   
    position: absolute;
    bottom: -1px;
    left: 45px;
    z-index: 99;
}
.form-group label.error {
   
    position: absolute;
    bottom: -1px;
    left: 5px;
    z-index: 99;
}
.mdl-textfield.is-dirty label.error {
    display: none;
}

.bg-danger label.Failure {
    font-size: 80%;
}
label.sucess {
    color: #339900;
    padding-right: 2px;
}

label.block {
    display: block;
    padding: 4px;
    background: #FFFFCC;
}

/**************.Net Fixed********************/

.fa-search:before {
    content: "\f002";
}

.fa-unlock:before {
    content: "\f09c";
}

.fa-graduation-cap:before {
    content: "\f19d";
}

.fa-tablet:before {
    content: "\f10a";
}

.fa-facebook:before {
    content: "\f39e";
}

.fa-instagram::before {
    content: "\f16d";
}

.fa-twitter:before {
    content: "\f099";
}
.fa-linkedin-in:before {
    content: "\f0e1";
}
.fa-telegram-plane:before {
    content: "\f3fe";
}
.fa-whatsapp:before {
    content: "\f232";
}
.fa-google-plus:before {
    content: "\f0d5";
}

.fa-rss:before {
    content: "\f09e";
}

.fa-angle-left:before {
    content: "\f104";
}

.fa-angle-right:before {
    content: "\f105";
}
.fa-square-full:before {
    content: "\f45c";

}
.fa-chevron-left:before {
    content: "\f053";
}

.fa-chevron-right:before {
    content: "\f054";
}

.fa-play:before {
    content: "\f04b";
}
.fa-play-circle::before {
    content: "\f144";
}
.fa-youtube-play::before {
    content: "\f167";
}

.fa-caret-down:before {
    content: "\f0d7";
}

.fa-map-marker::before, .fa-map-marker-alt::before {
    content: "\f3c5";
}
.fa-mobile:before { 
    content: "\f3cd";
}
.fa-sms:before {    
    content: "\f7cd";
}
.fa-print:before {
  content: "\f02f";
}
.fa-phone:before {
    content: "\f095";
}
.fa-phone-volume:before {
    content: "\f2a0";
}
.fa-envelope:before {
    content: "\f0e0";
}
.fa-fax:before {
    content: "\f1ac";
}
.fa-paper-plane::before {
    content: "\f1d8";
}
.fa-angle-up:before {
  content: "\f106";
}
.fa-arrow-circle-up::before {
    content: "\f0aa";
}
.fa-comment-o:before {
  content: "\f0e5";
}
.fa-user:before {
  content: "\f007";
}
.fa-chevron-down:before {
  content: "\f078";
}
.fa-users:before {
  content: "\f0c0";
}
.fa-briefcase:before {
  content: "\f0b1";
}
.fa-clock-o:before {
  content: "\f017";
}
.fa-globe:before {
  content: "\f0ac";
}
.fa-calendar-check-o:before {
  content: "\f274";
}
.fa-calendar-alt:before {
  content: "\f073";
}
.fa-trophy:before {
  content: "\f091";
}
.fa-arrow-right:before {
  content: "\f061";
}
.fa-long-arrow-alt-right:before {
  content: "\f30b";
}
.fa-long-arrow-alt-left:before {
  content: "\f30a";
}
.fa-home:before {
    content: "\f015";
}
.fa-pencil:before {
  content: "\f040";
}
.fa-plus:before {
    content: "\f067";
}
.fa-minus:before {
  content: "\f068";
}
.fa-bullseye:before {
  content: "\f140";
}
.fa-handshake:before {
  content: "\f2b5";
}
.fa-clipboard-check:before {
  content: "\f46c";
}
.fa-eye:before {
  content: "\f06e";
}
.fa-file-invoice-dollar:before {
    content: "\f571";
}
.fa-industry:before {
    content: "\f275";
}
.fa-tasks:before {
    content: "\f0ae";
}
.fa-calculator:before {
    content: "\f1ec";
}
.fa-university:before {
    content: "\f19c";
}
.fa-vote-yea:before {
    content: "\f200";
}
.fa-money-check-alt:before {
    content: "\f53d";
}
.fa-sticky-note:before {
    content: "\f249";
}
.fa-chart-bar:before {
    content: "\f080";
}
.fa-building:before {
    content: "\f1ad";
}
.fa-archive:before {
    content: "\f187";
}
.fa-ellipsis-h:before {
    content: "\f141";
}
/*************************/

.FBComments {
    /*direction:ltr;
    float:left;*/

    display: block;
}


.BodyCell {
    padding: 5px;
    background-color: white;
    background-image: none;
    font-size: 15px;
}
.HeaderCell {
    margin-bottom: 15px;
    font-family:"Cairo" !important;
    font-weight: 700;
    font-size: 19px;

}
.HeaderCell, .HeaderCell a {

    color: #D92300;
}
.HeaderCell a:hover {

    color: #000;
}

.head-title {
  font-size: 24px;
  font-weight: 600;
  text-transform: capitalize;
  color: #000;
  padding-top: 5px;
  margin-top: 0;
  padding-bottom: 5px;
  margin-bottom: 25px;
}
.head-sub-title {
  font-size: 18px;
  font-weight: 600;
  text-transform: capitalize;
  color: #D92300;
}
.main-container-fluid {
    padding-right: 0;
    padding-left: 0;
}
.main-container {
    min-height: 500px;
}

/********** Check Share Button *********/

#LikeBox {
    width: 90px;
    float: left;
}
.ShareBox {
    width: 300px;
    float: left;
}

.ShareBox iframe {
    border: none;
    margin: 0 2px;
    float: left;
}

.ShareBox .Facebook {
    background: url(../social/share.png) no-repeat 0 0;
    width: 60px;
    height: 20px;
    display: inline-block;
    border: 0;
    margin-left: 0px;
    margin-right: 1px;
    float: left;
}

.ShareBox .Twitter {
    background: url(../social/share.png) no-repeat -60px 0;
    width: 55px;
    height: 20px;
    display: inline-block;
    border: 0;
    margin-left: 0px;
    margin-right: 1px;
    float: left;
}

/*******************************************************/
.left-border {
    border-left: 1px solid #eeeeee;
}

/****************** HOME PAGE CSS ****************/

.mf-banner-medium.layout-4 {
    position: relative;
    border: 1px solid #eee;
}
.mf_empty_space_lg {
    clear: both;
    height: 12px;
}
.mf-banner-medium.layout-4 .banner-content {
    padding: 20px 20px 10px 20px;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.mf-banner-medium .link-all {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
}
.mf-banner-medium.layout-4 .banner-content .s-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}
.mf-banner-medium.layout-4 .banner-content .desc {
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    color: #000;
    max-width: 65%;
    text-transform: uppercase;
}
.mf-banner-medium.layout-4 .banner-content .subtitle {
    font-size: 12px;
    color: #d71a21;
    margin-bottom: 8px;
    text-transform: uppercase;
    line-height: 1;
    font-weight: 400;
    display: block;

}
.mf-banner-medium.layout-4 .banner-content .subdesc {
    font-size: 12px;
    color: #000;
    max-width: 65%;
    line-height: 17px;
    background-color: rgba(255, 255, 255, 0.6);
}

/********** home small cats **************/
.small-category-section {

}
.cat-content {
    padding-bottom: 3px;
}

.small-home-cat {
    position: relative;
    border: 1px solid #e6e6e6;
    overflow: hidden;

    display: flex;
    flex-grow: 1;
    flex-flow: row nowrap;

    transition: 0.3s ease-in-out;
}
a.small-home-cat:hover {
    border: 1px solid #E30B1C;
    box-shadow: 0 0 15px rgba(0,0,0,0.15);
    color: #E30B1C;
}
.small-home-cat .small-cat-img img {
    transform: scale(0.8);
    transition: 0.3s ease-in-out;

}
.small-home-cat:hover .small-cat-img img {
    transform: scale(0.9);
}

.btn-danger-reverse {
    background-color: transparent;
    color: #dc3545;
    border: transparent;
    line-height: 30px;

}
.btn-danger-reverse i {
    margin-left: 5px;
    margin-right: 5px;
    line-height: 30px;
    vertical-align: middle;
}
/********* contact Page [Fixed] ****************/

.contact-tel-block .padding {
    margin-right: 15px !important;
    margin-left: 15px !important;
}
.address-list .tel-dir {
    direction: ltr;
    display: inline-block;
    text-align: right;
}

.contact-social div.social {
    text-align: center;
    margin-right: auto;
    margin-left: auto;

}
.contact-social div.social a {
    display: inline-block;
    text-align: center;
    padding: 10px;

}
.contact-social div.social a i{
    font-size: 28px;
    color: silver;
}
.contact-social div.social a:hover i{
    color:#d92300
}
/********************************/
.text-section .address-list .padding {
    margin-right: 20px;
    margin-left: 20px;
}
.text-section .address-list {
    font-size: 15px;
}   
.text-section .address-list i {
    width: 15px;
    text-align: center;
}
.nav-tabs.nav-justified {
    border: initial;
}
.Contact-page .nav-tabs.nav-justified {
    padding-right: 0;
}
.tabs-custom > .nav-tabs.nav-justified > .active > a, .tabs-custom > .nav-tabs.nav-justified > .active > a:hover {
    border: none;
}
.tabs-custom > ul.nav-tabs.nav-justified {
    border-bottom: 1px solid #d7d7d7;
}
.Contact-page li.nav-item .nav-link {
    border: none;
    font-size: 14px;
    padding: 0 5px 5px 5px;
    text-transform: capitalize;
    white-space: normal;
    color: #555;
    background-color: transparent !important;
}
.Contact-page li.nav-item > .nav-link  {
  font-weight: 600;
}
.Contact-page li.nav-item .nav-link > span {
  font-size: 90%;
  text-transform: uppercase;
  display: inline-block;
  text-align: center;
  letter-spacing: 0px !important;
  font-weight: 400 !important;
  padding-right: 3px;
}
.Contact-page li.nav-item .nav-link > span::before {
    content: ' - ';
    display: inline-block;
}
.Contact-page li.nav-item.active .nav-link {
    color: #d92300;
}
.Contact-page li.nav-item {
    margin-bottom: -1px;
    display: inline-block;
    width: 32% !important;
    float: none;
    border: 0;
    cursor: pointer;
    transition: .33s all ease;
    position: relative;
}
.Contact-page li.nav-item .nav-link:hover, .Contact-page li.nav-item .nav-link:focus {
    background-color: transparent;

}
.Contact-page li.nav-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    height: 1px;
    width: 0;
    background: #d92300;
    transition: .22s ease;
}
.Contact-page li.nav-item.active::after {
    width: 100%;
}
.Contact-page .address-list > div.english-font {
    display: table;
}
.Contact-page .address-list i.fa, .Contact-page .address-list i.fas, 
.Contact-page .address-list i.fab, .Contact-page .address-list i.far {
    width: 35px;
    line-height: 1;
    padding-right: 0;
    padding-left: 0;
    font-size: 18px;
    color: #d92300;
    vertical-align: top;
}

.Contact-page .address-list i.fa, .Contact-page .address-list i.fa + span,
.Contact-page .address-list i.fas, .Contact-page .address-list i.fas + span,
.Contact-page .address-list i.far, .Contact-page .address-list i.far + span,
.Contact-page .address-list i.fab, .Contact-page .address-list i.fab + span {
    display: table-cell;
    /*text-align: left;*/
}

.Contact-page address.address-list {
    font-size: 14px;
    color: #29293a;
}
.Contact-page .tab-content {
    margin-top: 25px;
    overflow: hidden;
}
.dl-email-block {
    font-size: 14px;
    margin-left: 70px;
}
.dl-email-block dt{
    font-weight: lighter;
}
.dl-email-block dd{
    margin-bottom: 10px;
}

.Contact-page h4 {
    color: #d92300; 
    line-height: 49px;
    text-align: center;
    margin-bottom: 20px;
}
.Contact-page h4 i.fa, .Contact-page h4 i.far, .Contact-page h4 i.fas {
    width: 20px;
    text-align: center;
    line-height: 49px;
    height: 50px;
    width: 50px;
    border: 1px solid #d92300;
    border-radius: 50%;
    margin-right: 15px;
    margin-left: 15px;
    font-size: 20px;
    color: #d92300;
    vertical-align: top;
    text-indent: 4px;
}

/*********************************************/
/***********/
.client-section {
    overflow: hidden;
    background-color: #d92300;
    padding-top: 50px;
    padding-bottom: 50px;
}
.owl-carousel .thumbnail {
    overflow: hidden;
}

.client-section .owl-carousel .owl-thumbnail a img {
    /*-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,0.4);
    box-shadow: 0 0 5px 0 rgba(0,0,0,0.4);
    margin: 10px;
    transition: 0.5s ease-in-out;

    height: 150px;
    max-width: 200px;*/

} 
.client-section .owl-carousel .owl-thumbnail a:hover img {
    /*-webkit-box-shadow: 0 0 9px 0 rgba(0,0,0,0.6);
    box-shadow: 0 0 9px 0 rgba(0,0,0,0.6);
    margin: 10px;
    transition: 0.5s ease-in-out;*/
} 
.client-section .owl-carousel .owl-thumbnail img.img-rounded {
    border-radius: 0;
}
.client-section .owl-carousel .caption {
    font-size: 18px;
    font-weight: bold;
    height: 50px;
    line-height: 30px;
    overflow: hidden;
    padding:15px 0 0 0;
}
.client-section .owl-theme .owl-nav .owl-prev:before, .client-section .owl-theme .owl-nav .owl-next:before {
    color: #fff;
    transition: 0.2s ease-in-out;

}
.client-section .owl-theme .owl-nav .owl-prev:hover::before, .client-section .owl-theme .owl-nav .owl-next:hover::before {
    color: #666d81;
}
.client-section .main-title, .client-section .main-title a {
    color: #fff;

}
.client-section .main-title::before {
    top: 100%;
    height: 2px;    
    background-color: #fff;
    position: absolute;
    margin: 0 auto;
    width: 80px;
    content: "";
    border-radius: 3px;
}
.client-section .main-title::after {
    top: 110%;
    height: 0;
    border-bottom: 2px solid #fff;
    position: absolute;
    margin: 0 auto;
    width: 80px;
    content: "";
    border-radius: 3px;
}
/*****************************************/


@media (min-width: 992px) and (max-width: 1199px) {
    .dl-email-block {
        margin-left: 110px;
    }
    .footer-menu-section .Contactus {
        margin-bottom: 23px;
    }
    .footer-social-block {
        margin: 0;
    }
}
@media (min-width: 768px) and (max-width: 991px) {

    .left-border.hide-border-sm {
        border-left: 0;
        overflow: hidden;
    }
}
@media (max-width: 767px) {

    .small-home-cat .small-cat-img img {
        height: 75px;
    }

    .cat-content .title {
        font-size: 13px;
    }
    .left-border.hide-border-xs {
        border-left: 0;
        overflow: hidden;
    }

    .footer-social-block {
        margin: 0;
    }

    .text-section .address-list {
        font-size: 14px;
    }
    .dl-email-block {
        margin-left: 30px;
    }

    .Contact-page li.nav-item .nav-link {
        font-size: 12px;
        font-weight: bold;
    }

    .mf-banner-medium.layout-4 .banner-content {
        padding: 10px 10px 5px 10px;
    }
    .mf-banner-medium.layout-4 .banner-content .desc {
        font-size: 16px;
    }
    .mf-banner-medium.layout-4 .banner-content .subdesc {
      max-width: 80%;
    }

}
/******* Platform master css ***********/ 
body#body-platform {
    overflow-y: scroll;
}
th {
    font-weight: 600;
}
.main-header {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.sidebar-mini.sidebar-collapse .main-header {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.main-sidebar {
    top: 60px !important;
}
.fa-bars::before {
    content: "\f0c9";
}
.fa-file-alt::before {
    content: "\f15c";
}

.main-header .navbar-brand {
    padding-top: 0;
    padding-bottom: 0;
}
.img-platform-logo {
    max-height: 45px;
    max-width: 200px;
    margin: 0;
}
.mdl-card {
    width: auto;
}
.mdl-card__title {
    flex-direction: column;
}
.mdl-card__title h3{
    color: #737373;
    font-size: 30px;
    line-height: 2em;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.mdl-card__title p {
    font-style: italic;
    font-size: 17px;
    line-height: 23px;
    color: #a2a2a2;
}
/***************/
/* ======== General css ****/
.file-drop-block {
  border: 2px dashed #0087F7;
  border-radius: 4px;
  background: white;
  padding: 5px;
  position: relative;
}
.fa-paperclip:before {
  content: "\f0c6";
}
.fa-file-pdf-o:before {
  content: "\f1c1";
}
.fa-file-upload::before {
  content: "\f574";
}
.fa-file-word::before {
  content: "\f1c2";
}
#attach-trigger, #attach-form
{
    cursor:pointer;
}
.attach-btn
{
    position:relative;
}
.attach-hidden
{
    opacity:0;
    filter: alpha(opacity=0);
    
    width:100%;
    height:100%;
    display: block;
    position:absolute;
    top:0;
    right:0;
    z-index:9;
    cursor:pointer;
}
.upload-file, .uploaded-file {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
    margin-bottom: 15px;
}
.upload-file .upload-icon, .uploaded-file .upload-icon {
    color: #0087F7;
    font-size: 50px;
    display: inline-block;
    margin-left: auto;  
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;
}
/*=========================*/
.subscription-status .alert {
    padding-left: 30px;
    padding-right: 30px;
    line-height: 30px;
    margin-bottom: 0;
}
.subscription-status .alert .material-icons {
    vertical-align: text-top;
    padding-left: 5px;
    padding-right: 5px;
    color: #dc3545;
}
.center-form .mdl-textfield.full-width {
  width: 100% !important;
  min-width: 300px;
  
}
.tiny-person-thumb {
    width: 30px;
    height: 30px;
}
.card-header .data-row > div {
    line-height: 30px;
    font-weight: 400;
}
.tag-name {
    vertical-align: middle;
    margin: 0 5px;
    color: var(--indigo);
    font-size: 16px !important;
    cursor: pointer;
}
.nav-tabs .nav-link i {
    font-size: 15px !important;
    vertical-align: sub;
    color: var(--blue);
}
.nav-tabs .nav-link.active i {
    color: var(--indigo);
}
.nav-tabs .nav-link {
    /*padding: 0.5rem;*/
}
/*** Patient pages ****/
#PatientDetails.mdl-card {
    overflow: visible;
}
#PatientDetails .widget-user-image > img {
    background-color: #fff;
    border: 2px solid #fff;
}
.description-block {
    text-align: start !important;
}
.mdl-textfield.education-type-width {
    width: 152px !important;
}
#patient-tabs-header.nav {
    flex-wrap: nowrap;
}
#patient-tabs-header .nav-link {
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
}
#patient-tabs-header .nav-link i {
    vertical-align: top;
    align-items: center;
    display: flex;
}
/*--- Session Page ---*/
#AssignTherapistBlock {
    overflow: hidden;
}

/*--- Schudule ---*/
#SubmitFilter.mdl-button {
    padding-left: 10px;
    padding-right: 10px;
}

/**********************/
@media (max-width: 991px) {
    .font-smaller-md {
        font-size: 90%;
    }
}
@media (max-width: 767px) {
    .font-smaller-sm {
        font-size: 78%;
    }
    .nav-tabs .nav-link {
        /*padding: 0.5rem;*/
    }
    .description-block > .description-header, .description-block > .description-text {
        font-size: 14px;
    }
    .color-guid-block div span {
        letter-spacing: -0.5px;
        font-size: 0.75rem !important;
    }
}
@media (max-width: 575px) {
    .font-smaller-xs {
        font-size: 74%;
    }
    .main-footer {
        font-size: 15px;
    }
}
/******************************************//**
 * Owl Carousel v2.2.1
 * Copyright 2013-2017 David Deutsch
 * Licensed under  ()
 */


/*
 *  Owl Carousel - Core
 */

.owl-carousel {
    display: none;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    /* position relative and z-index fix webkit rendering fonts issue */
    position: relative;
    z-index: 1;
}

.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    -moz-backface-visibility: hidden;
    /* fix firefox animation glitch */
}

.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-wrapper,
.owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

.owl-carousel .owl-item img {
    display: block;
    width: 100%;
}

.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-dots.disabled {
    display: none;
}

.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-dot {
    cursor: pointer;
    cursor: hand;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.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 {
    visibility: hidden;
}

.owl-carousel.owl-drag .owl-item {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.owl-carousel.owl-grab {
    cursor: move;
    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 - Animate Plugin
 */

.owl-carousel .animated {
    animation-duration: 1000ms;
    animation-fill-mode: both;
}

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

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

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

@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}


/*
 *  Owl Carousel - Auto Height Plugin
 */

.owl-height {
    transition: height 500ms ease-in-out;
}


/*
 *  Owl Carousel - Lazy Load Plugin
 */

.owl-carousel .owl-item .owl-lazy {
    opacity: 0;
    transition: opacity 400ms ease;
}

.owl-carousel .owl-item img.owl-lazy {
    transform-style: preserve-3d;
}


/*
 *  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;
    transition: transform 100ms ease;
}

.owl-carousel .owl-video-play-icon:hover {
    -ms-transform: scale(1.3, 1.3);
    transform: 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;
    background-size: contain;
    transition: opacity 400ms ease;
}

.owl-carousel .owl-video-frame {
    position: relative;
    z-index: 1;
    height: 100%;
    width: 100%;
}




/**
 * Owl Carousel v2.2.1
 * Copyright 2013-2017 David Deutsch
 * Licensed under  ()
 */


/*
 *  Default theme - Owl Carousel CSS File
 */

.owl-theme .owl-nav {
    margin-top: 10px;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
}

.owl-theme .owl-nav [class*='owl-'] {
    color: #FFF;
    font-size: 14px;
    margin: 5px;
    padding: 4px 7px;
    background: #D6D6D6;
    display: inline-block;
    cursor: pointer;
    border-radius: 3px;
}

.owl-theme .owl-nav [class*='owl-']:hover {
    background: #869791;
    color: #FFF;
    text-decoration: none;
}

.owl-theme .owl-nav .disabled {
    opacity: 0.5;
    cursor: default;
}

.owl-theme .owl-nav.disabled+.owl-dots {
    margin-top: 10px;
}

.owl-theme .owl-dots {
    text-align: center;
    -webkit-tap-highlight-color: transparent;
}

.owl-theme .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
    *display: inline;
}

.owl-theme .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    margin: 5px 5px;
    background: #D6D6D6;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity 200ms ease;
    border-radius: 30px;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: #d71a21;
}

/************ Custom by john ***************/
.owl-carousel .owl-thumbnail {

  overflow: hidden;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
}
.owl-carousel .owl-thumbnail img {
    /*height: 100px;*/
    width: auto !important;
    margin-right: auto;
    margin-left: auto;
    /*max-width: 150px;*/
}
.owl-carousel .caption h4 {

  line-height: 1.3;
}

.owl-theme .owl-nav {


}

.owl-theme .owl-nav .owl-prev, .owl-theme .owl-nav .owl-next {  
  position: absolute;
  top: 50%;
  transform: translateY(-100%);
  background-color: transparent;
  font-size: 1px;
  color: transparent;


}
/*
.owl-theme .owl-nav .owl-prev {
    left: -40px;
}
.owl-theme .owl-nav .owl-next {
    right: -40px;
}
*/
.owl-theme .owl-nav .owl-prev::before { 
    content: "\f053";
    margin-right:5px;
    
}
.owl-theme .owl-nav .owl-next::before {  
    content: "\f054";
    margin-right:5px;
    
}
.owl-theme .owl-nav .owl-prev:hover, .owl-theme .owl-nav .owl-next:hover {

  background-color: transparent;
}
.owl-theme .owl-nav .owl-prev:before, .owl-theme .owl-nav .owl-next:before {

  font: normal normal normal 40px/1 'Font Awesome 5 Solid';
  color: #000;
}
.owl-theme .owl-nav .owl-prev:hover:before, .owl-theme .owl-nav .owl-next:hover:before {

  color: #25aa3b;
}


/*.owl-theme .owl-nav .owl-prev {
  right: -50px;
}
.owl-theme .owl-nav .owl-next {
  left: -50px;
}*/

@media (min-width: 1200px) {

    .owl-carousel .caption {
      /*height: 250px;*/
      overflow: hidden;
    }
    .owl-carousel .caption h4 {
     /* height: 70px;*/
      overflow: hidden;
    }
    .owl-carousel .caption p.brief {
      /*height: 95px;*/
      overflow: hidden;
    }
}
@media (min-width:992px ) and (max-width: 1199px) {
  
    .owl-carousel .caption {
      /*height: 250px;*/
      overflow: hidden;
    }
    .owl-carousel .caption h4 {
      /*height: 70px;*/
      overflow: hidden;
    }
    .owl-carousel .caption p.brief {
      /*height: 95px;*/
      overflow: hidden;
    }
}
@media (min-width: 768px) and (max-width: 991px) {

    .owl-carousel .caption {
      /*height: 250px;*/
      overflow: hidden;
    }
    .owl-carousel .caption h4 {
      /*height: 70px;*/
      overflow: hidden;
    }
    .owl-carousel .caption p.brief {
      /*height: 95px;*/
      overflow: hidden;
    }
}


@media (max-width: 767px) {

    .owl-carousel .caption {
      /*height: 200px;*/
      overflow: hidden;
    }
    .owl-carousel .caption h4 {
     /* height: 45px;*/
      overflow: hidden;
    }
    .owl-carousel .caption p.brief {
     /* height: 70px;*/
      overflow: hidden;
    }

    .owl-carousel .owl-nav {

        /*display: none;*/
    }

    .owl-carousel .owl-thumbnail img {
        /*height: 80px;*/
    }

}@charset "UTF-8";

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.2
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2017 Daniel Eden
 */

.animated{animation-duration:1s;animation-fill-mode:both}.animated.infinite{animation-iteration-count:infinite}.animated.hinge{animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{animation-duration:.75s}@keyframes bounce{0%,20%,53%,80%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);transform:translateZ(0)}40%,43%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-30px,0)}70%{animation-timing-function:cubic-bezier(.755,.05,.855,.06);transform:translate3d(0,-15px,0)}90%{transform:translate3d(0,-4px,0)}}.bounce{animation-name:bounce;transform-origin:center bottom}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.flash{animation-name:flash}@keyframes pulse{0%{transform:scaleX(1)}50%{transform:scale3d(1.05,1.05,1.05)}to{transform:scaleX(1)}}.pulse{animation-name:pulse}@keyframes rubberBand{0%{transform:scaleX(1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{transform:scaleX(1)}}.rubberBand{animation-name:rubberBand}@keyframes shake{0%,to{transform:translateZ(0)}10%,30%,50%,70%,90%{transform:translate3d(-10px,0,0)}20%,40%,60%,80%{transform:translate3d(10px,0,0)}}.shake{animation-name:shake}@keyframes headShake{0%{transform:translateX(0)}6.5%{transform:translateX(-6px) rotateY(-9deg)}18.5%{transform:translateX(5px) rotateY(7deg)}31.5%{transform:translateX(-3px) rotateY(-5deg)}43.5%{transform:translateX(2px) rotateY(3deg)}50%{transform:translateX(0)}}.headShake{animation-timing-function:ease-in-out;animation-name:headShake}@keyframes swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0deg)}}.swing{transform-origin:top center;animation-name:swing}@keyframes tada{0%{transform:scaleX(1)}10%,20%{transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{transform:scaleX(1)}}.tada{animation-name:tada}@keyframes wobble{0%{transform:none}15%{transform:translate3d(-25%,0,0) rotate(-5deg)}30%{transform:translate3d(20%,0,0) rotate(3deg)}45%{transform:translate3d(-15%,0,0) rotate(-3deg)}60%{transform:translate3d(10%,0,0) rotate(2deg)}75%{transform:translate3d(-5%,0,0) rotate(-1deg)}to{transform:none}}.wobble{animation-name:wobble}@keyframes jello{0%,11.1%,to{transform:none}22.2%{transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{transform:skewX(6.25deg) skewY(6.25deg)}44.4%{transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{transform:skewX(.390625deg) skewY(.390625deg)}88.8%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{animation-name:jello;transform-origin:center}@keyframes bounceIn{0%,20%,40%,60%,80%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:scale3d(.3,.3,.3)}20%{transform:scale3d(1.1,1.1,1.1)}40%{transform:scale3d(.9,.9,.9)}60%{opacity:1;transform:scale3d(1.03,1.03,1.03)}80%{transform:scale3d(.97,.97,.97)}to{opacity:1;transform:scaleX(1)}}.bounceIn{animation-name:bounceIn}@keyframes bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}.bounceInDown{animation-name:bounceInDown}@keyframes bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}.bounceInLeft{animation-name:bounceInLeft}@keyframes bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}.bounceInRight{animation-name:bounceInRight}@keyframes bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}.bounceInUp{animation-name:bounceInUp}@keyframes bounceOut{20%{transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;transform:scale3d(1.1,1.1,1.1)}to{opacity:0;transform:scale3d(.3,.3,.3)}}.bounceOut{animation-name:bounceOut}@keyframes bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.bounceOutDown{animation-name:bounceOutDown}@keyframes bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}.bounceOutLeft{animation-name:bounceOutLeft}@keyframes bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}.bounceOutRight{animation-name:bounceOutRight}@keyframes bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}.bounceOutUp{animation-name:bounceOutUp}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fadeIn{animation-name:fadeIn}@keyframes fadeInDown{0%{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}.fadeInDown{animation-name:fadeInDown}@keyframes fadeInDownBig{0%{opacity:0;transform:translate3d(0,-2000px,0)}to{opacity:1;transform:none}}.fadeInDownBig{animation-name:fadeInDownBig}@keyframes fadeInLeft{0%{opacity:0;transform:translate3d(-100%,0,0)}to{opacity:1;transform:none}}.fadeInLeft{animation-name:fadeInLeft}@keyframes fadeInLeftBig{0%{opacity:0;transform:translate3d(-2000px,0,0)}to{opacity:1;transform:none}}.fadeInLeftBig{animation-name:fadeInLeftBig}@keyframes fadeInRight{0%{opacity:0;transform:translate3d(100%,0,0)}to{opacity:1;transform:none}}.fadeInRight{animation-name:fadeInRight}@keyframes fadeInRightBig{0%{opacity:0;transform:translate3d(2000px,0,0)}to{opacity:1;transform:none}}.fadeInRightBig{animation-name:fadeInRightBig}@keyframes fadeInUp{0%{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}.fadeInUp{animation-name:fadeInUp}@keyframes fadeInUpBig{0%{opacity:0;transform:translate3d(0,2000px,0)}to{opacity:1;transform:none}}.fadeInUpBig{animation-name:fadeInUpBig}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fadeOut{animation-name:fadeOut}@keyframes fadeOutDown{0%{opacity:1}to{opacity:0;transform:translate3d(0,100%,0)}}.fadeOutDown{animation-name:fadeOutDown}@keyframes fadeOutDownBig{0%{opacity:1}to{opacity:0;transform:translate3d(0,2000px,0)}}.fadeOutDownBig{animation-name:fadeOutDownBig}@keyframes fadeOutLeft{0%{opacity:1}to{opacity:0;transform:translate3d(-100%,0,0)}}.fadeOutLeft{animation-name:fadeOutLeft}@keyframes fadeOutLeftBig{0%{opacity:1}to{opacity:0;transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{animation-name:fadeOutLeftBig}@keyframes fadeOutRight{0%{opacity:1}to{opacity:0;transform:translate3d(100%,0,0)}}.fadeOutRight{animation-name:fadeOutRight}@keyframes fadeOutRightBig{0%{opacity:1}to{opacity:0;transform:translate3d(2000px,0,0)}}.fadeOutRightBig{animation-name:fadeOutRightBig}@keyframes fadeOutUp{0%{opacity:1}to{opacity:0;transform:translate3d(0,-100%,0)}}.fadeOutUp{animation-name:fadeOutUp}@keyframes fadeOutUpBig{0%{opacity:1}to{opacity:0;transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{animation-name:fadeOutUpBig}@keyframes flip{0%{transform:perspective(400px) rotateY(-1turn);animation-timing-function:ease-out}40%{transform:perspective(400px) translateZ(150px) rotateY(-190deg);animation-timing-function:ease-out}50%{transform:perspective(400px) translateZ(150px) rotateY(-170deg);animation-timing-function:ease-in}80%{transform:perspective(400px) scale3d(.95,.95,.95);animation-timing-function:ease-in}to{transform:perspective(400px);animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;animation-name:flip}@keyframes flipInX{0%{transform:perspective(400px) rotateX(90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipInX}@keyframes flipInY{0%{transform:perspective(400px) rotateY(90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateY(-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotateY(10deg);opacity:1}80%{transform:perspective(400px) rotateY(-5deg)}to{transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipInY}@keyframes flipOutX{0%{transform:perspective(400px)}30%{transform:perspective(400px) rotateX(-20deg);opacity:1}to{transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@keyframes flipOutY{0%{transform:perspective(400px)}30%{transform:perspective(400px) rotateY(-15deg);opacity:1}to{transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipOutY}@keyframes lightSpeedIn{0%{transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{transform:skewX(20deg);opacity:1}80%{transform:skewX(-5deg);opacity:1}to{transform:none;opacity:1}}.lightSpeedIn{animation-name:lightSpeedIn;animation-timing-function:ease-out}@keyframes lightSpeedOut{0%{opacity:1}to{transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{animation-name:lightSpeedOut;animation-timing-function:ease-in}@keyframes rotateIn{0%{transform-origin:center;transform:rotate(-200deg);opacity:0}to{transform-origin:center;transform:none;opacity:1}}.rotateIn{animation-name:rotateIn}@keyframes rotateInDownLeft{0%{transform-origin:left bottom;transform:rotate(-45deg);opacity:0}to{transform-origin:left bottom;transform:none;opacity:1}}.rotateInDownLeft{animation-name:rotateInDownLeft}@keyframes rotateInDownRight{0%{transform-origin:right bottom;transform:rotate(45deg);opacity:0}to{transform-origin:right bottom;transform:none;opacity:1}}.rotateInDownRight{animation-name:rotateInDownRight}@keyframes rotateInUpLeft{0%{transform-origin:left bottom;transform:rotate(45deg);opacity:0}to{transform-origin:left bottom;transform:none;opacity:1}}.rotateInUpLeft{animation-name:rotateInUpLeft}@keyframes rotateInUpRight{0%{transform-origin:right bottom;transform:rotate(-90deg);opacity:0}to{transform-origin:right bottom;transform:none;opacity:1}}.rotateInUpRight{animation-name:rotateInUpRight}@keyframes rotateOut{0%{transform-origin:center;opacity:1}to{transform-origin:center;transform:rotate(200deg);opacity:0}}.rotateOut{animation-name:rotateOut}@keyframes rotateOutDownLeft{0%{transform-origin:left bottom;opacity:1}to{transform-origin:left bottom;transform:rotate(45deg);opacity:0}}.rotateOutDownLeft{animation-name:rotateOutDownLeft}@keyframes rotateOutDownRight{0%{transform-origin:right bottom;opacity:1}to{transform-origin:right bottom;transform:rotate(-45deg);opacity:0}}.rotateOutDownRight{animation-name:rotateOutDownRight}@keyframes rotateOutUpLeft{0%{transform-origin:left bottom;opacity:1}to{transform-origin:left bottom;transform:rotate(-45deg);opacity:0}}.rotateOutUpLeft{animation-name:rotateOutUpLeft}@keyframes rotateOutUpRight{0%{transform-origin:right bottom;opacity:1}to{transform-origin:right bottom;transform:rotate(90deg);opacity:0}}.rotateOutUpRight{animation-name:rotateOutUpRight}@keyframes hinge{0%{transform-origin:top left;animation-timing-function:ease-in-out}20%,60%{transform:rotate(80deg);transform-origin:top left;animation-timing-function:ease-in-out}40%,80%{transform:rotate(60deg);transform-origin:top left;animation-timing-function:ease-in-out;opacity:1}to{transform:translate3d(0,700px,0);opacity:0}}.hinge{animation-name:hinge}@keyframes jackInTheBox{0%{opacity:0;transform:scale(.1) rotate(30deg);transform-origin:center bottom}50%{transform:rotate(-10deg)}70%{transform:rotate(3deg)}to{opacity:1;transform:scale(1)}}.jackInTheBox{animation-name:jackInTheBox}@keyframes rollIn{0%{opacity:0;transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;transform:none}}.rollIn{animation-name:rollIn}@keyframes rollOut{0%{opacity:1}to{opacity:0;transform:translate3d(100%,0,0) rotate(120deg)}}.rollOut{animation-name:rollOut}@keyframes zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{animation-name:zoomIn}@keyframes zoomInDown{0%{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInDown{animation-name:zoomInDown}@keyframes zoomInLeft{0%{opacity:0;transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInLeft{animation-name:zoomInLeft}@keyframes zoomInRight{0%{opacity:0;transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInRight{animation-name:zoomInRight}@keyframes zoomInUp{0%{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInUp{animation-name:zoomInUp}@keyframes zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.zoomOut{animation-name:zoomOut}@keyframes zoomOutDown{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutDown{animation-name:zoomOutDown}@keyframes zoomOutLeft{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;transform:scale(.1) translate3d(-2000px,0,0);transform-origin:left center}}.zoomOutLeft{animation-name:zoomOutLeft}@keyframes zoomOutRight{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;transform:scale(.1) translate3d(2000px,0,0);transform-origin:right center}}.zoomOutRight{animation-name:zoomOutRight}@keyframes zoomOutUp{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutUp{animation-name:zoomOutUp}@keyframes slideInDown{0%{transform:translate3d(0,-100%,0);visibility:visible}to{transform:translateZ(0)}}.slideInDown{animation-name:slideInDown}@keyframes slideInLeft{0%{transform:translate3d(-100%,0,0);visibility:visible}to{transform:translateZ(0)}}.slideInLeft{animation-name:slideInLeft}@keyframes slideInRight{0%{transform:translate3d(100%,0,0);visibility:visible}to{transform:translateZ(0)}}.slideInRight{animation-name:slideInRight}@keyframes slideInUp{0%{transform:translate3d(0,100%,0);visibility:visible}to{transform:translateZ(0)}}.slideInUp{animation-name:slideInUp}@keyframes slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,100%,0)}}.slideOutDown{animation-name:slideOutDown}@keyframes slideOutLeft{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(-100%,0,0)}}.slideOutLeft{animation-name:slideOutLeft}@keyframes slideOutRight{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(100%,0,0)}}.slideOutRight{animation-name:slideOutRight}@keyframes slideOutUp{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,-100%,0)}}.slideOutUp{animation-name:slideOutUp}

@keyframes fadeInUpSmall {
    0% {
        opacity: 0;
        transform: translate3d(0, 10px, 0)
    }
    to {
        opacity: 1;
        transform: none
    }
}

.fadeInUpSmall {
    animation-name: fadeInUpSmall;
    animation-duration: 0.2s !important;
}
@keyframes fadeOutDownSmall {
    0% {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, 10px, 0)
    }
}

.fadeOutDownSmall {
    animation-name: fadeOutDownSmall;
    animation-duration: 0.2s !important;
}

/*******/
@keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        transform: none;
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 10px, 0);
    }
}

.fadeInDownSmall {
    animation-name: fadeInDownSmall;
    animation-duration: 0.3s !important;
}

@keyframes fadeOutUpSmall {
    0% {
        opacity: 1;
        transform: translate3d(0, 10px, 0);
    }
    70% {
        opacity: 0 !important; 
        
    }
    100% {
        opacity: 0 !important;
        transform: translate3d(0, 0, 0);
        
    }
}

.fadeOutUpSmall {
    animation-name: fadeOutUpSmall;
    animation-duration: 0.3s !important;
}
/******************************************************/
.inject-animation { opacity: 0; }
.AnimateOnLoad.is-hidden { opacity: 0; }
.carousel-inner .item:not(.active) .caption-animation, 
.carousel-inner .item:not(.active) .carousel-caption2
.carousel-inner .item.next .caption-animation { 
	opacity: 0 !important; 
}
.carousel-inner .item.active .caption-animation, .carousel-inner .item.active .AnimateOnLoad {
	animation-duration:1.4s;
	animation-fill-mode:both;
	animation-iteration-count: 1;
}
/*.carousel-inner .item.active .caption-animation.roll {

	-webkit-animation-name: rollIn;
    -moz-animation-name: rollIn;
    animation-name: rollIn;
}*/
.animation-delay-15 {
	animation-delay: 1.5s;
}
/******************************/
.scroll-down-arrow {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 2;
  display: inline-block;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  color: #fff;
  font : normal 400 20px/1 'Josefin Sans', sans-serif;
  letter-spacing: .1em;
  text-decoration: none;
  transition: opacity .3s;
}
.scroll-down-arrow:hover {
  opacity: .5;
}

.scroll-down-arrow i {
  position: absolute;
  top: 0;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: scrollDown 2s infinite;
  animation: scrollDown 2s infinite;
  opacity: 0;
  box-sizing: border-box;
}
.scroll-down-arrow i:nth-of-type(1) {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.scroll-down-arrow i:nth-of-type(2) {
  top: 16px;
  -webkit-animation-delay: .15s;
  animation-delay: .15s;
}
.scroll-down-arrow i:nth-of-type(3) {
  top: 32px;
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
}
@-webkit-keyframes scrollDown {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes scrollDown {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/***** Another type of scorll down ********/
.scroll-down-one-arrow {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 2;
  display: inline-block;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  color: #fff;
  text-decoration: none;
  transition: opacity .3s;
  opacity: 0.5;
	
	width: 25px;
	height: 39px;
}
.scroll-down-one-arrow:hover {
  opacity: 0.3;
}
.scroll-down-one-arrow i::before {
	color: white;
	display: block;
	font-size: 24px;
}
.scroll-down-one-arrow i {

	margin-top: 0;
    display: block;
    -webkit-animation: sdb04 3s;
    -moz-animation: sdb04 3s;
    animation: sdb04 3s;
        animation-iteration-count: 1;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@-webkit-keyframes sdb04 {
  0% {
    -webkit-transform: translate(0, 0);
  }
  20% {
    -webkit-transform:  translate(0, 25px);
  }
  40% {
    -webkit-transform:  translate(0, 0);
  }
}
@keyframes sdb04 {
  0% {
    transform: translate(0, 0);
  }
  20% {
    transform:  translate(0, 25px);
  }
  40% {
    transform:  translate(0, 0);
  }
}

.arabic-font {
    font-family:"Cairo" !important;
}
.english-font {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 300;
}

body, td {
    font-family: 'Tajawal', sans-serif;
    font-weight: 400;
    line-height: 25px;
}
h1, h2, h3, h4, h5, h6, .footer-copyright, .address-list  {
    font-family: 'Tajawal', sans-serif;
    font-weight: 500;
}

.footer-copyright  {
    font-family: 'Cairo', sans-serif;
    font-weight: 400;
}
.about-page p {
    line-height: 1.8;
    text-align: justify;

}
.topmenu .navbar-nav > li > a {
    font-size: 16px;
    font-weight: 600;
}

.footer-contact address {
    font-size: 15px;  
}
.footer-text {
    font-size: 16px;
}
.sort-info ul li::before {
    margin-right: -12px;
    margin-left: 5px;
}

.owl-theme .owl-nav .owl-prev:before {
  content: "\f105";
}

.owl-theme .owl-nav .owl-next:before {
  content: "\f104";
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  text-align: right;
}
::-moz-placeholder { /* Firefox 19+ */
  text-align: right;
}
:-ms-input-placeholder { /* IE 10+ */
  text-align: right;
}



/*----------------------------------------------------------------*/
/*----------------------------------------------------------------*/

.left-dir {
    direction: ltr;
    display: inline-block;
}
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;  
  overflow: hidden;
}
.line-clamp-2 {
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;  
  overflow: hidden;
}
.line-clamp-1 {
  display: -webkit-box !important;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;  
  overflow: hidden;
}
.NewsLetterBlock {
    /*margin-Left: 40px; */
}
.address-list .padding {
    margin-Right: 15px; 
}


.owl-theme .owl-nav .owl-prev {
  Right: -40px;
}
.owl-theme .owl-nav .owl-next {
  Left: -40px;
}

.dl-horizontal dt {
    float: Right;
    clear: Right; 
}
.dl-contact dd {
    margin-Right: 50px;
    margin-Left: 5px;
    
    /*padding-Right: 20px;
    border-Right: 1px solid #40607a;*/
}

.explore-timing-left {
    float: Right;
}
.explore-timing-right {
    text-align: Right;
    margin-Right: 74px;
}



.highlight-up {
    padding-Right: 62px;
}
.highlight-up img {
    Right: 0;
}
.highlight-up {
    text-align: Right;
}

.g-subscribe .btn-black {
    margin-Right: -50px !important;
}

.choice-list-left {
    float: Right; 
}
.choice-list-right {
    margin-Right: 76px;
}
.footer-menu-section strong {
    text-align: Right;
}
.footer-menu-section .Contactus::before {
    Right: 0;
}
.footer-menu-section .Contactus::after {
    Right: 20px;
}
.explore-bottom-right {
    float: Left;
}
.explore-timing {
    float: Right;
    padding-Right: 74px;
    padding-Left: 20px;
    position: relative;
}
.explore-timing .fas {
    Right: 0; 
    margin-Left: 10px;

}
.ttm-custombutton {
    margin-Left: -15px;
}
.menu-container #logo {
    margin-Right: -15px; 
}
.topmenu .navbar-nav > li > a::before {
    Right: 0;
}
.whatsapp_chatbot {
    right: 18px; 
}

.carousel-caption2 {
    right: 50px;
}
/*** alter material design & adminlte ***/

.mdl-textfield__label {
    Right: 10px !important;
    Left:initial !important;
}
/* alter all fonts of arabic */
.mdl-button, .mdl-textfield__input {
    font-family: "Cairo" !important;
}


@media (min-width: 992px) and (max-width: 1199px) {
    .dl-contact dd {
        margin-Right: 30px;
        margin-Left: 5px;
        padding-Right: 10px;
    }
    .carousel-caption2 {
        right: 85px;
    }
}
@media (min-width: 768px) 
{
    .highlight-blog:nth-child(1) {
        border-Right: 20px solid #fff;
    }
    .highlight-blog:nth-child(3) {
        border-Left: 20px solid #fff;
    }
}
@media (max-width: 767px) 
{
    .explore-timing {
        padding-Right: 60px;
        padding-Left: 15px;
        position: relative;
    }
    ..explore-timing:last-child {
        float: left;
    }

    body#inner .container.main-container img {
        height: auto !important;
        margin-right: auto;
        margin-left: auto;
    }
    .carousel-caption2 {
        right: 10px;
    }
}
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    background:black;
    overflow: hidden;

}
.preloader .bg {
    
    z-index: 9999;

    background:#fff;
    background-size: cover;

    width: 100%;
    height: 100%;

    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
    opacity: 0.4;
}

.spinner {
    border: 1px solid transparent;
    border-radius: 5px;
    position: relative;
    transform: translate(-35px,-35px);

    
}
.spinner:before {
     content:'';
     box-sizing:border-box;
     position:absolute;
     top:50%;
     left:50%;
     width:70px;
     height:70px;
     margin-top:0;
     margin-left:0;
     border-radius:50%;
     border:5px solid white;
     border-top-color:black;
     animation:spinner 0.9s linear infinite;


}
@-webkit-@keyframes spinner {
 to {
  transform:rotate(360deg)
 }
}
@keyframes spinner {
 to {
  transform:rotate(360deg)
 }
}
/******** another page loader 3 dots ******************/
.preloader {
    position: fixed;
    z-index: 99999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #fff;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
}

.preloader>.table {
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 100%;
    margin: 0;
}

.preloader>.table>.table-cell {
    display: table-cell;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    padding: 40px;
    text-align: center;
}

.preloader.loaded {
    opacity: 0;
    visibility: hidden;
    transform: scale(1.5);
    -webkit-transform: scale(1.5);
}
.sk-three-bounce {
  width: 8em;
  margin: auto;
  text-align: center;
}
.sk-three-bounce .sk-child {
  width: 2em;
  height: 2em;
  background-color: #d92300;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-three-bounce 1.4s ease-in-out 0s infinite both;
          animation: sk-three-bounce 1.4s ease-in-out 0s infinite both;
}
.sk-three-bounce .sk-bounce-1 {
  -webkit-animation-delay: -0.32s !important;
          animation-delay: -0.32s !important;
}
.sk-three-bounce .sk-bounce-2 {
  -webkit-animation-delay: -0.16s !important;
          animation-delay: -0.16s !important;
}

@-webkit-keyframes sk-three-bounce {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes sk-three-bounce {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/*****************************************************/
.whatsapp_chatbot {
    bottom: 25px;
    
    position: fixed;
    z-index: 999;
    transition: 0.2s ease-in-out;
}
.whatsapp_chatbot:hover {
  bottom: 25px;
}
.whatsapp_chatbot a {
    background-color: #49de56;
    
    display: flex;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);

      align-items: center;
      justify-content: center;

}
.whatsapp_chatbot a:hover {
    height: 50px;
    width: 50px;
    box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.3);
}
.whatsapp_chatbot a i {
    color: #000;
    font-size: 28px;
    /*color: #ffffff;
    font-size: 32px;
    height: 45px;
    width: 45px;
    line-height: 44px;
    text-align: center;*/
    transition: 0.2s ease-in-out;
    /*display: flex;
    justify-content: center;
    align-items: center;*/
}
.whatsapp_chatbot a:hover i {
    color: #fff;
    /*height: 50px;
    width: 50px;
    line-height: 49px;*/

}


/********************** Bootstrap two AR/EN Lang support **************/
.topmenu .Social a 
{
    float:Right; 
}
.carousel-caption2 {
}

.topmenu .navbar-nav > li 
{

    /*float:Right;*/
    
    
}
.service-gray-block .supplier-gray-inner {
    padding-Right: 75px;
    background-position: Right 0;
}

@media (min-width: 1400px) {
    .scroll-top-wrapper {
        Left:40px; 
    }
}
@media (max-width: 1399px) {
    .scroll-top-wrapper {
        Left:10px; 
    }
}

@media (min-width: 1200px) 
{
    .carousel-caption2 h3 {
        font-size: 34px;
    }
}
@media (min-width: 768px) and (max-width: 1199px)
{
    .topmenu .navbar-nav {
        padding: 0;
    }
    
    .topmenu .navbar-nav > li > a {
        padding:4px 0;
        font-size: 15px;
    }
}

@media (min-width: 768px) {
    .topmenu .navbar-nav > li
    {
        

        margin-right: 5px;
        padding-right: 5px;
        /*border-right: 1px #bd1a21 solid;*/

    }
    .topmenu .navbar-nav > li > a {
        padding-top: 9px;
        padding-bottom: 11px;
        padding-left: 0;
    }
}
@media (max-width: 767px) 
{

    .topmenu .navbar-nav 
    {
        padding-right: 20px;
        padding-left: 5px;
        padding-top: 0;
        padding-bottom: 5px;

        text-align: right;
        font-size: 15px;

    }
    .topmenu .navbar-nav > li > a
    {
        text-align: right;
        padding: 10px 25px 10px 3px !important;

    }
    #collapsemenu > ul.navbar-nav > li > ul.dropdown-menu { 
        /*margin-right: 16%; */
        text-align: right;
    }
    .header-explore .navbar-brand {
        float: Right;
    }
    /*.dropdown-toggle {
        padding-left: 20px !important;
    }*/
}

.flexbox-row {
    box-sizing: border-box;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.flexbox-column {

    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;

}

/**************** Custom carousel for fade effect
/* CSS used here will be applied after bootstrap.css */  
.carousel-inner > .item > img, .carousel-inner > .item > a > img {
        display: block;
        height: auto;
        width: 100%;
        line-height: 1;

    }

/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb 
*/
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}