@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,400&display=swap");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
:root {
    --body-font-size: 1rem;
}

* {
    margin: 0;
    padding: 0;
}

body {
    background: #f5f5f5;
    margin: 0;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: var(--body-font-size);
}

#accordian {
    background: #f5f5f5;
    width: 100%;
    margin: 0 auto 0 auto;
    color: #000000;
}

#accordian h3 {
    background: #003040;
    background: linear-gradient(#003040, #002535);
}

#accordian h3 a {
    padding: 10px 10px;
    font-size: 1rem;
    line-height: 20px;
    display: block;
    color: white;
    text-decoration: none;
}

#accordian h3:hover {
    text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);
}

i {
    margin-right: 10px;
}

#accordian li {
    list-style-type: none;
}

#accordian ul ul li a,
#accordian h4 {
    color: #000000;
    text-decoration: none;
    font-size: 1rem;
    line-height: 30px;
    display: block;
    padding: 0 10px;
    transition: all 0.15s;
    position: relative;
}

#accordian ul ul li a.zone,
#accordian h4 {
    display: flex;
    align-items: center;
    color: #000000;
    text-decoration: none;
    font-size: 1rem;
    height: 65px;
    padding: 0 5px;
    transition: all 0.15s;
    position: relative;
}

#accordian ul ul li a.zone:hover {
    background: #ffffff;
    border-left: 10px solid #ffffff;
}

#accordian ul li.active ul li a.presentation {
    border-left: 10px solid #5E70A6;
}

#accordian ul li.active ul li a.africa {
    border-left: 10px solid #E87ABA;
}

#accordian ul ul li .africa a:hover {
    background: #ffffff;
    border-left: 5px solid #E87ABA;
}

#accordian ul li.active ul li a.asiapacific {
    border-left: 10px solid #E4A097;
}

#accordian ul ul li .asiapacific a:hover {
    background: #ffffff;
    border-left: 5px solid #E4A097;
}

#accordian ul li.active ul li a.uroasia {
    border-left: 10px solid #9DD2D7;
}

#accordian ul ul li .euroasia a:hover {
    background: #ffffff;
    border-left: 5px solid #9DD2D7;
}

#accordian ul li.active ul li a.euroasia {
    border-left: 10px solid #9DD2D7;
}

#accordian ul li.active ul li a.europe {
    border-left: 10px solid #8BBBE3;
}

#accordian ul ul li .europe a:hover {
    background: #ffffff;
    border-left: 5px solid #8BBBE3;
}

#accordian ul li.active ul li a.latinamerica,
#accordian ul li.active ul li a.latinamericaandthecaribbean {
    border-left: 10px solid #B3A5CE;
}

#accordian ul ul li .latinamerica a:hover,
#accordian ul ul li .latinamericaandthecaribbean a:hover {
    background: #ffffff;
    border-left: 5px solid #B3A5CE;
}

#accordian ul li.active ul li a.middleeastandwestasia {
    border-left: 10px solid #C3D89F;
}

#accordian ul ul li .middleeastandwestasia a:hover {
    background: #ffffff;
    border-left: 5px solid #C3D89F;
}

#accordian ul li.active ul li a.northamerica {
    border-left: 10px solid #EBB878;
}

#accordian ul ul li .northamerica a:hover {
    background: #ffffff;
    border-left: 5px solid #EBB878;
}

#accordian ul ul {
    display: none;
}

#accordian li.active>ul {
    display: block;
}

#accordian ul ul ul {
    margin-left: 15px;
    border-left: 1px dotted rgba(0, 0, 0, 0.5);
}

#accordian a:not(:only-child):after {
    content: "\f107";
    font-family: fontawesome;
    position: absolute;
    right: 10px;
    top: 50%;
    font-size: 1rem;
    transform: translateY(-50%);
}

#accordian .active>a:not(:only-child):after {
    content: "\f106";
}


/* width */

::-webkit-scrollbar {
    width: 5px;
}


/* Track */

::-webkit-scrollbar-track {
    background: #f1f1f1;
}


/* Handle */

::-webkit-scrollbar-thumb {
    background: #888;
}


/* Handle on hover */

::-webkit-scrollbar-thumb:hover {
    background: #555;
}