/*
 Theme Name:   Danone communities
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Danone communities Theme
 Author:       Tigre Paris
 Author URI:   http://example.com
 Template:     twentytwenty
 Version:      1.3.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  danone
*/
/*
	Danone css
*/


* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
body {
    font-family: lato, sans-serif;
    font-size: 16px;
    line-height: 26px;
    color: #333;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    color: #424242;
    font-family: serifa, serif;
}
p {
    margin: 0;
}
ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
a {color: #ff7900;}
a,
a:hover {
    text-decoration: none;
}


/*=============================
   original WP theme
 =============================*/
 
.skip-link, .menu-modal.cover-modal {display: none;}
.skip-link {display: none;}




/*=============================
    general-style
 =============================*/
/*=== dc-btn ===*/
.theme-btn {
    font-size: 16px;
    font-family: serifa, serif;
    background: #00b3b2;
    color: #fff;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 0 30px 0 35px;
    line-height: 49px;
    position: relative;
    z-index: 1;
    display: inline-block;
    -webkit-transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    -o-transition: 0.3s ease-in;
    transition: 0.3s ease-in;
    text-decoration: none;
    border: none;
    -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.theme-btn.btn-sm {padding: 10px; line-height: normal;}

.nutrition .theme-btn, .nutrition-fr .theme-btn, .ernahrung .theme-btn {background: #ff7900;}

.theme-btn:hover {
    background-color: #0d277b;
    color: #fff;
}


.social-icons {
    margin-top: 39px;
}
.social-icons li {
    display: inline-block;
    margin-right: 15px;
}
.footer-area .footer-widget-wrap .footer-item ul.social-icons li {margin-right: 10px; display: inline-block;}
.social-icons li a, .footer-area .footer-widget-wrap .footer-item ul.social-icons li a {
    font-size: 18px;
    color: #333;
    background: #fff;
    border-radius: 50%;
    padding: 0 15px 0 15px;
    line-height: 45px;
    position: relative;
    z-index: 1;
    display: block;
    min-width: 40px;
    border: 3px solid #ff7900;
}
.social-icons li:first-child a, .footer-area .footer-widget-wrap .footer-item ul.social-icons li:first-child a {min-width: 50px; padding-left: 15px;}
.social-icons li a:hover, .footer-area .footer-widget-wrap .footer-item ul.social-icons li a:hover {border-color: #00b3b2; text-decoration: none;}

.footer-area .footer-widget-wrap .footer-item ul.social-icons li a:hover:after {display: none;}

/*=== section-heading ====*/
.section-heading .section__title {
    font-size: 48px;
    line-height: 1.2;
    font-weight: 700;
}
.section-heading .section__meta {
    color: #00b3b2;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
    margin-top: 8px;
    display: block;
}
/*===text__white ====*/
.section-heading .text__white {
    color: #fff;
}
/*=== section-icon ====*/
.section-icon {
    margin-bottom: 9px;
    line-height: 1px;
}
/*=== section-divider ====*/
.section-divider {
    height: 2px;
    background-color: #f2f0ec;
    position: relative;
    display: block;
}
/*=== loading-area ===*/
#loading-area {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #fff;
    top: 0;
    left: 0;
    z-index: 99999;
}
#loading-area .loader-box #loader-1 {
    -webkit-perspective: 120px;
    -ms-perspective: 120px;
    perspective: 120px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
#loading-area .loader-box #loader-1:before {
    content: "";
    position: absolute;
    left: 20px;
    top: 20px;
    width: 40px;
    height: 40px;
    background-color: #ff7607;
    -webkit-animation: flip 1s infinite;
    animation: flip 1s infinite;
}
#loading-area .loader-box .loader {
    width: 100px;
    height: 100px;
    position: relative;
}
@keyframes flip {
    0% {
        transform: rotate(0); }
    50% {
        transform: rotateY(180deg); }
    100% {
        transform: rotateY(180deg) rotateX(180deg); }
}

/*===================================
    container
=====================================*/
.container {
    max-width: 1200px;
}

/*===================================
    HEADER AREA
=====================================*/
.header-area .header-top-action {
    background: #f2f0ec;
    line-height: 32px;
    position: relative;
    z-index: 2;
}
.header-area .header-top-action .top-action-content {
    background: #00b3b2;
    position: relative;
    z-index: 1;
}
.header-area .header-top-action .info-action-content {
    background-color: transparent;
    
}
.header-area .header-top-action .info-action-content:before,
.header-area .header-top-action .info-action-content:after {
    display: none;
}
.header-area .header-top-action .top-action-content:before,
.header-area .header-top-action .top-action-content:after {
    content: '';
    width: 100%;
    height: 100%;
    background: #00b3b2;
    position: absolute;
    top: 0;
    right: 100%;
    z-index: -1;
}
.header-area .header-top-action .top-action-content:after {
    right: -20px;
    -webkit-transform: skew(-20deg,0deg);
    -moz-transform: skew(-20deg,0deg);
    -ms-transform: skew(-20deg,0deg);
    -o-transform: skew(-20deg,0deg);
    transform: skew(-20deg,0deg);
}
.header-area .header-top-action .top-action-content .info-box ul li {
    color: #fff;
    font-size: 15px;
    margin-right: 30px;
}
.header-area .header-top-action .top-action-content .info-box {
    padding-top: 4px;
    padding-bottom: 4px;
}
.header-area .header-top-action .top-action-content .info-box ul li:last-child,
.header-area .header-top-action .top-action-content .info-box ul.top-action-list li:last-child {
    margin-right: 0;
}
.header-area .header-top-action .top-action-content .info-box ul li a {
    color: #fff;
    -webkit-transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    -o-transition: 0.3s ease-in;
    transition: 0.3s ease-in;
}
.header-area .header-top-action .top-action-content .info-box ul li a:hover,
.header-area .header-top-action .top-action-content .info-box ul li a i {
    color: #fff;
}
.header-area .header-top-action .top-action-content .info-box ul li a i {
    margin-right: 5px;
    font-size: 12px;
}
.header-area .header-top-action .top-action-content .info-box ul.top-action-list li a {
    color: #818181;
    text-transform: capitalize;
}
.header-area .header-top-action .top-action-content .info-box ul.top-action-list li {
    margin-right: 24px;
}
.header-area .header-top-action .top-action-content .info-box ul.top-action-list li a:hover,
.header-area .header-top-action .top-action-content .info-box ul.top-action-list li a i:hover {
    color: #0d277b;
}
.header-area .header-top-action .top-action-content .info-box ul.top-action-list li a i {
    color: #818181;
    font-size: 14px;
}

/*=== header-top ====*/
.header-area .header-top {
    background-color: #fff;
    position: relative;
    z-index: 999;
}
.header-area .header-top .dc-top-wrap {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
}
.header-area .header-top .dc-top-wrap .dc-logo {
    height: 40px;
    display: table;
    vertical-align: middle;
}
.header-area .header-top .dc-top-wrap .dc-logo a {
    height: 40px;
    display: table-cell;
    vertical-align: middle;
}
.header-area .header-top .dc-top-wrap .dc-logo a img {width: 160px;}
.header-area .header-top .dc-top-wrap .header-btn .theme-btn,
.header-area .header-top .dc-top-wrap .header-btn .theme-btn:after {
    background-color: #0d277b;
}
.header-area .header-top .dc-top-wrap .header-btn .theme-btn:hover,
.header-area .header-top .dc-top-wrap .header-btn .theme-btn:hover:after {
    background-color: #ff7900;
}
.header-area .header-top .dc-top-wrap .dc-menu {
    height: 90px;
    position: relative;
}
.header-area .header-top .dc-top-wrap .dc-menu .mobile-menu-toggle {
    position: absolute;
    right: 15px;
    top: 0;
    color: #232323;
    font-size: 21px;
    cursor: pointer;
    width: 35px;
    height: 35px;
    background-color: rgba(35, 35, 35, 0.1);
    line-height: 37px;
    text-align: center;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    display: none;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.header-area .header-top .dc-top-wrap .dc-menu .mobile-menu-toggle:hover {
    background-color: #ff7607;
    color: #fff;
}
/*==== main-navigation =====*/
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-top: 16px;
    height: 90px;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li {
    display: inline-block;
    position: relative;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li:last-child a {
    margin-right: 0;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li:hover .dropdown-menu-item {
    opacity: 1;
    visibility: visible;
    top: 100%;
}
/*=== dropdown menu ===*/
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li .dropdown-menu-item {
    position: absolute;
    left: 0;
    top: 120%;
    min-width: 230px;
    background-color: #fff;
    -webkit-border-radius: 0 0 2px 2px;
    -moz-border-radius: 0 0 2px 2px;
    border-radius: 0 0 2px 2px;
    z-index: 3;
    -webkit-box-shadow: 0 20px 40px rgba(0,0,0,.10);
    -moz-box-shadow: 0 20px 40px rgba(0,0,0,.10);
    box-shadow: 0 20px 40px rgba(0,0,0,.10);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -ms-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    padding: 0 30px;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li .dropdown-menu-item li{
    padding-bottom: 16px;
    display: block;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li .dropdown-menu-item li:first-child {
    padding-top: 16px;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li .dropdown-menu-item li a{
    padding: 0 0;
    margin: 0;
    display: inline-block;
}
.header-area.fr-page .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li .dropdown-menu-item li a {font-size: 16px;}

.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li .dropdown-menu-item li a:after {
    bottom: -3px;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li.active> a {
    color: #424242;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li a {
    color: #333;
    font-family: serifa, serif;
    font-size: 18px;
    font-weight: 600;
    display: block;
    margin: 0 18px;
    line-height: 1.6;
    padding-bottom: 17px;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
    position: relative;
}
.header-area.fr-page .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li a {margin: 0 15px;}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li a:after {
    content: '';
    height: 1px;
    width: 0;
    background: #424242;
    position: absolute;
    bottom: 18px;
    right: 0;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li a:hover {
    color: #424242;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .main-navigation ul li a:hover:after {
    right: auto;
    left: 0;
    width: 100%;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .header-social {
    flex: 1;
    float: right;
    font-size: 16px;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .header-social ul li{
    margin-right: 28px;
    display: inline-block;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .header-social ul li:last-child {
    margin-right: 0;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .header-social ul li a i.fa-facebook {
    color: #182eb2;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .header-social ul li a i.fa-twitter {
    color: #31a5ff;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .header-social ul li a i.fa-youtube-play {
    color: #ff2e2e;
}
.header-area .header-top .dc-top-wrap .dc-menu .dc-menu-content .navigation-top .header-social ul li a i.fa-google-plus {
    color: #232323;
}

/*==== header-info ====*/
.header-area .header-info {
    margin-bottom: -62px;
    background-color: rgba(0,0,0,.20);
    position: relative;
    z-index: 2;
    border-bottom: 1px solid rgba(255,255,255,.30);
    height: 62px;
}
.header-area .header-info .header-info-inner {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 61px;
    font-size: 14px;
    line-height: 14px;
    letter-spacing: 1px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 500;
    margin-left: -2px;
    margin-right: -4px;
}
.header-area .header-info .header-info-inner .header-info-box {
    border-left: 1px solid rgba(255, 255, 255, 0.30);
    height: 60px;
    width: 33%;
    display: flex;
    align-items: center;
}
.header-area .header-info .header-info-inner .header-info-box.header-info-box-1 {
    border-left: none;
    text-align: left;
}
.header-area .header-info .header-info-inner .header-info-box.header-info-box-2 {
    text-align: center;
    justify-content: center;
}
.header-area .header-info .header-info-inner .header-info-box.header-info-box-3 {
    justify-content: flex-end;
}
.header-area .header-info .header-info-inner .header-info-box i {
    color: #ff7607;
    margin-right: 10px;
    font-size: 16px;
    margin-top: -3px;
}

/*==== mobile menu ===*/
.header-area .side-nav-container {
    position: fixed;
    top: 0;
    right: 0;
    width: 320px;
    height: 100%;
    background-color: #232323;
    overflow-x: hidden;
    z-index: 999;
    -webkit-transition: all 0.4s cubic-bezier(0.7, 0, 0.2, 1);
    -moz-transition: all 0.4s cubic-bezier(0.7, 0, 0.2, 1);
    -ms-transition: all 0.4s cubic-bezier(0.7, 0, 0.2, 1);
    -o-transition: all 0.4s cubic-bezier(0.7, 0, 0.2, 1);
    transition: all 0.4s cubic-bezier(0.7, 0, 0.2, 1);
    -webkit-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1);
    -moz-box-shadow: 0 0 40px rgba(82, 85, 90, 0.1);
    box-shadow: 0 0 40px rgba(82, 85, 90, 0.1);
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
}
.header-area .side-nav-container.active {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}
.header-area .side-nav-container .humburger-menu .humburger-menu-lines {
    display: inline-block;
    text-align: right;
    width: 22px;
    height: 22px;
    cursor: pointer;
    position: absolute;
    top: 25px;
    right: 18px;
    opacity: .5;
}
.header-area .side-nav-container .humburger-menu .humburger-menu-lines:before,
.header-area .side-nav-container .humburger-menu .humburger-menu-lines:after {
    position: absolute;
    content: '';
    height: 2px;
    width: 100%;
    top: 10px;
    left: 0;
    background-color: #fff;
    -webkit-transform: rotate(-43deg);
    -moz-transform: rotate(-43deg);
    -ms-transform: rotate(-43deg);
    -o-transform: rotate(-43deg);
    transform: rotate(-43deg);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.header-area .side-nav-container .humburger-menu .humburger-menu-lines:after {
    -webkit-transform: rotate(43deg);
    -moz-transform: rotate(43deg);
    -ms-transform: rotate(43deg);
    -o-transform: rotate(43deg);
    transform: rotate(43deg);
}
.header-area .side-nav-container .humburger-menu .humburger-menu-lines:hover:before,
.header-area .side-nav-container .humburger-menu .humburger-menu-lines:hover:after {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
}
.header-area .side-nav-container .side-menu-wrap {
    margin-top: 40px;
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item, .header-area .side-nav-container .side-menu-wrap .side-menu-ul .nav-item {
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item.active .menu-plus-icon:before {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item:hover > a {
    background-color: rgba(255, 255, 255, 0.12);
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item a, .header-area .side-nav-container .side-menu-wrap .side-menu-ul .nav-item a {
    font-size: 16px;
    color: #fff;
    display: block;
    text-transform: capitalize;
    font-weight: 700;
    font-family: serifa, serif;
    padding: 5px 15px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    position: relative;
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .menu-plus-icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 45px;
    line-height: 50px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .menu-plus-icon:hover {
    background-color: rgba(255, 255, 255, 0.1);
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .menu-plus-icon:before,
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .menu-plus-icon:after {
    position: absolute;
    top: 24px;
    right: 20px;
    content: '';
    width: 11px;
    height: 2px;
    background-color: #fff;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .menu-plus-icon:after {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .side-sub-menu {
    display: none;
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .side-sub-menu li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .side-sub-menu li:first-child {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .side-sub-menu li a {
    padding-left: 30px;
    padding-top: 9px;
    padding-bottom: 9px;
    color: rgba(255, 255, 255, 0.7);
}
.header-area .side-nav-container .side-menu-wrap .side-menu-ul .sidenav__item .side-sub-menu li a:hover {
    color: #ff7607;
}
/*=== side-social ===*/
.header-area .side-nav-container .side-menu-wrap .side-social {
    margin-top: 30px;
    text-align: center;
}
.header-area .side-nav-container .side-menu-wrap .side-social li {
    display: inline-block;
    padding-right: 12px;
}
.header-area .side-nav-container .side-menu-wrap .side-social li:last-child {
    padding-right: 0;
}
.header-area .side-nav-container .side-menu-wrap .side-social li a {
    font-size: 14px;
    background-color: #00b3b2;
    color: #fff;
    padding: 0 5px 0 12px;
    line-height: 42px;
    position: relative;
    z-index: 1;
    display: block;
    min-width: 35px;
}
.header-area .side-nav-container .side-menu-wrap .side-social li a:after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background-color: #00b3b2;
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: skew(-12deg,0deg);
    -moz-transform: skew(-12deg,0deg);
    -ms-transform: skew(-12deg,0deg);
    -o-transform: skew(-12deg,0deg);
    transform: skew(-12deg,0deg);
}
.header-area .side-nav-container .side-menu-wrap .side-social li:nth-child(2) a,
.header-area .side-nav-container .side-menu-wrap .side-social li:nth-child(2) a:after,
.header-area .side-nav-container .side-menu-wrap .side-btn .theme-btn,
.header-area .side-nav-container .side-menu-wrap .side-btn .theme-btn:after {
    background-color: #0d277b;
}
.header-area .side-nav-container .side-menu-wrap .side-social li:nth-child(3) a,
.header-area .side-nav-container .side-menu-wrap .side-social li:nth-child(3) a:after {
    background-color: #ff7900;
}
.header-area .side-nav-container .side-menu-wrap .side-social li:nth-child(4) a,
.header-area .side-nav-container .side-menu-wrap .side-social li:nth-child(4) a:after {
    background-color: #00b3b2;
}
.header-area .side-nav-container .side-menu-wrap .side-btn {
    text-align: center;
    margin-top: 40px;
}


.main-navigation.navbar {display: inline-block;}

.navigation-top .wpml-ls {
	display: inline-block;
	float: right;
	width: auto;
	border-left: 1px solid #efefef;
	padding-left: 10px;
}
.navigation-top .wpml-ls a {border: 0;}
.wpml-ls-legacy-dropdown-click a {padding: 12px 10px;}

.side-menu-wrap .wpml-ls {margin: 20px 20px 80px 20px;}

/*==== header tweaks ====*/
.side-menu-ul .dropdown-menu-item {margin-left: 20px;}
.side-menu-ul .menu-item-has-children > a {color: #888 !important;}
/*==== header-fixed ====*/
.header-fixed {
    background-color: #fff;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 999;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    -webkit-transition: 0.7s ease;
    -moz-transition: 0.7s ease;
    -ms-transition: 0.7s ease;
    -o-transition: 0.7s ease;
    transition: 0.7s ease;
}



/*===================================
    BREADCRUMB AREA
=====================================*/
.breadcrumb-area {
    background-color: #f2f0ec;
    position: relative;
    z-index: 1;
    color: #424242;
      background-position: 50% 50%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.breadcrumb-area .breadcrumb-content {
   text-align: center;
    position: relative;
    padding-top: 180px;
    padding-bottom: 130px;
}

.breadcrumb-area.bg-image-alt .breadcrumb-content {
	padding-top: 200px;
	padding-bottom: 130px;
}

.breadcrumb-area.bg-image-alt.project-header .breadcrumb-content {
	padding-top: 240px;
	padding-bottom: 160px;
}

.breadcrumb-area.less-header .breadcrumb-content {
	padding-top: 60px;
	padding-bottom: 50px;
}


.breadcrumb-area .breadcrumb-content .breadcrumb__title {
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 0;
    color: #424242;
    font-weight: 800;
}

.breadcrumb-area.bg-image .breadcrumb-content .breadcrumb__title {color: #fff}

.breadcrumb-area .breadcrumb-content .breadcrumb__list {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #000;
    padding: 0 30px 0 35px;
    line-height: 49px;
    -webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}


.breadcrumb-area .breadcrumb-content .breadcrumb__list li {
    font-size: 12px;
    letter-spacing: 1px;
    color: #fff;
    font-weight: 600;
    position: relative;
    padding-right: 22px;
    text-transform: uppercase;
    display: inline-block;
    line-height: 1.5;
}
.breadcrumb-area .breadcrumb-content .breadcrumb__list li:last-child {
    padding-right: 0;
}
.breadcrumb-area .breadcrumb-content .breadcrumb__list li.active__list-item:after {
    position: absolute;
    content: '/';
    top: 0;
    right: 0;
    padding: 0 6px;
    font-size: 15px;
}
.breadcrumb-area .breadcrumb-content .breadcrumb__list li a {
    color: #fff;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.breadcrumb-area .breadcrumb-content .breadcrumb__list li a:hover {
    color: #ff7900;
}

/*===================================
    ENTRY AREA
=====================================*/
.entry-area {
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
    z-index: 1;
    border-bottom: 2px solid #f2f0ec;
}
.entry-area:after {
    content: "";
    position: absolute;
    display: block;
    width: 733px;
    height: 100%;
    top: 0;
    left: -110px;
    z-index: -1;
    background-color: #424242;
    -webkit-transform: skew(-12deg,0deg);
    -moz-transform: skew(-12deg,0deg);
    -ms-transform: skew(-12deg,0deg);
    -o-transform: skew(-12deg,0deg);
    transform: skew(-12deg,0deg);
}
.entry-area .entry-static-wrap .entry-static-box1 {
    padding-top: 12px;
}
.entry-area .entry-static-wrap .entry-static-box .entry__title {
    color: #fff;
    font-size: 30px;
    line-height: 36px;
    font-weight: 800;
   padding-right: 50px;
}
.entry-area .entry-static-wrap .entry-static-box .entry-video-img {
    position: relative;
    margin-left: -15px;
    margin-right: -15px;
}
.entry-area .entry-static-wrap .entry-static-box .entry-video-img img {
    width: 100%;
}
.entry-area .entry-static-wrap .entry-static-box .entry-video-img .video-play-btn {
    font-size: 13px;
    background: #ff7900;
    color: #fff;
    font-weight: 600;
    width: 45px;
    height: 54px;
    line-height: 54px;
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    padding-left: 5px;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: inline-block;
    -webkit-transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    -o-transition: 0.3s ease-in;
    transition: 0.3s ease-in;
}
.entry-area .entry-static-wrap .entry-static-box .entry-video-img .video-play-btn:after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background: #ff7900;
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: skew(-12deg,0deg);
    -moz-transform: skew(-12deg,0deg);
    -ms-transform: skew(-12deg,0deg);
    -o-transform: skew(-12deg,0deg);
    transform: skew(-12deg,0deg);
    -webkit-transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    -o-transition: 0.3s ease-in;
    transition: 0.3s ease-in;
}
.entry-area .entry-static-wrap .entry-static-box .entry-video-img .video-play-btn:hover,
.entry-area .entry-static-wrap .entry-static-box .entry-video-img .video-play-btn:hover:after {
    background-color: #0d277b;
}

/*=== entry-static-box2 ===*/
.entry-area .entry-static-wrap .entry-static-box2 {
    padding-left: 85px;
}
.entry-area .entry-static-wrap .entry-static-box .entry-video-text {
    padding-left: 42px;
    padding-top: 14px;
}
.entry-area .entry-static-wrap .entry-static-box .entry-video-text .entry__title {
    color: #424242;
    padding-right: 0;
    font-weight: 400;
    margin-bottom: 15px;
}



.location-block {background: #ddd; padding: 80px;}




/*===================================
   Header 
=====================================*/

.dc-heder-wrap {
	position: relative;
	min-height: 70vh; 
	background: url(//www.danonecommunities.com/wp-content/uploads/2020/03/SANDRO-014-SDCD4115-1920x600.jpg);
	background-position: 0% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;}
.dc-heder-wrap .section-heading {padding: 140px 0 60px 0; position: relative;}

.dc-heder-wrap .section__title {margin-bottom: 20px; font-size: 65px; font-weight: 500; line-height: 1;}
.dc-heder-wrap .section__title span {font-weight: 800;}

.dc-heder-wrap:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.30);
}



/*===========   service area  =================*/
.service-area {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    padding-top: 60px;
    padding-bottom: 40px;
}


.service-area .service-wrap {
    margin-top: 52px;
}

.service-area .service-wrap .service-item .service-item-inner {display: block;}
.service-area .service-wrap .service-item .service-item-inner:hover .service__title {color: #00b3b2;}
.service-area .service-wrap .service-item .service-item-inner .service-icon {
    display: inline-block;
    padding: 12px 15px;
    position: relative;
    margin-bottom: 27px;
    z-index: 1;
}
.service-area .service-wrap .service-item .service-item-inner .service-icon img {
    height: 75px;
    
}

.service-area .service-wrap .service-item .service-item-inner .service-content {
    padding-right: 35px;
    padding-left: 35px;
}
.service-area .service-wrap .service-item .service-item-inner .service-content .service__title {
    font-size: 20px;
    line-height: 20px;
    font-weight: 800;
    margin-bottom: 23px;
}
.service-area .service-wrap .service-item .service-item-inner .service-content .service__desc {
    line-height: 29px;
}
.service-area .button-shared .theme-btn,
.service-area .button-shared .theme-btn:after {
    background-color: #ff7900;
}
.service-area .button-shared .theme-btn:hover,
.service-area .button-shared .theme-btn:hover:after {
    background-color: #0d277b;
}

.banner img {max-width: 100%;}
.banner a:hover img {opacity: .9;}

/*========== world map ===============*/


.world-map {
	position: relative;
	height: 820px;
	background-position: 50% 50%;
	background-size: cover;
}



.dot-country {position: absolute; width: 20px; height: 20px; background: #00b3b2; 
	  	  -webkit-border-radius: 50%;
          border-radius: 50%;
		  -webkit-animation: 1.5s infinite play-dotPulse;
          animation: 1.5s infinite play-dotPulse;
          transform: scale(1);
    -webkit-transform: scale(1);
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
    cursor: pointer;
    border: 2px solid #fff;
}

.dot-country:hover {
	transform: scale(1.8);
    -webkit-transform: scale(1.8);
    transition: 0.5s all ease;
    -webkit-transition: 0.5s all ease;
}
.dot-country.dot-nutrition {background: #ff7900;}

.popover-body h2 {font-weight: 600; margin-bottom: 0px; font-size: 22px;}
.popover-body p {margin-bottom: 5px;}
.popover-body p span {font-weight: 800;}
.popover-body a {font-weight: 600; font-family: serifa, serif;}
.close-popover {cursor: pointer;}

@-webkit-keyframes play-fotPulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255,255,255,.7);
            box-shadow: 0 0 0 0 rgba(255,255,255,.7)
  }
  100% {
    -webkit-box-shadow: 0 0 0 2em rgba(255,255,255,0);
            box-shadow: 0 0 0 2em rgba(255,255,255,0)
  }
}
@keyframes play-dotPulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255,255,255,.7);
            box-shadow: 0 0 0 0 rgba(255,255,255,.7)
  }
  100% {
    -webkit-box-shadow: 0 0 0 2em rgba(255,255,255,0);
            box-shadow: 0 0 0 2em rgba(255,255,255,0)
  }
}

.dot-life1 {left: 47%; top: 61.2%;}
.dot-life2 {left: 25.8%; top: 77%;}
.dot-life3 {left: 56%; top: 74.5%;}
.dot-life4 {left: 68.5%; top: 52%;}
.dot-life5 {left: 22%; top: 56%;}
.dot-life6 {left: 27%; top: 54.5%;}
.dot-nazava {left: 78%; top: 70%;}
.dot-nazava2 {left: 56.3%; top: 69%;}
.dot-ecoalberto {left: 17.3%; top: 49%;}
.dot-dlohaiti { left: 26.2%; top: 54%;}
.dot-oshun {left: 42.3%; top: 56.5%;}
.dot-berger {left: 42.2%; top: 58.5%;}
.dot-malin {left: 47%; top: 30%;}
.dot-impact {left: 48.5%; top: 61%;}
.dot-jibu1 {left: 53%; top: 70%;}
.dot-jibu2 {left: 55%; top: 67%;}
.dot-jibu3 {left: 56.6%; top: 67.5%;}
.dot-jibu4 {left: 55%; top: 68%;}
.dot-jibu5 {left: 51%; top: 69.5%;}
.dot-jibu6 {left: 54.5%; top: 70%;}
.dot-jibu7 {left: 54.5%; top: 81%;}
.dot-jibu8 {left: 55%; top: 67%;}
.dot-fontaines1 {left: 75.5%; bottom: 40%;}
.dot-fontaines3 {left: 74.8%; bottom: 38%;}
.dot-drinkwell {left: 68%; top: 54%;}
.dot-drinkwell2 {left: 71%; top: 48.2%;}
.dot-garmeen {left: 71.1%; top: 49.8%;}
.dot-nutrigo {left: 74.4%; top: 40.4%;}
.dot-naandi {left: 68%; top: 50%;}
.dot-untapped1 {left: 57%; top: 66%;}

@media screen and (max-width: 1600px) {
	
	.world-map {height: 730px; }
	.dot-country {width: 18px; height: 18px; }
}

@media screen and (max-width: 1440px) {
	
	.world-map {height: 650px;}
	.dot-country {width: 16px; height: 16px; }
	
}

@media screen and (max-width: 1380px) {
	.world-map { height: 600px;}
}

@media screen and (max-width: 1240px) {
	.world-map { height: 545px;}
}

.mobile-map {display: none;}
.mobile-map img {max-width: 100%;}




.impact-numbers-wrap {background: #00b3b2; padding: 80px 0; color: #fff;}
.impact-numbers {max-width: 850px; text-align: center; margin: 0 auto;}
.impact-numbers h2 {font-family: serifa, serif; font-size: 50px; font-weight: 600; color: #fff;}
.impact-numbers p {font-family: serifa, serif; font-size: 22px; margin-bottom: 20px; color: #222;}

@media (max-width: 767.98px) {
  
  .impact-numbers h2 {font-size: 36px;}
  
  }

/*========== stories ===============*/

.doc-stories {margin: 0 auto; max-width: 700px;}
.doc-story {margin-bottom: 60px; display: block; position: relative;} 
.doc-story img {max-width: 100%;}
.doc-story h2 {background: #ff7900; position: absolute; top: -10px; left: -15px; padding: 10px; color: #fff; font-weight: 700; display: inline-block;
  transform: scale(1);
  -webkit-transform: scale(1);
  transition: 0.5s all ease;
  -webkit-transition: 0.5s all ease;
}
.doc-story h2.blue {background: #00b3b2;}

.doc-story:hover img {opacity: .8;}
.doc-story:hover h2 {    transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transition: 0.5s all ease;
  -webkit-transition: 0.5s all ease;}
  
  @media (max-width: 767.98px) {
    
    .doc-story h2 { top: 10px; left: 10px; font-size: 28px;}
    
    }

/*========== Front video area ==============*/
.video-area {
    position: relative;
    z-index: 1; 
    background-image: url("//www.danonecommunities.com/wp-content/uploads/2020/03/Copie-de-SANDRO-026-DSC00071-1920x600.jpg");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 80px;
    padding-bottom: 50px;
}
.video-area:after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.30);
    z-index: -1;
}
.video-area .mixer-heading .section__title {
    font-size: 70px;
    line-height: 84px;
    margin-bottom: 48px;
    font-weight: 800;
}

.videoalt-play-btn {position: absolute; right: 20%; bottom: 24%;}

.videoalt-play-btn {
  display: inline-block;
  width: 120px;
  height: 120px;
  padding: 5px;
  border: 4px solid rgba(255,255,255,.66);
  -webkit-border-radius: 50%;
          border-radius: 50%;
  text-align: center
}
.videoalt-play-btn span {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #00b3b2;
  -webkit-border-radius: inherit;
          border-radius: inherit;
  -webkit-animation: 1.5s infinite play-btnPulse;
          animation: 1.5s infinite play-btnPulse
}
@-webkit-keyframes play-btnPulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255,255,255,.7);
            box-shadow: 0 0 0 0 rgba(255,255,255,.7)
  }
  100% {
    -webkit-box-shadow: 0 0 0 2em rgba(255,255,255,0);
            box-shadow: 0 0 0 2em rgba(255,255,255,0)
  }
}
@keyframes play-btnPulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255,255,255,.7);
            box-shadow: 0 0 0 0 rgba(255,255,255,.7)
  }
  100% {
    -webkit-box-shadow: 0 0 0 2em rgba(255,255,255,0);
            box-shadow: 0 0 0 2em rgba(255,255,255,0)
  }
}
.videoalt-play-btn span:before {
  content: "";
  position: absolute;
  top: 0;
  left: 5px;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 14px 0 14px 20px;
  border-color: transparent transparent transparent #fff;
}


/*========    basics.  ==============*/

blockquote {
  position: relative;
  padding-left: 20px;
  font-weight: 400;
  font-family: serifa, serif;
  color: #00b3b2;
  padding: 1em;
  margin: .5em 0 .5rem 2rem;
  font-size: 20px;
}
.content-inner blockquote p {color: #00b3b2;}
blockquote:before {
  content: "“";
  font-family: serif;
  position: absolute;
  right: 100%;
  font-size: 80px;
  line-height: 0px;
  top: 50px;
  color: #222;
}

.story-wrap .content-inner p {font-size: 1rem;}
.story-wrap blockquote, .story-wrap blockquote p {font-size: 1.5rem;}
.story-wrap .content-inner blockquote p {color: #00b3b2; margin: 0; font-size: 1.2rem; line-height: 1.3;}


.content-inner h2 {font-weight: 600; font-size: 50px;}
.content-inner h3 {font-weight: 600; font-size: 36px; margin: 35px 0 5px;}
.content-inner h4 {font-weight: 600; margin: 30px 0 5px;}

.content-inner ul {list-style: disc; margin: 10px 0 20px 40px; }
.content-inner ul li {padding: 2px 0; font-size: 17px; line-height: 26px; color: #333;}

.content-inner .highlighted {background: #efefef; padding: 20px; font-size: 22px; font-family: serifa, serif;}
.content-inner .highlighted.same-size {min-height: 215px;}


.our-team-block {max-width: 700px; border-bottom: 3px solid #efefef; padding-bottom: 20px; margin:0 auto 30px; }
.our-team-block .wp-block-column {position: relative;}
.our-team-block .wp-block-column h3 {margin: 0; font-size: 28px;}
.our-team-block .wp-block-column p {margin: 0; font-family: serifa, serif; font-size: 20px; font-weight: 600;}
.our-team-block a i {position: absolute; right: 0; bottom: 4px; padding: 5px; background: #0e76a8; color: #fff;}
.our-team-block a:hover {opacity: .8;}
.cta-link a {font-family: serifa, serif; font-size: 30px; font-weight: 600;}
.cta-link.aqua-block a {color: #00b3b2;}
.cta-link.aqua-block a:hover {color: #0056b3;}

.foura-img img {max-width: 70%;}


/*===================================
    ABOUT AREA
=====================================*/
.about-area {
    padding-top: 120px;
    padding-bottom: 120px;
}
.about-area .about-large-img {
    margin-bottom: 60px;
}
.about-area .about-large-img img,
.about-area .about-semi-img img {
    width: 100%;
}
.about-area .about-heading {
    padding-left: 30px;
}
.about-area .about-heading .section-heading .section__desc {
    line-height: 30px;
    margin-top: 45px;
}



/*========    Timeline.  ============*/


.story-wrap {margin: 0 auto; max-width: 800px;}


/*==========  Stem  ==========*/
/*.stem-wrapper {
  position: fixed;
  top: 0px;
  bottom: 0px;
  left: 50%;
}
*/
.story-wrap .stem-header {position: relative; margin: 0 0 20px 0; padding: 40px 0 60px; z-index: 9999; background: #fff;}
.story-wrap .stem-header p {
	font-size: 20px;
    margin-bottom: 20px;
    line-height: 1.6;}

.stem-wrapper.color-orange .stem-background {
  background: #efefef;
}
.stem-wrapper.color-green .stem-background {
  background: #efefef;
}

.stem-wrapper .stem,
.stem-wrapper .stem-background {
  position: absolute;
  top: 0px;
  width: 8px;
  left: 82px;
}
.stem-wrapper .stem {
  background: #efefef;
  height: 100%;
}
.stem-wrapper .stem-background {
  background: #efefef;
  height: 50%;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}

.entry-content ol {margin: 10px 0px 0px 40px;}
.entry-content ol li {font-size: 18px; margin-bottom: 10px;}
/*==========  Post wrapper ==========*/


.story-wrap .post-wrapper:before,
.story-wrap .post-wrapper:after {
  content: "";
  display: table;
}
.story-wrap .post-wrapper:after {
  clear: both;
}
.story-wrap .post-wrapper .post {
  position: relative;
  width: 432px;
  padding: 0px 0px 60px 0px;
  clear: both;
  opacity: 1;
  -webkit-perspective: 1000px;
  perspective: 1000px;
}
.story-wrap .post-wrapper .post.hidden .post-content {
  -webkit-transform: translateY(100px) rotateX(30deg);
  transform: translateY(100px) rotateX(30deg);
  opacity: 0;
}
.story-wrap .post-wrapper .post:hover .post-content,
.story-wrap .post-wrapper .post.active .post-content {
  opacity: 1;
}
.story-wrap .post-wrapper .post:hover .post-content .meta,
.story-wrap .post-wrapper .post.active .post-content .meta {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}

.story-wrap .post-wrapper .post .stem-dot {content: ""; width: 20px; height: 20px; border-radius: 50%; background: #333; position: absolute; left: -34px}

/*.story-wrap .post-wrapper .post:nth-child(even) .stem-dot {
  left: -74px;
}
.story-wrap .post-wrapper .post:nth-child(odd) .stem-dot {
  right: -82px;
}
*/
.story-wrap .post-wrapper .post .post-content {
  opacity: 0.3;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  -webkit-transform: none;
  transform: none;
}

.story-wrap .post-wrapper .post .post-content img {max-width: 100%; margin-bottom: 20px;}

.story-wrap .post-wrapper .post .post-content .meta {
  font-size: 20px;
  font-weight: 800;
  color: #00b3b2;
  margin: 0px 0px 5px 0px;
  letter-spacing: 1px;
  opacity: 0;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}
.story-wrap .post-wrapper .post .post-content .post-title {
  font-size: 28px;
  line-height: 1.4;
  margin: 0px 0px 15px 0px;
}

.story-wrap {
    max-width: 880px;
    position: relative;
  }
  .stem-wrapper {
    left: 80px;
  }
  .stem-padding {
    margin: 0px;
    float: left;
    margin-left: 50px;
  }
  .story-wrap .post-wrapper .post,
  .story-wrap .post-wrapper .post:nth-child(even),
  .story-wrap .post-wrapper .post:nth-child(odd) {
    width: auto;
    margin-left: 110px;
    float: none;
  }
  .story-wrap .post-wrapper .post .stem-overlay,
  .story-wrap .post-wrapper .post:nth-child(even) .stem-overlay,
  .story-wrap .post-wrapper .post:nth-child(odd) .stem-overlay {
    left: -60px;
    right: auto;
  }
  .story-wrap .post-wrapper .post .post-content {
    padding: 0px 50px;
  }
  
  
/*==========  Media queries  ==========*/
@media only screen and (max-width: 1080px) {
  .story-wrap {
    max-width: none;
  }
  .stem-wrapper {
    left: 80px;
  }
  .stem-padding {
    margin: 0px;
    float: left;
    margin-left: 50px;
  }
  .story-wrap .post-wrapper .post,
  .story-wrap .post-wrapper .post:nth-child(even),
  .story-wrap .post-wrapper .post:nth-child(odd) {
    width: auto;
    margin-left: 110px;
    float: none;
  }
  .story-wrap .post-wrapper .post .stem-overlay,
  .story-wrap .post-wrapper .post:nth-child(even) .stem-overlay,
  .story-wrap .post-wrapper .post:nth-child(odd) .stem-overlay {
    left: -60px;
    right: auto;
  }
  .story-wrap .post-wrapper .post .post-content {
    padding: 0px 50px;
  }
}
@media only screen and (max-width: 700px) {
  
  .story-wrap .post-wrapper .post {
    margin-left: 30px !important;
  }
  .story-wrap .post-wrapper .post .post-content {
    padding: 0 25px;
  }
  .stem-wrapper {
    left: 20px;
  }
  .stem-wrapper .stem, .stem-wrapper .stem-background {left: 22px;}
 
}



/*==========    QA area  =============*/
.faq-area {
    padding-top: 120px;
    padding-bottom: 120px;
    background-color: #f2f0ec;
}
.faq-area .faq-img-box {
    margin-right: 30px;
    margin-top: 50px;
}
.faq-area .faq-img-box img {
    width: 100%;
}
/*=== single-accordion ===*/
.single__accordion {
    margin: -10px 0 30px 0;
}
 .single__accordion .accordion-panel .accordion__title {
    margin-top: 10px;
}
 .single__accordion .accordion-panel .accordion__title .accordion__title-text {
    color: #fff;
    width: 100%;
    margin: 0;
    cursor: pointer;
    padding: 5px 40px 5px 10px;
    display: block;
    color: #222;
    font-weight: 600;
    font-size: 22px;
    border-bottom: 1px solid #efefef;
    border-left: 3px solid #ff7900;
    position: relative;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
 .single__accordion .accordion-panel .accordion__title .accordion__title-text:before,
 .single__accordion .accordion-panel .accordion__title .accordion__title-text:after {
    position: absolute;
    content: '';
    top: 50%;
    right: 39px;
    width: 2px;
    height: 10px;
    background-color: #232323;
    z-index: 1;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.single__accordion .accordion-panel.active .accordion__title .accordion__title-text {
    background-color: #ff7900;
    color: #fff;
}
 .single__accordion .accordion-panel .accordion__title .accordion__title-text:after,
 .single__accordion .accordion-panel.active .accordion__title .accordion__title-text:before {
    -webkit-transform: rotate(90deg);
    -moz-transform: translateY(-50%) rotate(90deg);
    -ms-transform:translateY(-50%)  rotate(90deg);
    -o-transform: translateY(-50%) rotate(90deg);
    transform: translateY(-50%) rotate(90deg);
}
.single__accordion .accordion-panel.active .accordion__title .accordion__title-text:before {
    background-color: #fff;
    z-index: 2;
}
 .single__accordion .accordion-panel .accordion__content {
    padding: 30px 20px 25px 35px;
    display: none;
}
 .single__accordion .accordion-panel .accordion__content .accordion__content-desc {
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
}

/*===================================
    CAUSES AREA
=====================================*/
.causes-area {
    padding-top: 120px;
    padding-bottom: 90px;
}
.causes-area .blog-content-wrap {
    margin-top: 51px;
}
.causes-area .blog-content-wrap .blog-content .blog-item {
    margin-bottom: 30px;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-img {
    position: relative;
    display: block;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-img .blog__tag {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 11px;
    text-transform: uppercase;
    background-color: #00b3b2;
    color: #fff;
    font-weight: 800;
    letter-spacing: 1px;
    padding: 0 12px 0 14px;
    line-height: 40px;
    z-index: 1;
}

.causes-area .blog-content-wrap .blog-content .blog-item.nutrition .blog-img .blog__tag, .causes-area .blog-content-wrap .blog-content .blog-item.nutrition-fr .blog-img .blog__tag, .causes-area .blog-content-wrap .blog-content .blog-item.ernahrung .blog-img .blog__tag { background: #ff7900; }


.causes-area .blog-content-wrap .blog-content .blog-item img {
    width: 100%;
    height: auto;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content {
    padding: 44px 45px 50px 50px;
    background-color: #f2f0ec;
}
.causes-area .blog-content-wrap .blog-content .blog-item.water .blog-inner-content .blog-inner-title-wrap {min-height: 140px;}
.causes-area .blog-content-wrap .blog-content .blog-item.eau .blog-inner-content .blog-inner-title-wrap {min-height: 160px;}
.causes-area .blog-content-wrap .blog-content .blog-item.wasser .blog-inner-content .blog-inner-title-wrap {min-height: 160px;}
.causes-area .blog-content-wrap .blog-content .blog-item.nutrition .blog-inner-content .blog-inner-title-wrap, .causes-area .blog-content-wrap .blog-content .blog-item.nutrition-fr .blog-inner-content .blog-inner-title-wrap, .causes-area .blog-content-wrap .blog-content .blog-item.ernahrung .blog-inner-content .blog-inner-title-wrap {min-height: 180px;}

.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__title {
   font-size: 26px;
    font-weight: 900;
    margin-bottom: 10px;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__title a {
    color: #424242;
    -webkit-transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    -o-transition: 0.3s ease-in;
    transition: 0.3s ease-in;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__title a:hover {
    color: #ff7900;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content p {
    line-height: 29px;
    margin-bottom: 10px;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__list {
   margin-top: 0px;
    margin-bottom: 22px;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__list li {
    margin-bottom: 15px;
    font-size: 14px;
    font-weight: 600;
    color: #424242;
    position: relative;
    padding-left: 37px;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__list li i {
   font-size: 25px;
    color: #424242;
    top: 2px;
    left: 0;
    position: absolute;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__list li i.fa-line-chart {
    font-size: 20px;
}
.causes-area .blog-content-wrap .blog-content .blog-item .blog-inner-content .blog__list li span {
    color: #00b3b2;
}

.causes-area .blog-content-wrap .blog-content .blog-item1 .blog-inner-content .theme-btn,
.causes-area .blog-content-wrap .blog-content .blog-item1 .blog-inner-content .theme-btn:after,
.causes-area .blog-content-wrap .blog-content .blog-item1 .barfiller .fill:after,
.causes-area .blog-content-wrap .blog-content .blog-item1 .barfiller .tip,
.causes-area .blog-content-wrap .blog-content .blog-item1 .barfiller .tip:before {
    background-color: #00b3b2;
}
.causes-area .blog-content-wrap .blog-content .blog-item1 .barfiller .tip:after {
    border-top-color: #00b3b2;
}

.causes-area .blog-content-wrap .blog-content .blog-item2 .blog-inner-content .theme-btn,
.causes-area .blog-content-wrap .blog-content .blog-item2 .blog-inner-content .theme-btn:after,
.causes-area .blog-content-wrap .blog-content .blog-item2 .barfiller .fill:after,
.causes-area .blog-content-wrap .blog-content .blog-item2 .barfiller .tip,
.causes-area .blog-content-wrap .blog-content .blog-item2 .barfiller .tip:before {
    background-color: #0d277b;
}
.causes-area .blog-content-wrap .blog-content .blog-item2 .barfiller .tip:after {
    border-top-color: #0d277b;
}
.causes-area .blog-content-wrap .blog-content .blog-item4 .blog-inner-content .theme-btn,
.causes-area .blog-content-wrap .blog-content .blog-item4 .blog-inner-content .theme-btn:after,
.causes-area .blog-content-wrap .blog-content .blog-item4 .barfiller .fill:after,
.causes-area .blog-content-wrap .blog-content .blog-item4 .barfiller .tip,
.causes-area .blog-content-wrap .blog-content .blog-item4 .barfiller .tip:before {
    background-color: #00b3b2;
}
.causes-area .blog-content-wrap .blog-content .blog-item4 .barfiller .tip:after {
    border-top-color: #00b3b2;
}
.causes-area .blog-content-wrap .blog-content .blog-item1 .blog-inner-content .theme-btn:hover,
.causes-area .blog-content-wrap .blog-content .blog-item1 .blog-inner-content .theme-btn:hover:after,
.causes-area .blog-content-wrap .blog-content .blog-item2 .blog-inner-content .theme-btn:hover,
.causes-area .blog-content-wrap .blog-content .blog-item2 .blog-inner-content .theme-btn:hover:after,
.causes-area .blog-content-wrap .blog-content .blog-item3 .blog-inner-content .theme-btn:hover,
.causes-area .blog-content-wrap .blog-content .blog-item3 .blog-inner-content .theme-btn:hover:after,
.causes-area .blog-content-wrap .blog-content .blog-item4 .blog-inner-content .theme-btn:hover,
.causes-area .blog-content-wrap .blog-content .blog-item4 .blog-inner-content .theme-btn:hover:after{
    background-color: #424242;
}

.causes-area .blog-content-wrap .blog-content .blog-item1 .blog-inner-content .blog__title a:hover {
    color: #00b3b2;
}
.causes-area .blog-content-wrap .blog-content .blog-item2 .blog-inner-content .blog__title a:hover {
    color: #0d277b;
}
/*=============================
   CAUSES AREA 2
 =============================*/
.causes-area2 .blog-content-wrap {
    margin-top: 0;
}
/*=============================
   Main content AREA
 =============================*/
 
.content-detail-area {padding: 80px 0;}
.content-detail-area.no-padding {padding: 0;}

.project-basics {padding: 60px 0px; margin: 0 auto; max-width: 1200px;}
.project-basics .business-logo {width: 150px; float: right; margin: 0 0 20px 20px;} 
.project-text p {margin-bottom: 20px;}
.project-text p.intro {font-weight: 600; font-size: 140%; font-family: serifa, serif; line-height: 1.4;}
.project-text ul {list-style: disc; margin: 0 0 20px 20px;}

.country-info h2 {font-size: 50px; font-weight: 600; margin-bottom: 10px;}
.country-info ul {margin-bottom: 30px;}
.country-info ul li {font-family: serifa, serif; border-bottom: 1px solid #efefef; padding: 2px 0;}
.country-info ul li strong {color: #ff7900; font-weight: 500; font-size: 120%;}
.category-water .country-info ul li strong, .category-eau .country-info ul li strong, .category-wasser .country-info ul li strong {color: #00b3b2;}
.country-map img {max-width: 80%;}

.project-intro .country-info ul li {font-size: 24px; line-height: 1.3; padding: 4px 0; font-weight: 500;}

.content-inner h2.section-title {font-size: 40px; font-weight: 600; margin-bottom: 20px;}
.content-inner p {font-size: 20px; margin-bottom: 20px; color: #333; line-height: 1.6}
.content-inner p.nutrition-bold strong {font-size: 110%; font-family: serifa; color: #ff7900;
}

.infographics-split {width: 140%; margin-top: 50px; margin-left: -20%; position: relative;}
.infographics-split .wp-block-column {position: relative;}
.infographics-split .wp-block-column .wp-block-image {padding: 40px;}
.infographics-split .wp-block-column .wp-block-image:after {
    content: "+";
    font-size: 60px;
    position: absolute;
    left: 100%;
    top: 50%;
}
.infographics-split .wp-block-column:last-of-type .wp-block-image:after {display: none;}

/* colored title  */
.colored-section-title {text-align: center; font-size: 54px; margin: 80px 0 20px;}

hr.wp-block-separator {border-bottom: 2px solid #efefef; margin: 60px 0 40px;}
/* block icons */

.block-icons {text-align: center; margin-bottom: 40px;}
.block-icons.mission-icons {margin: 40px auto 20px; max-width: 800px;}
.block-icons.mission-icons h4 {margin-bottom: 15px;}
.block-icons.mission-icons img {width: 150px;}

.block-icons img {width: 120px;}

.block-icons .wp-block-image {position: relative; display: block;}
.block-icons .wp-block-image:after {
	content: "+"; 
	font-size: 60px;
    position: absolute;
    left: 100%;
    top: 50%;}
 
.block-icons .wp-block-image.img-va {padding: 45px 0 15px;}
    
.block-icons .wp-block-column:last-of-type .wp-block-image:after {display: none;}
.block-icons .wp-block-column ul {margin-top: -10px;}
.block-icons .wp-block-column ul li {font-size: 14px; line-height: 1.2;}


.block-icons .wp-block-column p {padding: 0 20px; font-size: 15px;}
.block-icons h4 {font-size: 1.1rem; font-weight: 600;}
.aqua-block h4 {color: #00b3b2;}
.aqua-block {color: #00b3b2;}

.orange-block h4 {color: #ff7900;}
.orange-block {color: #ff7900;}


/* images */
.wp-block-image.map-image {margin-bottom: 0;}
.quote-img.quote-bigger-img img {margin-top: 20px; width: auto; height: auto; padding: 10px; border: 3px solid #ff7900;}


.wp-block-embed {margin: 20px 0;}

.project-quote {padding: 40px; margin: 60px -80px; background: #ff7900; color: #fff;}
.project-quote.m0 {margin: 0;}
.category-water .project-quote, .category-eau .project-quote, .category-wasser .project-quote {background: #00b3b2;}

.project-quote.side-quote {margin: 0; padding: 20px;}

.quote-img {border-radius: 50%; margin-bottom: 10px;}
.quote-img img {max-width: 100%; border-radius: 50%; border: 2px solid #fff; padding: 10px; width: 240px; height: 240px;}
.icon-quote {    font-size: 150px;
    line-height: 1;
    display: inline-block;
    float: left;
    margin-bottom: 40px;
    line-height: .8;
    position: relative;
    height: 30px;
    margin: 0 10px 0px 0;}
    
.quote-person h2 {color: #fff; margin-bottom: 4px;}

.project-quote {font-family: serifa, serif; color: #fff;}
.project-quote p {color: #fff; font-size: 20px; font-weight: 500; margin-bottom: 20px;}
.project-quote p.bigger-text {font-size: 22px; line-height: 1.3; padding-top: 30px;}
.project-quote p.bigger-text ~ p.bigger-text {padding-top: 10px;}

.project-logo {width: 150px; float: left; margin: 0 20px 0 0;}
.project-intro {margin: 0 0 30px 0; font-family: serifa, serif; font-weight: 600;}
.box-project-location {font-size: 44px; color: #ff7900;}
.box-project-excerpt {font-size: 24px; line-height: 1.4;}

.project-numbers {margin: 40px 0 20px; border-top: 1px dashed #aaa;}
.number-wrap {text-align: center; font-family: serifa, serif; width: 32%; display: inline-block; vertical-align: top; margin-bottom: 30px;}
.project-numbers {text-align: center;}
.project-numbers h3 {font-size: 56px; line-height: 1; font-weight: 400; margin: 20px 0; color: #ff7900;}
.project-numbers p {line-height: 1.2;}

.category-water .project-numbers h3, .category-eau .project-numbers h3, .category-wasser .project-numbers h3 {color: #00b3b2;}


.project-bottom {margin: 80px 0;}

.project-numbers.side-numbers {margin: 10px 0 30px 0;}
.project-numbers.side-numbers .number-wrap {margin-bottom: 30px; text-align: left;}
.project-numbers.side-numbers .number-wrap p {font-size: 20px;}

.video-play-btn, .playvideo {display: inline-block; line-height: 50px; font-family: serifa, serif; font-size: 24px; font-weight: 600; color: #ff7900;}
.category-water .video-play-btn, .category-water .playvideo, .category-eau .video-play-btn, .category-eau .playvideo, .category-wasser .video-play-btn, .category-wasser .playvideo { color: #0d277b; }
.video-play-btn i, .playvideo i {background: #ff7900; padding: 22px 25px; color: #fff; font-size: 20px; border-radius: 50%; margin-right: 10px;}
.category-water .video-play-btn i, .category-water .playvideo i, .category-eau .video-play-btn i, .category-eau .playvideo i, .category-wasser .video-play-btn i, .category-wasser .playvideo i { background-color: #00b3b2; }

.blocks-gallery-caption {font-family: serifa, serif; font-weight: 600;}

.prevnext-links {margin: 50px 0 80px; font-size: 20px;}
.prevnext-links h4 {font-weight: 600; font-size: 22px; margin-bottom: 5px;}
.prevnext-links a {font-size: 30px; font-family: serifa, serif; font-weight: 600;}

/*=============================
   CTA AREA
=============================*/
.cta-area {
    padding-top: 55px;
    padding-bottom: 60px;
    background-color: #00b3b2;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.cta-area:after {
    content: "";
    position: absolute;
    display: block;
    width: 51%;
    height: 100%;
    top: 0;
    right: 0;
    z-index: -1;
    background-color: #00b3b2;
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: skew(-12deg,0deg);
    -moz-transform: skew(-12deg,0deg);
    -ms-transform: skew(-12deg,0deg);
    -o-transform: skew(-12deg,0deg);
    transform: skew(-12deg,0deg);
}
.cta-area .cta-item .cta__title {
    font-size: 30px;
    color: #fff;
    font-weight: 800;
    margin-bottom: 30px;
    line-height: 34px;
}
/*=============================
   CTA AREA 2
=============================*/
.cta-area2 {
    padding-top: 110px;
    padding-bottom: 120px;
    background-color: #ff7900;
    position: relative;
    z-index: 1;
    overflow: inherit;
}
.cta-area2:after {
    content: "";
    position: absolute;
    display: block;
    width: 412px;
    height: 358px;
    top: 50%;
    left: 50%;
    z-index: -1;
    background-color: transparent;
    -webkit-transform-origin: inherit;
    transform-origin: inherit;
    -webkit-transform: skew(0deg,0deg) translate(-50%, -50%);
    -moz-transform: skew(0deg,0deg) translate(-50%, -50%);
    -ms-transform: skew(0deg,0deg) translate(-50%, -50%);
    -o-transform: skew(0deg,0deg) translate(-50%, -50%);
    transform: skew(0deg,0deg) translate(-50%, -50%);
    background-image: url("../images/volunteer-icon.png");
    background-size: cover;
    background-position: center;
}
.cta-area2 .cta-item .cta__title {
    font-size: 70px;
    line-height: 70px;
    margin-bottom: 18px;
}
.cta-area2 .cta-item .cta__desc {
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 52px;
    letter-spacing: 0.1px;
}
.cta-area2 .cta-item .theme-btn,
.cta-area2 .cta-item .theme-btn:after {
    background-color: #424242;
}
.cta-area2 .cta-item .theme-btn:hover,
.cta-area2 .cta-item .theme-btn:hover:after {
    background-color: #0d277b;
}
/*=============================
   contact-area
 =============================*/
.contact-area {
    padding-top: 120px;
    padding-bottom: 120px;
}
.contact-area .section__desc {
    line-height: 30px;
    margin-top: 43px;
    padding-right: 30px;
}




.contact-area .contact-detail-action {
    margin-top: 120px;
}
.contact-area .contact-detail-action .contact-item {
    background-color: #00b3b2;
    padding: 52px 30px 50px 60px;
    height: 270px;
    position: relative;
    z-index: 1;
    margin-right: 57px;
}
.contact-area .contact-detail-action .contact-item:after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background-color: #00b3b2;
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform: skew(-12deg,0deg);
    -moz-transform: skew(-12deg,0deg);
    -ms-transform: skew(-12deg,0deg);
    -o-transform: skew(-12deg,0deg);
    transform: skew(-12deg,0deg);
}
.contact-area .contact-detail-action .contact-item2,
.contact-area .contact-detail-action .contact-item2:after {
    background-color: #0d277b;
}
.contact-area .contact-detail-action .contact-item3,
.contact-area .contact-detail-action .contact-item3:after {
    background-color: #ff7900;
}
.contact-area .contact-detail-action .contact-item .contact__title {
    color: #fff;
    font-weight: 800;
    font-size: 26px;
    margin-bottom: 40px;
}
.contact-area .contact-detail-action .contact-item .contact__desc {
    color: #fff;
    line-height: 30px;
    font-weight: 500;
}
.contact-area .form-shared form .textarea {
    height: 170px;
}
/*=============================
   FORM-SHARED
 =============================*/
.form-shared form {
    position: relative;
}
.form-shared form .form-group {
    margin-bottom: 20px;
}
.form-shared form .form-control,
.form-shared form .textarea,
.form-shared form .select-option {
    width: 100%;
    height: auto;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border: none;
    background-color: #f2f0ec;
    color: #818181;
    padding: 19px 30px;
    -webkit-box-shadow: 0 0 0 0;
    -moz-box-shadow: 0 0 0 0;
    box-shadow: 0 0 0 0;
    font-weight: 500;
    font-size: 16px;
    outline: none;
}
.form-shared form .select-group {
    position: relative;
}
.form-shared form .select-group:after {
    position: absolute;
    content: "\f0d7";
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 30px;
    font-family: "fontAwesome";
    font-size: 14px;
    color: #818181;
    pointer-events: none;
    display: inline-block;
}
.form-shared form .select-option {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    padding-top: 18px;
    padding-bottom: 18px;
    cursor: pointer;
}
.form-shared form .textarea {
    height: 138px;
}
.form-shared form .search-submit {
    border: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 30px;
    background-color: transparent;
    color: #232323;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.form-shared form .search-submit:hover {
    color: #1762f0;
}
.form-shared form .submit__btn {
    margin-top: -8px;
    line-height: 60px;
}

/*=============================
   contact-form-area
 =============================*/
.contact-form-area {
    padding-top: 120px;
    padding-bottom: 120px;
}
.contact-form-area .form-shared-wrap {
    margin-top: 51px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-img {
    margin-bottom: 23px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-img img {
    width: 100%;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .form__title {
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 25px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .form__desc {
    line-height: 30px;

}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .form__list {
    margin-top: 30px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .form__list li {
    margin-bottom: 17px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .form__list li i {
    color: #0d277b;
    font-size: 14px;
    margin-right: 4px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .form__list li:last-child {
    margin-bottom: 0;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .contact-us-box {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    border-top: 2px solid #f2f0ec;
    border-bottom: 2px solid #f2f0ec;
    margin-top: 52px;
    padding-top: 40px;
    padding-bottom: 38px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .contact-us-box .contact__item h4 {
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 8px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .contact-us-box .contact__item a {
    color: #0d277b;
    font-size: 18px;
}
.contact-form-area .form-shared-wrap .form-shared-content .form-content .contact-us-box .contact__item2 {
    margin-left: auto;
    padding-right: 57px;
}
.contact-form-area .form-shared-wrap .form-shared form .textarea {
    height: 240px;
}





/*==== footer-area ===*/
.footer-area {
    background: #333;
    position: relative;
    z-index: 1;
    padding-top: 80px;
    overflow: hidden;
}
.footer-area .footer-top {
    padding-bottom: 40px;
}
.footer-logo-wrap {max-width: 300px;}
.footer-area .footer-widget-wrap .footer-item .footer-logo-wrap p {color: #fff; font-size: 16px; line-height: 1.5; font-family: serifa, serif;}
.footer-area .footer-widget-wrap .footer-item .footer-logo-wrap p span {font-weight: 700;}
.logo-footer img {max-width: 100%; margin:0 0 10px -30px;}
.footer-area .footer-widget-wrap .footer-item a,
.footer-area .footer-widget-wrap .footer-item p,
.footer-area .footer-widget-wrap .footer-item ul li {
    color: #dcdcdc;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 400;
    position: relative;
    margin-bottom: 4px;
}
.contact__info li span {color: #fff; display: block;}
.footer-area .footer-widget-wrap .footer-item ul li a {
    display: inline-block;
}
.footer-area .footer-widget-wrap .footer-item ul li a:after {
    position: absolute;
    content: '';
    bottom: -2px;
    right: 0;
    width: 0;
    height: 1px;
    background-color: #ff7900;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.footer-area .footer-widget-wrap .footer-item ul li a:hover:after {
    width: 100%;
    right: auto;
    left: 0;
}
.footer-area .footer-widget-wrap .footer-item a {
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.footer-area .footer-widget-wrap .footer-item a:hover {
    color: #ff7900;
}
.footer-area .footer-widget-wrap .footer-item {
    position: relative;
}
.footer-area .footer-widget-wrap .footer-item .widget__title {
    font-size: 20px;
    color: #fff;
    font-weight: 800;
    text-transform: capitalize;
    margin-bottom: 23px;
}
.footer-area .footer-widget-wrap .footer-item .footer__social {
    margin-top: 29px;
}
.footer-area .footer-widget-wrap .footer-item .footer__social ul li {
    display: inline-block;
    margin-right: 8px;
}
.footer-area .footer-widget-wrap .footer-item .footer__social ul li:last-child {
    margin-right: 0;
 }
.footer-area .footer-widget-wrap .footer-item .footer__social ul li a {
    font-size: 14px;
    background-color: #fff;
    border-radius: 50%;
    color: #333;
    padding: 0 14px 0 14px;
    line-height: 42px;
    position: relative;
    z-index: 1;
    display: block;
    min-width: 48px;
    border: 3px solid #ff7900;
}




/*=== footer-copyright===*/
.footer-area .footer-copyright {
    text-align: center;
    border-top: 1px solid #333;
    padding-top: 15px;
    padding-bottom: 25px;
}
.footer-area .footer-copyright .copyright-desc {
    font-size: 16px;
    color: #bfbfbf;
}
.footer-area .footer-copyright .copyright-desc a {
    color: #bfbfbf;
    position: relative;
    z-index: 1;
}
.footer-area .footer-copyright .copyright-desc a:after {
    position: absolute;
    content: '';
    bottom: 0;
    right: 0;
    width: 0;
    height: 1px;
    background-color: #ff7900;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}
.footer-area .footer-copyright .copyright-desc a:hover {
    color: #ff7900;
}
.footer-area .footer-copyright .copyright-desc a:hover:after {
    width: 100%;
    right: auto;
    left: 0;
}
/*=== back to top ===*/
#back-to-top {
    position: fixed;
    right: -150px;
    bottom: 40px;
    z-index: 9999;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #fff;
    -webkit-box-shadow: 0 10px 40px rgba(82, 85, 90, 0.2);
    -moz-box-shadow: 0 10px 40px rgba(82, 85, 90, 0.2);
    box-shadow: 0 10px 40px rgba(82, 85, 90, 0.2);
    color: #424242;
    font-size: 20px;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    border: 1px solid #ddd;
}
#back-to-top:hover {
    background-color: #ff7900;
    color: #fff;
    border-color: #ff7900;
}
#back-to-top.back-btn-shown {
    right: 30px;
    opacity: 1;
    visibility: visible;
}