@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:400,500,700&subset=latin-ext');
/*--------------------------*/
html {
    width: 100%;
    overflow-x: hidden;
}


html:lang(ar) {
    direction: rtl;
}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.54;
       overflow-x: hidden;
}

html:lang(ar) body {
    font-family: zatca_font_bold, 'Roboto', sans-serif; /* Use the font zatca_font_bold for Arabic !*/
}

/*TODO:Test the page width*/
/*@media (min-width: 1600px) {
    .container {
        width:1570px
    }
}*/
/*------------- Header -------------*/
header {
    position: relative;
    z-index: 1001;
}

.navbar-toggler {
    display: none;
}

.itc-logo-simple {
    display: none;
}
.world-logo-simple {
    display: none;
}

.mobile-warning {
    display: none;
    padding: 15px;
    background: #0ca66d;
    color: #FFF;
    text-align: center;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    opacity: 0.9;
}

    .mobile-warning span {
        padding: 10px 15px;
        text-align: center;
        width: 100%;
        display: block;
    }

    .mobile-warning button {
        background: #032B55;
        border: 0;
        outline: 0;
        padding: 5px 15px 2px;
    }

    .mobile-warning a {
        color: #FFF;
    }

.header-nav > .container .btn-close {
    display: none;
}

/* to allow for the user to differentiate between clicking on the intracen logo and macmap logo. */
.macmap-logo {
    display:flex;
    align-content:center;
}
.language-selector-with-globe {
    display: flex;
    align-items: baseline;
    flex-direction: row;
    flex-wrap: wrap;
}

header .block-logos {
    height: 138px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    header .block-logos .logo {
        flex-grow: 1;
        display: flex;
        color: #8B95A1;
        text-decoration: none !important;
        align-items: center;
    }

        header .block-logos .logo img {
            margin-right: 50px;
        }

        /* For "Market Access Map" in the top banner, next to the language switch */
        header .block-logos .logo span strong {
            display: block;
            font-family: 'Roboto Slab', serif;
            font-weight: 400;
            color: #202020;
            font-size: 1.625em;
        }

/* Keep the slab, even though it's in Arabic, for "Market Access Map" ?
html:lang(ar) header .block-logos .logo span strong {
    font-family: zatca_font_bold;
}
*/

header .culture-selection {
    list-style-type: none;
    padding: 0 10px;
    text-transform: uppercase;
    cursor: pointer;
}

    header .culture-selection li {
        display: inline-block;
        margin: 0 5px;
        color: #8B95A1;
        font-family: 'Roboto', serif;
    }

    header .culture-selection a {
        color: #8B95A1;
    }

    /* for the Arabic language selector, use the  zatca_font_bold but for EN, FR, ES and RU, keep the Roboto font */
    header .culture-selection li:last-of-type {
        font-family: zatca_font_bold;
        /* color: red;*/
    }


    header .culture-selection span {
        font-weight: bold;
    }

.header-nav {
    background-color: #032B55;
    position: relative;
    z-index: 10;

}

    .header-nav > .container {
        padding: 0;
    }

    .header-nav nav {
        height: 54px;
        background: #032B55;
        display: flex;
    }


.lang-ru .header-nav {
    background-color: #032B55;
    position: relative;
    z-index: 10;
    font-size: 14px; /* was 15px to be the same as en, fr es menu items */
}


.header-nav > .container {
    padding: 0;
}

.header-nav nav {
    height: 54px;
    background: #032B55;
    display: flex;
    justify-content: space-between;
    width: 100%; /*  1170px*/
    align-items: stretch;
}


header nav .container {
    text-align: center;
}

.header-nav nav ul.main-nav {
    margin: 0;
    padding: 0;
    flex-grow: 1;
    flex-shrink: 0;
}



    .header-nav nav ul.main-nav li {
        position: relative;
        white-space: nowrap;
        display: inline-block;
    }

/* sub menu*/


.submenu-container:hover {
    background: violet;
}



    .header-nav nav ul.main-nav li {
        position: relative;
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
    }
        .header-nav nav ul.main-nav li > span {
            transform: translateX(10px);
        }

.header-nav nav > ul > li .sub-menu:before {
    content: "";
    position: absolute;
    height: 3em; /* 42px; */
    background: #7E96A9;
    width: 300vw;
    top: 0;
    left: -100vw;
    opacity: 0;
    z-index: -1;
    transition: opacity 0.2s ease-out;
    will-change: opacity;
}



.header-nav nav > ul > li:hover .sub-menu:before {
    opacity: 1;
    justify-content: center;
    z-index: 0;
}
.header-nav nav > ul > li .sub-menu .sub-menu:before {
    background: #fff;
}

.header-nav nav > ul > li .sub-menu .sub-menu li span.regional-intiative-title{
    color: #000!important; /* black color for the regional initiatives titles,  for desktop version*/
}

.header-nav nav > ul > li .sub-menu .sub-menu li span.regional-intiative-new {
    color: red;
    text-transform: uppercase;
}

.header-nav nav > ul > li .sub-menu .sub-menu li a:hover span.regional-intiative-title {
    color: darkblue; /* black color for the regional initiatives titles,  for desktop version*/
    font-weight: 500;
}

.header-nav nav > ul > li .sub-menu .sub-menu li a:hover span.regional-intiative-new {
    font-weight: 500;
}
header-nav nav > ul > li .sub-menu .sub-menu:after {
    content: "";
    height: 4px;
    background: #ffff;
    width: 100%;
    position: absolute;
    top: 0;
    transform: translateY(-100%);
    opacity: 0;
    transition: opacity 0.1s ease-out;
}

.header-nav nav .sub-menu-right > ul > li:hover .sub-menu:before {
    
    justify-content: flex-end;
}

header-nav nav > ul > li .sub-menu .sub-menu:hover:after {
    opacity: 1;
}

.header-nav nav .sub-menu .sub-menu li a:after {
    background: #032B55;
}

.header-nav nav ul.main-nav li.menu-a-left {
    position: static;
}

.header-nav nav ul.main-nav li a {
    display: block;
    line-height: 54px;
    padding: 0 15px;
    color: #fff;
    position: relative;
    opacity: .8;
    transition: opacity .3s ease;
}

    .header-nav nav ul.main-nav li a:hover,
    .header-nav nav ul.main-nav li a.active {
        color: #fff;
        text-decoration: none;
        opacity: 1;
    }

    .header-nav nav ul.main-nav li a:after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: #fff;
        transition: opacity .3s ease;
        opacity: 0;
    }

    .header-nav nav ul.main-nav li a:hover:after,
    .header-nav nav ul.main-nav li a.active:after {
        opacity: 1;
    }

.header-nav nav .sub-menu {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    z-index: 9999;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    visibility: hidden;
    transform: scale(0.9);
    transition: all .2s ease-out;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.header-nav nav .sub-menu-right li {
    justify-content: flex-end;

}

    .header-nav nav .sub-menu li {
        display: inline-block;
    }

.header-nav nav ul.main-nav li:hover > .sub-menu {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1);
}


.header-nav nav .sub-menu .sub-menu {
    justify-content: flex-end;
}   
.header-nav nav ul.main-nav li .sub-menu a {
    line-height: 3em; /* 42px;*/
    font-size:1em; /* 14px; */
}

/* right-nav*/
.header-nav nav ul.right-nav {
    flex-grow: 0;
}

    .header-nav nav ul.right-nav li {
        display: inline-block;
    }

        .header-nav nav ul.right-nav li a {
            display: block;
            line-height: 54px;
            padding: 0 15px;
            color: #fff;
            position: relative;
            opacity: .8;
            transition: opacity .3s ease;
            text-decoration: none;
            justify-content: center;
        }

            .header-nav nav ul.rigth-nav li a:hover,
            .header-nav nav ul.right-nav li a.active {
                color: #fff;
                text-decoration: none;
                opacity: 1;

            }


        .header-nav nav ul.main-nav .sub-menu .sub-menu li a:after,
        .header-nav nav ul.right-nav li a:after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 3px;
            background: #fff;
            transition: opacity .3s ease;
            opacity: 0;

        }

            .header-nav nav ul.right-nav li a:hover:after,
            .header-nav nav ul.right-nav li a.active:after {
                opacity: 1;

            }

@media (max-width: 1366px) {
    .header-nav nav .sub-menu {
        justify-content: unset;
    }
        .header-nav nav .sub-menu.sub-menu-right {
            justify-content: flex-end;
        }
    .header-nav nav > ul > li .sub-menu .sub-menu li span.regional-intiative-title {
        color: #4FCBFF!important; /* lighter teal*/
    }
    .header-nav nav .sub-menu .sub-menu ul li a:hover span.regional-intiative-title,
    .header-nav nav .sub-menu .sub-menu ul li a:active span.regional-intiative-title,
    .header-nav nav .sub-menu .sub-menu ul li a:focus span.regional-intiative-title,
    .header-nav nav .sub-menu .sub-menu ul li a:active span.regional-intiative-title {
        background: white;
        color: rgb(3, 43, 85);
    }
}

/****************main-search-container*****************/
.main-search-container {
    position: relative;
    background: url(../jpg/header-image-full.jpg) center 20% / cover;
}

    .main-search-container:before {
        content: "";
        background: linear-gradient(180deg, rgba(3, 43, 85, 0.7) 0%, rgba(3, 43, 85, 0.4) 80%, rgba(3, 43, 85, 0) 100%);
        position: absolute;
        display: block;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    .main-search-container .container {
        position: relative;
        background-color: transparent;
        display: flex;
        align-items: center;
        height: 550px;
        z-index: 1;
    }

        .main-search-container .container .search-box {
            text-align: center;
            width: 100%;
        }

            .main-search-container .container .search-box .title {
                font-weight: 700;
                font-size: 36px;
                color: #FFFFFF;
                letter-spacing: -0.21px;
                line-height: 40px;
            }

            .main-search-container .container .search-box .sub-title {
                font-weight: 500;
                font-size: 18px;
                color: #EFEFF4;
                margin: 15px auto 35px;
                max-width: 640px;
            }

            .main-search-container .container .search-box .search {
                min-height: 125px;
                padding: 30px 33px 10px;
                background: #FFFFFF;
                box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.04);
            }

.search .search-input-group.ntlc-wrapper {
    margin-bottom: 15px;
}

.search .search-input-group {
    margin: 0 0 25px;
}

    .search .search-input-group label {
        font-size: .875em;
        margin: 0;
        color: #6A8099; /*  #929CA7;  */
        letter-spacing: -0.3px;
        text-transform: uppercase;
        white-space: nowrap;
        font-weight: 500;
        display: block;
        text-align: left;
        text-overflow: ellipsis;
        overflow: hidden;
    }

        .search .search-input-group label.error {
            text-transform: none;
            position: absolute;
            line-height: 25px;
            left: 0;
            bottom: -25px;
            color: #E41262;
        }

    .search .search-input-group .product-label {
        display: inline-block;
        vertical-align: text-top;
        text-align: left;
        float: left;
    }

    .search .search-input-group select {
        /*    border:  1px solid aqua;*/
        background: url(../gif/itc-loading-38.gif) center center no-repeat #fff;
        width: 100%;
        -webkit-appearance: none;
        -moz-appearance: none;
    }

    .search .search-input-group .input {
        display: block;
        width: 100%;
        border: 0;
        background-color: transparent;
        line-height: 38px;
        height: 38px;
        position: relative;
        padding: 0;
        background: url(../png/down-arrow-sml.png) right 5px center no-repeat;
        /* url(../images/icons/svg/dropdown_big.svg) right 5px center no-repeat;  */
     
    }

        .search .search-input-group .input input {
            border: 0;
            background: transparent !important;
            height: 35px;
            line-height: 35px;
            width: 100%;
            outline: none;
            color: #032B55;
            font-weight: 500;
            text-overflow: ellipsis;
            padding: 0 23px 0 25px;
            vertical-align: top;
        }

        .search .search-input-group .input.product {
            border-bottom: 1px solid #D2DAE3;
            transition: border-bottom .3s ease;
        }

        .search .search-input-group .input.ntlc-select {
            border-bottom: 0;
            /*  width: max-content;*/
        }

    .search .search-input-group .input-radio {
        display: flex;
        justify-content: space-between;
        background: none;
    }
        .search .search-input-group .input-radio input {
            white-space: nowrap;
            width: auto;
            margin: 0;
        }

        .search .search-input-group .input-radio .radio-item {
            display: flex;
            align-items: center;
            color: #032B55;
            font-weight: 500;
            font-size: 17px;
            text-transform: none;
        }

#market-access-query-form .d-flex,
#trade-agreement-query-form .d-flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
/* Analyse - Trade Agreements*/
#trade-agreement-query-form .d-flex {
    max-width: 100%;
    align-items: center;
    justify-content: space-between;/* was normal  for the desktop alignment of the search form */
}

/* Trade agreements search form on desktop - search button for Arabic! */
html:lang(ar) #trade-agreement-query-form > div > div.col-lg-2.col-lg-push-1.search-input-group.search-submit-wrapper {
    left: unset;
}


#market-access-query-form .search-input-group,
#trade-agreement-query-form .search-input-group {
    flex: 1 0 auto;
    padding: 0 10px;
    width: 100%;
    max-width: 196px;
}

    #market-access-query-form .search-input-group.country-selection,
    #trade-agreement-query-form .search-input-group.country-selection {
        max-width: 270px;
    }

    #market-access-query-form .search-input-group.ntlc-wrapper {
        margin-bottom: 0;
        padding-left: 15px;
    }

.page-access-detail #market-access-query-form .search-input-group.ntlc-wrapper {
    max-width: 925px;
}

.page-access-overview #market-access-query-form .search-input-group.ntlc-wrapper {
    max-width: 925px;
}

.page-trade-remedies #market-access-query-form .search-input-group.ntlc-wrapper {
    max-width: 935px;
}

.main-search-container .form-error {
    color: #ff0000;
    font-weight: bold;
    text-align: left;
    margin-bottom: 15px;
    font-size: 14px;
}

#market-access-query-form .w-medium-selection {
    flex-basis: 180px;
    max-width: 180px;
}

#market-access-query-form .w-short-selection {
    flex-basis: 110px;
    max-width: 110px;
}

#market-access-query-form .w-long-selection {
    flex-basis: 200px;
    max-width: 200px;
}

#market-access-query-form .product-selection {
    max-width: 368px;
    width: 100%;
}

#market-access-query-form #year,
#market-access-query-form #remedy-type,
#market-access-query-form #regulation-type {
    color: rgba(0,0,0,0);
}

.home #market-access-query-form .country-selection{
    max-width: 270px;
}

.home #market-access-query-form .product-selection {
    max-width: 368px;
}

.page-access-detail #market-access-query-form .country-selection {
    max-width: 210px;
}

.page-access-detail #market-access-query-form .search-input-group.year-selection {
    max-width: 100px;
}

.page-trade-remedies #market-access-query-form .country-selection {
    max-width: 160px;
}

.page-trade-remedies #market-access-query-form .search-input-group.remedy-selection {
    max-width: 120px;
}

.page-regulatory-requirement #market-access-query-form .search-input-group.requirement-selection {
    max-width: 140px;
}


/* Chosen drop down lists to be text right aligned for Arabic! */
.chosen-rtl.chosen-container-single .chosen-results {
    text-align: right;
}

@media (max-width: 1199px) {


    /*switch to mobile menu for the navigation here*/



    .module-list .boxes .box p {
       display:none;
    }



    #market-access-query-form .search-input-group.country-selection,
    #market-access-query-form .product-selection,
    .home #market-access-query-form .country-selection,
    .page-access-overview #market-access-query-form .country-selection,
    .home #market-access-query-form .product-selection,
    .page-access-overview #market-access-query-form .product-selection,
    .page-access-detail #market-access-query-form .country-selection,
    .page-access-detail #market-access-query-form .search-input-group.year-selection,
    .page-trade-remedies #market-access-query-form .country-selection,
    .page-trade-remedies #market-access-query-form .search-input-group.remedy-selection,
    .page-regulatory-requirement #market-access-query-form .search-input-group.requirement-selection,
     #trade-agreement-query-form .search-input-group.country-selection,
     #trade-agreement-query-form .search-input-group.partner-selection,
     #trade-agreement-query-form .search-input-group.relation-selection {
        /*   max-width: 50%!important;  */
        max-width: 100% !important;
    }
    #market-access-query-form .search-input-group.search-submit-wrapper,
    .search-submit-wrapper,
    #trade-agreement-query-form .search-submit-wrapper {
        max-width: 100%;
        display: flex;
        justify-content: flex-end;
    }

    #market-access-query-form .search-input-group .search-button,
    #trade-agreement-query-form .search-button {
        max-width: 300px;
        margin: 0;
    }
}
/* The radio wrapper */
.search .radio-item {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.search .search-input-group .input.product:focus-within {
    border-bottom: 1px solid #032B55;
}

.search .search-input-group .input.ntlc-select:focus-within {
    border: 0;
}

.search .search-input-group .input .chosen-search input {
    padding: 0 5px;
}

.search .search-input-group .input:before {
    content: '';
    display: block;
    position: absolute;
    top: calc(50% - 7px);
    left: 0;
    width: 20px;
    height: 14px;
}

.search .search-input-group .input.import:before {
    background: url(../svg/import.svg) 0 0 no-repeat;
}

.search .search-input-group .input.export:before {
    background: url(../svg/export.svg) 0 0 no-repeat;
}

.search .search-input-group .input.product:before {
    /*background: url(../images/icons/svg/product.svg) 0 0 no-repeat;  */
    background: url('../png/product-icon-sml.png') 0 0 no-repeat;
    width: 2em;
    height: 2em;
    transform: translateY(-4px);
}

.search .search-input-group .input.year:before {
    background: url(../svg/calendar-alt-regular.svg) 0 0 no-repeat;
    background-size: contain;
    background-position-x: 2px;
    transform: translateY(-2px);
}

.search .search-input-group .input.remedy:before,
.search .search-input-group .input.regulation:before {
    background: url(../svg/scroll.svg) 0 0 no-repeat;
    background-size: 15px auto;
    background-position: -1px 1px;
}

.search .find-product {
    text-align: right;
}

    .search .find-product a {
        display: inline-block;
        margin-top: 15px;
        color: #043b85; /* #032B55; */
        font-weight:500; 
        font-size: .875em;
        letter-spacing: .3px;
        line-height: 1.1em;
        padding: 5px 0;
    }

.search .validation-message{
    text-align: right;
}

.search .validation-message a {
    display: inline-block;
    margin-top: 15px;
    color: #032B55;
    font-size: .875em;
    letter-spacing: .3px;
    line-height: 1.1em;
    padding: 5px 0;
}

.search .search-button {
    margin-top: 3px;
    text-transform: uppercase;
    display: block;
    width: 100%;
    line-height: 57px;
    border: 0;
    text-align: center;
    background: #CC464F;/* now a red colour *//* #032B55; */
    border-radius: 2px;
    color: #fff;
    letter-spacing: 1px;
    transition: background-color 0.3s ease-out;
    cursor: pointer;
    border-radius: 5px; /* rounded corners*/
}

    .search .search-button:hover, .search .search-button:focus {
        background-color: #194d83;
    }

.search .input .autocomplete {
    display: none;
    max-height: 430px;
    position: absolute;
    width: 100%;
    top: 40px;
    left: 0;
    margin: 0;
    padding: 0;
    background-color: #FBFCFE;
    border: 1px solid #D2DAE3;
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
    z-index: 500;
    line-height: 1.1em;
    color: #032B55;
    font-size: .9375em;
    overflow-y: auto;
}

    .search .input .autocomplete li {
        list-style: none;
        padding: 12px 12px 12px 20px;
        border-top: 1px solid #D2DAE3;
        cursor: pointer;
        text-align: left;
    }

        .search .input .autocomplete li:hover {
            background-color: #ebf0fa;
        }

    .search .input .autocomplete.lg {
        width: 700px;
    }

        .search .input .autocomplete.lg li {
            display: flex;
        }

            .search .input .autocomplete.lg li .code {
                width: 105px;
                flex-shrink: 0;
            }

.search .search-input-group .product-switch {
    float: right;
    color: #032B55;
    margin-right: 4px;
}


html:lang(ar) .search .search-input-group .product-switch {
   font-size: 0.7em;
}


.search .search-input-group .product-switch input[type="checkbox"] {
    position: absolute;
    left: -9999px;
}

        .search .search-input-group .product-switch input[type="checkbox"] + i {
            position: relative;
            margin: 0 5px 0 5px;
            top: 3px;
            cursor: pointer;
            width: 24px;
            height: 15px;
            display: inline-block;
            background: url("../png/hs6_checked.png") left center no-repeat;
        }

        .search .search-input-group .product-switch input[type="checkbox"]:checked + i {
            background: url("../png/hs6_unchecked.png") left center no-repeat;
        }


    /* for the product switch to be smaller so that it fits on the one line in the product search panel - ru text only*/
    .search .search-input-group .product-switch.ru {
        font-size: 10px; /* was 12px  0.7em;*/
    }

.lang-ru .search .search-input-group .product-switch {
    font-size: 11px;
}

.search .search-input-group .product-switch input[type="checkbox"] {
    position: absolute;
    left: -9999px;
}


html:lang(ar) .search .search-input-group .product-switch input[type="checkbox"] {
    left: 9999px; /* for Arabic! */
}
        .search .search-input-group .product-switch input[type="checkbox"] + i {
            position: relative;
            margin: 0 5px 0 5px;
            top: 3px;
            cursor: pointer;
            width: 24px;
            height: 15px;
            display: inline-block;
            background: url("../png/hs6_checked.png") left center no-repeat;
        }

        .search .search-input-group .product-switch input[type="checkbox"]:checked + i {
            background: url("../png/hs6_unchecked.png") left center no-repeat; 
        }

/* Product Switch checkbox on the Search Query form, for Arabic! */
html:lang(ar) .search .search-input-group .product-switch input[type="checkbox"]:checked + i {
    background: url("../png/hs6_unchecked.png") right center no-repeat; /* was "left" */
}

    .search .search-input-group .product-switch span {
        opacity: .5;
        letter-spacing: -0.3px;
    }

.lang-es .search .search-input-group .product-switch {
    transform: translateY(-1px);
}

    .lang-es .search .search-input-group .product-switch span {
        font-size: 11px;
    }



/* Russian text  for the tools society section near the bottom of the home page*/

.lang-ru .home-tools-society .continer .col-md-8.block-other-tools .row.block-content .col-xs-12.col-sm-6.tool.tool-sustainability-map .heading h4 a {
    font-size: 5px;
}



.lang-ru .col-md-8.block-other-tools h4 a {
    font-size: 0.7em; /*this one */
}


.search .search-input-group .product-switch span.active {
    opacity: 1;
}
/* ------------------Modules section -----------------*/

.module-list {
    padding: 110px 0;
}

    .module-list .boxes {
        display: flex;
        justify-content: space-evenly; /*space-between; */
    }

        .module-list .boxes .box {
            display: flex;
            align-items: center;
            flex-direction: column;
            background: #F9F9F9;
            color: #032B55;
            border: 1px solid #F0F0F2;
            border-radius: 2px;
            padding: 40px 20px 10px;
            min-height: 270px;
            width: 270px;
            align-content: center;
            text-decoration: none !important;
            transition: border-color 0.3s ease-out;
            align-items: center;
            justify-content: normal;
        }

            .module-list .boxes .box:hover {
                border-color: #032B55;
            }

                .module-list .boxes .box:hover p {
                    color: #032B55;
                }

            .module-list .boxes .box img {
                margin: 0 auto;
                box-sizing: content-box;
            }

            .module-list .boxes .box span {
                display: block;
                margin-top: 0.8em; /* 20px; */
                text-align: center;
                font-weight: 500;
                font-size: 1.2em; /* 22px; */
                color: #032B55;
                letter-spacing: -0.08px;
                line-height: 1.6em; /*34px; */
            }

            .module-list .boxes .box p {
                width: 100%;
                font-weight: 400;
                font-size: 16px;
                color: #9DA2A6;
                line-height: 24px;
                padding: 5px;
                margin: 2px;
                text-align: center;
                transition: color 0.2s ease-out;
            }

/* big tablets to 1199px*/

@media only screen and (max-width: 1199px) {
    .module-list .boxes .box {
        width: 50%;
        word-break: break-all;
        padding: 15px 15px 10px;
        margin: 15px auto;
    }
}

/* small tablet to big tablet 768px to 992px */
@media only screen and (max-width: 992px) {
    .module-list .boxes .box {
        padding-top: 40px;
    }
}

/*  small phones to small tablets up 481px to 767px */
@media only screen and  (max-width: 767px) {
    .module-list .boxes .box {
        width: 100%;
    }
}


/* for Arabic, in the Charts component for Compare pages*/
@media (min-width: 1200px) {
    html:lang(ar) .col-lg-1,
    html:lang(ar) .col-lg-2,
    html:lang(ar) .col-lg-3,
    html:lang(ar) .col-lg-4,
    html:lang(ar) .col-lg-5,
    html:lang(ar) .col-lg-6,
    html:lang(ar) .col-lg-7,
    html:lang(ar) .col-lg-8,
    html:lang(ar) .col-lg-9,
    html:lang(ar) .col-lg-10,
    html:lang(ar) .col-lg-11, 
    html:lang(ar) .col-lg-12 {
        float: right;
    }
}

/* COmpare pages - tabs (table, chart, map) at the top to be RTL for Arabic! */
html:lang(ar) .nav-tabs > li {
    float: right;
}

/* Compare pages - get right of a tiny border on the right for the tabs */
html:lang(ar) .nav-tabs > li > a {
    margin-right: 0px;
}


/* ------------------NEW Taxes overview  section -----------------*/


/* adding a 30px margin to the left in order to accommodate the exclamation icon of the Tax module */
#overview-content,
.custom-duties-contentfal,
.overview-content,
#custom-duties-content,
#trade-remedy-content,
#taxes-fees-charges .heading,
#taxes-fees-charges-source,
#ntm-summary-content {
    margin-left: 30px;
}



/* for Arabic  to have the marging to the right (in order to cater for the exclamation mark for taxes) ! */
html:lang(ar) #custom-duties-content,
html:lang(ar) #overview-content,
html:lang(ar) .custom-duties-contentfal,
html:lang(ar) .overview-content,
html:lang(ar) #trade-remedy-content,
html:lang(ar) #taxes-fees-charges .heading,
html:lang(ar) #taxes-fees-charges-source,
html:lang(ar) #ntm-summary-content {
    margin-right: 30px;
    margin-left: unset;
}



.tax-module-list {
    padding: 40px 0; /* reduce the padding - was 110px 0;  */
}

    .tax-module-list .boxes {
        display: flex;
        justify-content: space-between;
    }

        .tax-module-list .boxes .box {
            display: flex;
            align-items: center;
            flex-direction: column;
            background: #FFFFFF;
            border: 1px solid #F2F2F2;
            box-sizing: border-box;
            box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.05);
            border-radius: 8px;
            padding: 40px 20px 30px;
            min-height: 270px;
            /*min-width: 20em; */
            height: 25em; /*365px; */ /* all boxes to be the same height, or 25em*/
            /*width: 270px;*/
            align-content: center;
            text-decoration: none !important;
            transition: border-color 0.3s ease-out;
            justify-content: center;
            flex-wrap: nowrap;
            max-width: 18em; 
        }


  

            .tax-module-list .boxes .box:hover {
                border-color: #032B55;
            }

                .tax-module-list .boxes .box:hover p {
                    color: #032B55;
                }

            .tax-module-list .boxes .box img {
                margin: 0 auto;
                box-sizing: content-box;
            }

            .tax-module-list .boxes .box span {
                display: block;
                margin-top: 20px;
                text-align: center;
                font-weight: 500;
                /*  color: #032B55;  */
                letter-spacing: -0.08px;
                /*  line-height: 34px;  */
                font-size: 18px;
                line-height: 21px;
                /* identical to box height, or 117% */
                /* 80 % */
                color: rgba(6, 43, 85, 0.8);
                /* word wrap for the title inside the summary boxes*/
                word-break: break-word;
            }


            .tax-module-list .boxes .box hr {
                display: block;
                background: rgba(6, 43, 85, 0.2);
                border-radius: 1px;
                width: 200px;
                height: 1px;
                /*  transform: rotate(-90deg);  */
            }



            .tax-module-list .boxes .box p {
                width: 100%;
                font-weight: 400;
                font-size: 16px;
                color: #9DA2A6;
                line-height: 24px;
                padding: 5px;
                margin: 2px;
                text-align: center;
                transition: color 0.2s ease-out;
            }

            .tax-module-list .boxes .box h2 {
                width: 100%;
                padding: 5px;
                margin: 2px;
                text-align: center;
                transition: color 0.9s ease-out;
                font-weight: 500;
                font-size: 15px;
                line-height: 130%;
                /* or 19px */
                /* 80 % */
                color: rgba(6, 43, 85, 0.8);
                font-style: normal;
                word-break: normal;
            }

            .tax-module-list .boxes .box .text {
                font-style: normal;
                font-weight: 500;
                font-size: 13px;
                padding: 0 0 0 0;
                /* 70 % */
                color: rgba(6, 43, 85, 0.7);
            }
    .tax-module-list .box .item h2 {
        color: #fd5763;
        font-size: 1.4em;
        padding-top: 15px;
    }

        .tax-module-list .box #customs-duties-results-section .item {
            width: 100%;
            font-size: 0.9em;
            text-align: center;
            line-height: 1;
        }

            .tax-module-list .box #customs-duties-results-section .item h3 {
                line-height: 1;
                margin-bottom: 0;
                font-size: 1.2em;
                font-weight: bold;
                color: #fd5763;
            }


        .tax-module-list .boxes .box .container {
            /*   width: fit-content; */
            width: fit-content;
            display: flex;
            flex-wrap: wrap;
            flex-grow: 1;
            align-items: center;
            /*  flex-direction: column;  */
            justify-content: center;
        }

                .tax-module-list .boxes .box .container.margin-left {
                    /*  FOR BOX 1 to move the contents left by 40px */
                    margin-left: 40px;
                }


                .tax-module-list .boxes .box .container > div {
                    flex: 0 50%;
                    /*demo*/
                    /* border: red solid;  */
                    box-sizing: border-box;
                    /*align-items: center;
                    display: block;
                    text-align: justify;  */
                    /* was center */
                    text-align-last: center;
                }




                .tax-module-list .boxes .box .container h3 {
                    font-style: normal;
                    font-weight: bold;
                    font-size: 15px;
                    line-height: 130%;
                    /* or 19px */
                    /*  display: flex;  */
                    /* align-items: flex-end;  */
                    /* Red */
                    color: #CC464F;
                }



            .tax-module-list .boxes .box .container h2 {
                font-style: normal;
                font-size: 15px;
                line-height: 130%;
                min-width: 4em;
                /* or 19px */
                color: #CC464F;
                font-weight: 500;
                font-size: 24px;
            }


            .tax-module-list .boxes .box .container p {
                font-style: normal;
                font-weight: 500;
                font-size: 13px;
                line-height: 130%;
                /* identical to box height, or 17px */
                display: flex;
                align-items: flex-end;
                /* 70 % */
                color: rgba(6, 43, 85, 0.7);
            }

            .tax-module-list .boxes .box .button-border {
                font-style: normal;
                font-weight: 500;
                font-size: 13px;
                line-height: 130%;
                display: flex;
                flex-direction: row;
                align-items: center;
                padding: 7px 20px;
                padding: 7px 20px;
                width: 123px;
                height: 30px;
                /* 80 % */
                border: 1px solid rgba(6, 43, 85, 0.8);
                box-sizing: border-box;
                border-radius: 3px;
            }

                .tax-module-list .boxes .box .button-border:hover {
                    font-style: normal;
                    font-weight: 500;
                    font-size: 13px;
                    color: white;
                    line-height: 130%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    padding: 7px 20px;
                    padding: 7px 20px;
                    width: 123px;
                    height: 30px;
                    /* 80 % */
                    border: 1px solid rgba(6, 43, 85, 0.8);
                    background-color: rgba(6, 43, 85, 0.8);
                    box-sizing: border-box;
                    border-radius: 3px;
                }




.dark-mode {
    background-image: url('../png/down_arrow_wht.png');
}



.tax-module-list .boxes .box .button-border h4 {
    font-style: normal;
    font-weight: 800;
    font-size: 12px;
    line-height: 160%;
}

    .tax-module-list .boxes .box .button-border h4:hover {
        font-style: normal;
        font-weight: 800;
        font-size: 12px;
        line-height: 160%;
        color: white;
    }



.tax-module-list .boxes .box .button-border .learn-more-down-arrow {
    background-image: url('../png/down_arrow.png');
}

.module-list .boxes .box p {
    width: 100%;
    font-weight: 400;
    font-size: 16px;
    color: #9DA2A6;
    line-height: 24px;
    padding: 5px;
    margin: 2px;
    text-align: center;
    transition: color 0.2s ease-out;
}


    .tax-module-list .boxes .box .button-border .learn-more-down-arrow:hover {
        background-image: url('../png/down_arrow_wht.png');
    }

    /* get rid of the padding on the right. Normally for modals, it's 21px*/
.modal-ntm-details,
.modal-tax-details,
.modal-fta-details {
    /* border: 1px solid blue;*/
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-right: 0px !important;
}

.modal-content {
    height: auto;
    min-height: 100%;
    border-radius: 0;
}

.modal-dialog {
    max-width: 730px;
}

.modal-dialog-full-screen {
    width: 100%;
     min-width: -webkit-fill-available;
  /*  min-width: max-content;  */
    height: -webkit-fill-available;
    margin: 0px;
}

.tab-content > .tab-pane {
    display: block !important;
    height: 0 !important;
    overflow: hidden !important;
}

.tab-content > .active {
    height: auto !important;
}


#tax-list-carousel, .tax-slider-heading, .importer-slider-heading, .exporter-slider-heading, .country-slider-heading, .carousel-heading {
    margin-left: 30px;
}


.tax-slider-heading,
.custom-duties-slider-heading,
.importer-slider-heading,
.exporter-slider-heading,
.product-slider-heading,
.country-slider-heading,
.trade-measures-slider-heading,
.temporary-measures-slider-heading,
.trade-agreements-slider-heading,
.carousel-heading {
    display: flex;
    justify-content: space-between;
}
/* COVID19 page - left margins for the slider heading */
.trade-measures-slider-heading {
    margin-left: 1em;
}

.temporary-measures-slider-heading {
    margin-left: 1em;
}
.tax-slider-navigation-buttons, .custom-duties-slider-navigation-buttons, .importer-slider-navigation-buttons, .exporter-slider-navigation-buttons, .product-slider-navigation-buttons, .trade-measures-slider-navigation-buttons, .temporary-measures-slider-navigation-buttons, .trade-agreements-slider-navigation-buttons, .slider-navigation-buttons {
    display: flex;
    justify-content: space-between;
}

.wrap-modal-slider {
    padding: 0 30px;
    opacity: 0;
    transition: all 0.3s;
}

    .wrap-modal-slider.open {
        opacity: 1;

    }

.slick-prev:before, .slick-next:before {
    color: red;
}


.slick-prev {
    color: blue;
    left: 10px;
    z-index: 1000000000000;
}

html:lang(ar) #slider-next-button,
html:lang(ar) .custom-duties-slider-next-button,
html:lang(ar) .trade-remedy-slider-next-button,
html:lang(ar) .importer-slider-next-button,
html:lang(ar) .exporter-slider-next-button,
html:lang(ar) .product-slider-next-button,
html:lang(ar) .trade-agreememts-slider-next-button,
html:lang(ar) .country-slider-next-button,
html:lang(ar) .trade-measures-slider-next-button,
html:lang(ar) .temporary-measures-slider-next-button,
#slider-prev-button,
div.slider-prev-button.slick-arrow,
.slick-previvous-button,
.custom-duties-slider-prev-button,
.importer-slider-prev-button,
.exporter-slider-prev-button,
.product-slider-prev-button,
/*#applied-tariffs-country-slider-prev-button,*/
.country-slider-prev-button,
.trade-measures-slider-prev-button,
.trade-agreements-slider-prev-button,
.temporary-measures-slider-prev-button {
    display: block;
    /*  background: url('../img/back.png') no-repeat;*/
    background: url('../png/slider-prev-arrow.png') no-repeat;
    content: "";
    width: 30px;
    height: 30px;
    margin-right: 4vw;
}


html:lang(ar) #slider-prev-button,
html:lang(ar) .custom-duties-slider-prev-button,
html:lang(ar) .trade-remedy-slider-prev-button,
html:lang(ar) .importer-slider-prev-button,
html:lang(ar) .exporter-slider-prev-button,
html:lang(ar) .product-slider-prev-button,
html:lang(ar) .trade-agreements-slider-prev-button,
html:lang(ar) .country-slider-prev-button,
html:lang(ar) .trade-measures-slider-prev-button,
html:lang(ar) .temporary-measures-slider-prev-button,
#slider-next-button,
div.slider-next-button,
.slick-next-button,
.custom-duties-slider-next-button,
.importer-slider-next-button,
.exporter-slider-next-button,
.product-slider-next-button,
/*#applied-tariffs-country-slider-next-button,*/
.country-slider-next-button,
.trade-measures-slider-next-button,
.trade-agreememts-slider-next-button,
.temporary-measures-slider-next-button {
    display: block;
    /* background: url('../img/next.png') no-repeat;*/
    background: url('../png/slider-next-arrow.png') no-repeat;
    width: 30px;
    height: 30px;
}


/* Styling the default Slick dots */

.slick-dots {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 1rem 0;
    list-style-type: none;
    /* width: auto;*/
    /*flex-flow: wrap;  wrap the dots to the next line if there are too many to fit on the one line*/
}

.slick-dots li {
    margin: 0 1.25rem;
}

.slick-dots li button {
    display: block;
    width: 1.2rem;
    height: 1.2rem;
    padding: 0.6rem;
    border: none;
    border-radius: 100%;
    background-color: #CDD5DD;
    text-indent: -9999px;
}

.slick-dots li.slick-active button {
    background-color: #516B88;
}


.slick-dots li button:before {
    display:none;
}
        
.importer-heading-item, .exporter-heading-item, .product-heading-item, .country-heading-item, .trade-measures-heading-item, .temporary-measures-heading-item {
display: flex;
flex-grow: 1;
flex-direction: row;
justify-content: inherit;
margin-right: 2em;
margin-top: 1em;
}



/*
* RTL support
*/
html:lang(ar) .dataTables_wrapper {
    direction: rtl;
}

html:lang(ar) .dataTables_length {
    float: right;
}

html:lang(ar) .dataTables_filter {
    float: left;
    text-align: left;
}


html:lang(ar) .dataTables_info {
    float: right;
}

html:lang(ar) .dataTables_paginate {
    float: left;
    text-align: left;
}




/* COVID19 trade measures page - paging for the Carousel on small screens  for Arabic! */
html:lang(ar) .trade-measures-heading-item,
html:lang(ar) .temporary-measures-heading-item
{
    margin-right: unset;
}

@media (max-width: 1199px) {
    .tax-module-list .boxes .box {
        width: 50%;
        word-break: break-all;
        padding: 15px 15px 10px;
        margin: 15px auto;
    }
}

@media (max-width: 992px) {
    .tax-module-list .boxes .box {
        padding-top: 40px;
    }
}

@media (max-width: 767px) {
    .tax-module-list .boxes .box {
        width: 100%;
    }
}



/* small phones to 480 px */
@media only screen and (max-width: 480px){


}

/* ------------------Home page - general -----------------*/

.home h3 {
    font-weight: 700;
    font-size: 24px;
    color: #444444;
}

/* ------------------Home about -----------------*/

.home-about {
    background: #F9F9F9;
}

    .home-about .container {
        padding: 80px 15px 110px;
    }

        .home-about .container h3 {
            line-height: 26px;
            margin-bottom: 45px;
            color: #043c76;
        }

    .home-about .txt-introduction p {
        font-size: 17px;
        color: #043c76;
    }

    .home-about .txt-introduction a {
        text-decoration: underline;
    }

    .home-about .usercase {
        display: flex;
        padding: 0 15px;
        /*border: 1px solid red;*/
    }

        .home-about .usercase > img {
            display: block;
            flex: 1 0 186px;
        }


    .home-about .usercase-description {
        margin: 0 0 30px 15px;
        border: 13px solid #fff;
        border-radius: 40px;
        padding: 10px 30px 5px;
        color: #043c76;
        transition: box-shadow 0.2s ease-out;
        box-shadow: 1px 1px 7px rgba(4, 60, 118, 0), inset 1px 1px 10px rgba(4, 60, 118, 0);
        max-width: calc(100% - 201px);
        width: 100%;
        min-height: 186px;
        flex: 1 0 auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .home-about .usercase:last-child .usercase-description {
        margin-bottom: 0;
    }

    .home-about .usercase-description ul {
        list-style-type: none;
        padding-left: 0;
    }

        .home-about .usercase-description ul li {
            text-indent: -25px;
            padding-left: 25px;
        }

            .home-about .usercase-description ul li:before {
                content: "";
                display: inline-block;
                width: 10px;
                height: 10px;
                border: 1px solid #043c76;
                margin-right: 10px;
                box-shadow: 1px 1px 0px #043c76;
            }

/* ------------------ Home Tools - Society -----------------*/
.home-tools-society {
    padding: 100px 0;
}

    .home-tools-society h3 {
        margin-bottom: 60px;
    }

    .home-tools-society h4 {
        display: inline-block;
        vertical-align: middle;
        font-size: 22px;
        line-height: 40px;
        padding-left: 15px;
    }

.block-other-tools .block-content {
    display: flex;
    flex-wrap: wrap;
}

    .block-other-tools .block-content .tool {
        flex-basis: 50%;
        min-height: 130px;
    }

.block-other-tools .tool .img-wrapper {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    overflow: hidden;
}

.block-other-tools .tool.roi .heading,
.block-other-tools .tool.mpi .heading {
    transform: translateX(-10px);
}

.block-other-tools .tool .heading + p,
.block-other-tools .tool .heading + p {
    padding-left: 60px;
}

.block-other-tools .tool.roi .img-wrapper,
.block-other-tools .tool.mpi .img-wrapper {
    width: 50px;
}

    .block-other-tools .tool.roi .img-wrapper img,
    .block-other-tools .tool.mpi .img-wrapper img {
        object-fit: contain;
    }

.block-other-tools .img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.block-other-tools .tool-trade-map .img-wrapper {
    background: #0D9DE7;
}

.block-other-tools .tool-export-map .img-wrapper {
    background: #FDC02F;
}

.block-other-tools .tool-sustainability-map .img-wrapper {
    background: #C91E63;
}

.block-other-tools .tool-procurement-map .img-wrapper {
    background: #630ECB;
}

/* use this only for desktop */
.block-twitter .twitter-timeline {
    height: 510px;
}

@media (max-width: 991px) {
    .block-other-tools .block-content {
        display: block;
    }

    .block-twitter .twitter-timeline {
        width: 100% !important;
    }

    /* when it's responsive, change the height for the twitter timeline to be auto (and not 510px)*/
    .block-twitter .twitter-timeline {
        height: auto;
    }
}

/* ------------------ Footer -----------------*/
footer {
    color: #fff;
}

    footer .lighter {
        background-color: #364454;
        padding: 90px 0 30px;
    }

    footer .darker {
        background-color: #313E4D;
        padding: 20px 0;
        font-size: .875em;
    }

    footer .title {
        font-size: 18px;
        text-transform: uppercase;
        font-weight: 500;
        margin: 0 0 22px 0;
    }

    footer ul {
        margin: 0;
        padding: 0;
    }

        footer ul li {
            list-style: none;
            margin: 0 0 5px 0;
        }

    footer a {
        color: #fff !important;
    }

    footer .block-sponsors a:hover,
    footer .block-sponsors a:focus {
        text-decoration: none;
    }

    footer .block-partners a:hover,
    footer .block-parnters a:focus {
        text-decoration: none;
    }

    footer p {
        color: #fff;
        max-width: 530px;
    }

    footer img {
        margin-bottom: 15px;
        max-width: 540px;
    }

    footer .block-sponsors .title {
        padding-left: 5px;
    }

/*************Autocomplete*********/
.ui-widget-content {
    background: #fff;
    border: 1px solid #a6c9e2;
}

.ui-menu .ui-menu-item {
    line-height: 17px;
    list-style: outside none none;
    margin: 0;
    padding: 5px 10px;
    font-size: 13px;
}

.ui-menu-item:hover {
    background-color: #032B55;
    color: #fff;
    cursor: pointer;
}

.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
    background-color: #032B55;
    color: #fff;
    cursor: pointer;
}

.ui-autocomplete {
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-right: 16px;
    max-width: 550px;
    padding: 0;
}

.ui-helper-hidden-accessible {
    display: none;
}

.ui-widget.ui-widget-content {
    border: 1px solid #c5c5c5;
    z-index: 10;
    text-align: left;
}

.search-box .ui-widget.ui-widget-content {
    position: absolute;
}

/**************** Results page***************/
.container .results-panel {
    display: none;
    padding-bottom: 100px;
}

    .container .results-panel .tab-title {
        padding: 8px 0 30px;
    }

    .container .results-panel .input {
        display: block;
        width: 75%;
        border: 0;
        border-bottom: 1px solid #D2DAE3;
        line-height: 40px;
        position: relative;
        padding: 0 0 0 22px;
        background: url(../svg/dropdown_big.svg) right center no-repeat;
        outline: none;
        color: #032B55;
        font-size: 1.0625em;
        font-weight: 500;
    }

        .container .results-panel .input::before {
            background: url(../svg/product.svg) 0 0 no-repeat;
        }

    .container .results-panel .heading {
        font-style: normal;
        font-weight: 500;
        font-size: 24px;
        line-height: 28px;
        letter-spacing: -0.19px;
        margin: 50px 0 30px;
        /* identical to box height, or 117% */
        /* 80 % */
        color: rgba(36, 36, 36, 0.8);
    }

        .container .results-panel .heading i {
            font-size: 16px;
            display: inline-block;
            position: relative;
            padding: 5px 20px 5px 5px;
            top: -3px;
        }

            .container .results-panel .heading i:hover::after {
                content: attr(data-title);
                display: block;
                position: absolute;
                bottom: 5px;
                left: 35px;
                width: 500px;
                padding: 8px 10px;
                background: #032B55;
                color: #fff;
                font-size: 13px;
                line-height: 18px;
                border-radius: 2px;
                opacity: 0.7;
            }

        .container .results-panel .heading .sub-heading {
            font-size: 15px;
            color: #080808;
            font-weight: 400;
            letter-spacing: -0.19px;
            margin: 10px 0 0 0;
            width: 100%;
        }

            .container .results-panel .heading .sub-heading .txt-product strong,
            .container .results-panel .heading .sub-heading .txt-product em {
                font-style: normal;
            }



    /* so that there isn't a big gap between the Overview section and the custom tariffs section  */


    .container .results-panel .heading1 {
        font-style: normal;
        font-weight: 500;
        font-size: 24px;
        line-height: 28px;
        letter-spacing: -0.19px;
        /*    margin: 50px 0 30px; */
        margin: 50px 0 0px;
        /* identical to box height, or 117% */
        /* 80 % */
        color: rgba(36, 36, 36, 0.8);
    }

        .container .results-panel .heading1 i {
            font-size: 16px;
            display: inline-block;
            position: relative;
            padding: 5px 20px 5px 5px;
            top: -3px;
        }

            .container .results-panel .heading1 i:hover::after {
                content: attr(data-title);
                display: block;
                position: absolute;
                bottom: 5px;
                left: 35px;
                width: 500px;
                padding: 8px 10px;
                background: #032B55;
                color: #fff;
                font-size: 13px;
                line-height: 18px;
                border-radius: 2px;
                opacity: 0.7;
            }

        .container .results-panel .heading1 .sub-heading {
            font-size: 15px;
            color: #080808;
            font-weight: 400;
            letter-spacing: -0.19px;
            margin: 10px 0 0 0;
            width: 100%;
        }

            .container .results-panel .heading1 .sub-heading .txt-product strong,
            .container .results-panel .heading1 .sub-heading .txt-product em {
                font-style: normal;
            }



    .container .results-panel .results .product-label p {
        opacity: 0.85;
        font-weight: 400;
        font-size: 28px;
        color: #080808;
        letter-spacing: -0.19px;
        line-height: 40px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        border: none;
    }

        .container .results-panel .results .product-label p span {
            font-weight: 400;
            font-size: 24px;
            display: inline;
        }

    .container .results-panel .results p {
        border: 1px solid #E3E3E3;
        margin-bottom: 25px;
        opacity: 0.3;
    }

    .container .results-panel .results .pre-heading {
        margin-bottom: 0;
        font-weight: bold;
        font-size: 14px;
        line-height: 36px;
        color: #B5BBC7;
        letter-spacing: 0.7px;
        border: 0;
        text-transform: uppercase;
        opacity: 1;
    }

    .container .results-panel .results table thead {
        background: #ebeef2;
    }

        .container .results-panel .results table thead th {
            font-weight: bold;
            color: #FFF;
            background: #7E96A9;
            letter-spacing: 0.2px;
            line-height: 20px;
            vertical-align: top;
            opacity: 1;
            border: 0;
            font-size: 16px;
        }

/* ADDED*/
.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
    border-collapse: separate;
    border-spacing: 0 0.4em; /* a small gap between each row */
}

.container .results-panel .results table thead th:last-child {
    border-right: 0;
}

.container .results-panel .results table thead th .tooltip-content {
    text-transform: none;
}

.container .results-panel .results table tbody tr.even {
    background: white; /* #FAFAFA;  */
}


.container .results-panel .results table tbody tr td.pink-border-left {
    border-left: 3px solid #E41563;
}
/* for the taxes section of the Query Results page for Arabic ! */
html:lang(ar) .container .results-panel .results table tbody tr td.pink-border-left {
    border-right: 3px solid #E41563;
    border-left: none;
}

.container .results-panel .results table tbody tr td.purple-border-left {
    border-left: 3px solid #a915e4;
}
/* for the taxes section of the Query Results page for Arabic ! */
html:lang(ar) .container .results-panel .results table tbody tr td.purple-border-left {
    border-right: 3px solid #a915e4;
    border-left: none;
}

.container .results-panel .results table tbody tr td.green-border-left {
    border-left: 3px solid #34b67a;
}
/* for the taxes section of the Query Results page for Arabic ! */
html:lang(ar) .container .results-panel .results table tbody tr td.green-border-left {
    border-right: 3px solid #34b67a;
    border-left: none;
}

/* for the exclamation column of the tax module*/
.container .results-panel .results table tbody tr td.blank {
    position: absolute;
    background: #fff;
    bottom: 0;
    right: 0;
    width: 105%;
    height: 105%;
    box-shadow:none;
}
html:lang(ar) .container .results-panel .results table tbody tr td.blank {
    left: 0;
    right:unset;
}

.oflow {
    position: absolute;
    background: #fff;
    bottom: -5px;
    right: 0;
    width: 125%;
    height: 135%;
}

/* for the taxes section of the Query Results page, so that we can show the blue border on the right hand side for Arabic ! */
html:lang(ar) .oflow {
    left: 0;
    right: unset;
}

.oflow2 {
    position: absolute;
    background: #fff;
    right: 6px;
    width: 125%;
    height: 135%;
    top: -1px;
    z-index: 11;
}

html:lang(ar) .oflow2 {
    left: 6px;
    right:unset;
}

.exclamation-icon {
    background-image: url(../png/exclamation-icon.png);
    display: inline-flex;
    width: 15px;
    height: 15px;
}


/* for the taxes section of the Query Results page - blue border */
.container .results-panel .results table tbody tr td.blue-border-left {
    border-left: 3px solid #08AAEE;
}

/* for the taxes section of the Query Results page, so that we can show the blue border on the right hand side for Arabic ! */
html:lang(ar) .container .results-panel .results table tbody tr td.blue-border-left {
    border-right: 3px solid #08AAEE;
    border-left: none;
}


.container .results-panel .results table tbody tr:hover {
    background: #F8F8F8;
    /*  background: rgba(6, 43, 85, 0.1);  */
    border: 1px solid #EDEDED;
    box-sizing: border-box;
    border-radius: 3px;
}



.container .results-panel .results table tbody tr td {
    line-height: 22px;
    vertical-align: top;
    position: relative;
    border: 0;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    /* identical to box height, or 119% */
    /* Dark Blue */
    color: #041B35;
}

.container .results-panel .results table tbody tr td.bold {
    font-weight: 500;
}

.container .results-panel .results table tbody tr.expanded {
    font-weight: 500;
}


.container .results-panel .results table tbody tr.table-toggle-list {
    transition: background 0.2s ease-out, color 0.2s ease-out;
    background: white(167, 166, 166);
    border: 1px solid #EDEDED;
    box-sizing: border-box;
    /* Raws */
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);
    border-radius: 3px;
}

.container .results-panel .results table tbody tr.table-toggle-list.expanded {
background: #002060;
color: #FFF;
}

.container .results-panel .results table tbody tr.table-toggle-list.expanded .toggle,
.container .results-panel .results table tbody tr.table-toggle-list.expanded a {
color: #FFF;
border-top-color: #FFF;
}

.container .results-panel .results table tbody tr.table-toggle-list.expanded a:hover {
    color: #FFF !important;
}

.box-shadow-me {
    transition: background 0.2s ease-out, color 0.2s ease-out;
    background: white(167, 166, 166);
    border: 1px solid #EDEDED;
    box-sizing: border-box;
    /* Raws */
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);
    border-radius: 3px;
}
.container .results-panel .results table tbody tr.trade-remedy-company td {
    padding-top: 0;
}

.container .results-panel .results table tbody tr td .ntm-title {
    font-weight: 500;
}

.container .results-panel .results table tbody tr td i {
    font-size: 16px;
    width: 20px;
    text-align: center;
    vertical-align: text-bottom;
}
/* for the right angle icon to be slightly larger */
#tax-results table {
    width: 100%;
    table-layout: fixed;
    overflow-wrap: break-word;
}
#tax-results .ntlc-select {
    width: 100%;
    border: 0;
    padding: 0;
}
#tax-results table tbody tr td span i {
    font-size: 24px;
    width: 20px;
    text-align: center;
    vertical-align: text-bottom;
}

/* for the exclamation mark fa icon to be larger for the tax results section*/
#tax-results table tbody tr td .tooltip-wrapper i {
    font-size: 24px;
    width: 20px;
    text-align: center;
    vertical-align: text-bottom;
}
/* for the right angle icon to be slightly larger */
#trade-remedy tbody tr td span i {
    font-size: 24px;
    width: 20px;
    text-align: center;
    vertical-align: text-bottom;
}
/* for the right angle icon to be slightly larger */
#custom-duties-results table tbody tr td span i {
    font-size: 24px;
    width: 20px;
    text-align: center;
    vertical-align: text-bottom;
}

.fa-exclamation-circle {
    color: #929CA7; /* pink */

}

.container .results-panel .results table tbody tr td .expand {
    position: relative;
    vertical-align: middle;
    display: inline-block;
    width: auto;
    margin-left: 0;
    margin-right: 4px;
    margin-left: 10px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    cursor: pointer;
    transform: rotate(0deg);
    transition: all 0.2s ease-out;
    margin-top: 6px;
    margin-left: 10px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 10px solid #002060;
}

    .container .results-panel .results table tbody tr td .expand.expanded {
        transform: rotate(180deg);
    }


/* for the trade remedies table arrow right and arrow up */
.container .results-panel .results table tbody tr td span.expand.pull-right {
    /* color: #929CA7 - light grey ; */
    position: relative;
    /* vertical-align: middle; */
    /* display: inline-block; */
    width: auto;
    margin-left: 0;
    margin-right: 0px;
    margin-left: 0px;
    cursor: pointer;
    transform: none;
    transition: all 0.2s ease-out;
    margin-top: 0px;
    margin-left: 0px;

    border: none;
}

.container .results-panel .results table tbody tr td span.expand.expanded.pull-right {
    color: #929CA7;
}

.container .results-panel .results table tbody tr td .ntm-summary {
    margin-top: 8px;
}

.container .results-panel .results table tfoot td {
    font-size: 15px;
    color: #929CA7;
    line-height: 20px;
    border: 0;
    border-top: 2px solid #dee4ea;
}

    .container .results-panel .results table tfoot td.table-source {
        text-align: right
    }

.container .results-panel .results table tbody tr.expand-content {
    display: none;
    font-size: 14px;
}

    .container .results-panel .results table tbody tr.expand-content th {
        font-weight: 500;
        font-size: 13px;
        text-transform: none;
    }

    .container .results-panel .results table tbody tr.expand-content td {
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 13px;
        background: #f9f9f9;
    }

    .container .results-panel .results table tbody tr.expand-content > td {
        padding: 0;
        border-bottom: 2px solid #dee4ea;
        background: #fff;
    }


.container .results-panel .results table.inside-table thead {
    background: transparent;
}

.results-message {
    display: inline-block;
    margin-left: 20px;
}



/* for the bootstrap tooltip inside the Custom Tariff Overview box to show up */

.container .results-panel .tooltip-wrapper {
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
    letter-spacing: -0.19px;
    /*   margin: 50px 0 30px; */
    color: rgba(36, 36, 36, 0.8);
}

.container .results-panel .tooltip-wrapper i {
font-size: 16px;
display: inline-block;
position: relative;
padding: 5px 20px 5px 5px;
top: -3px;
}

.container .results-panel .tooltip-wrapper i:hover::after {
    content: attr(data-title);
    display: block;
    position: absolute;
    bottom: 5px;
    left: 35px;
    width: 500px;
    padding: 8px 10px;
    background: #032B55;
    color: #fff;
    font-size: 13px;
    line-height: 18px;
    border-radius: 2px;
    opacity: 0.7;
}

.title-text-bold {
    font-style: normal;
    font-weight: bold;
    font-size: 15px; /* 14px;*/
    line-height: 130%; /*16px; */
    /* identical to box height, or 114% */
    /* 70 % */
    color: rgba(6, 43, 85, 0.7);
}

.title-text-info {
    color: #043c76;
}

.some-page-wrapper {
    margin: 15px;
    background-color: red;
}

.some-page-wrapper .row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
}

.some-page-wrapper .column {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
}

.some-page-wrapper .blue-column {
    background-color: blue;
    height: 100px;
}

.some-page-wrapper .green-column {
    background-color: green;
    height: 100px;
}


.tax-rate-wrapper {
    margin: 0 0 0 15px; /* 20px; */
    background-color: white;
    width: -webkit-fill-available;
}

    .tax-rate-wrapper .row {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
    }

        .tax-rate-wrapper .row .column {
            display: flex;
            flex-direction: column;
            flex-basis: 100%;
            flex: 1;
        }

            .tax-rate-wrapper .row .column.wide {
                display: flex;
                flex-direction: column;
                flex-basis: 100%;
                flex: 1;
                flex-grow: 4;
            }

            .tax-rate-wrapper .row .column.indent {
                display: flex;
                flex-direction: column;
                flex-basis: 100%;
                flex: 1;
                flex-grow: 4;
                margin-left: 40px
            }

            .tax-rate-wrapper .row .column.indentx2 {
                display: flex;
                flex-direction: column;
                flex-basis: 100%;
                flex: 1;
                flex-grow: 4;
                margin-left: 80px
            }

            .tax-rate-wrapper .row .column.right {
                text-align: end;
                display: contents;
            }


.tax-rate-wrapperW .blue-column {
    background-color: blue;
    height: 100px;
}

.tax-rate-wrapper .green-column {
    background-color: green;
    height: 100px;
}

.tax-rate-wrapper .row .column-full-justified hr {
    margin: 0;
    align-self: stretch;
    min-height: 1px;
    margin-left: 0;
    margin-right: 0;
}


.tax-modal-text {
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 19px;
    /* or 106% */
    text-align: left;
    /* 80 % */
    color: rgba(6, 43, 85, 0.8);
}


hr {
    margin-left: 0;
    margin-right: 0;
}

.modal-header-wrapper {
    display: flex;
    align-items: start;
    text-align: justify;
}


    .modal-header-wrapper .row {
        display: flex;
        flex-direction: inherit;
        flex-wrap: wrap;
        width: 100%;
        align-items: flex-end;
        align-content: space-around;
        flex-grow: 1;
        padding-top: 10px;
    }

        .modal-header-wrapper .row .column {
            /* display: flex; */
            display: inline-block;
            flex-direction: column;
            flex-basis: 100%;
            flex: 1;
        }


            .modal-header-wrapper .row .column.right {
                /* display: flex; */
                display: inline-block;
                flex-direction: column;
                flex-basis: 100%;
                flex: 1;
                text-align: right;
            }

.overview-message {
    display: inline-block;
    margin-left: 5px;
}

.overview-page-wrapper {
    margin: 15px;
}



/*remove the margin for overview page wrapper in Compare pages for Arabic ! */
html:lang(ar) .overview-page-wrapper {
    margin: 0;
}

/* need this for the Overview summary wrapper of taxes section in the Query results page, under the taxes-fees-charges-heading for Arabic ! */
html:lang(ar) #taxes-fees-charges-heading .overview-page-wrapper {
    margin-right: 15px;
}

.overview-message-data {
    margin-left: 40px;
    /* color: #043c76; 
    font-size: small; */
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 130%;
    /* or 19px */
    /* Dark Blue */
    color: #041B35;
    /* text-overflow: ellipsis;  */
}



/* overview-message overview-message-data overflow-ellipsis expandM  */
.expand {
    border: 1px solid green;
    height: 1.5em;
    padding: 2px;
    /*  white-space: nowrap;   */
    width: 800px;
    width: fit-content;
    overflow: hidden;
    text-overflow: ellipsis;
}

.expanded-row-content {
    border-top: none;
    display: grid;
    grid-column: 1/-1;
    justify-content: flex-start;
    color: #AEB1B3;
    font-size: 13px;
    background-color: #fff;
}

.hide-row {
    display: none;
}

.expandMe {
    border: 0px solid white;
    height: 1em;
    padding: 0px;
    overflow: hidden;
}




.hidden {
    display: none;
}


.overflow-ellipsis {
    text-overflow: ellipsis;
}


.overview-page-wrapper .row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
}

.overview-page-wrapper .column {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
}


.overview-page-wrapper .column-full-justified {
    display: flex;
    justify-content: space-between;
}


    .overview-page-wrapper .column-full-justified .first-column {
        display: inline-block;
    }


    .overview-page-wrapper .column-full-justified .second-column {
        display: inline-block;
        align-self: flex-end
    }



.overview-page-wrapper .legend-column {
    display: inline-block;
    align-self: flex-end
}





    /* Create two unequal columns that floats next to each other */
    .overview-page-wrapper .legend-column .row {
        float: right; /* was left */
        padding: 0px;
        align-items: center;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 120%; /* was 100% */
    }



    .overview-page-wrapper .legend-column .column {
        float: left;
        padding: 0px;
    }

    .overview-page-wrapper .legend-column .left {
        align-items: center; /* flex-end; */
    }

    .overview-page-wrapper .legend-column .right {
        width: auto;
    }

    /* Clear floats after the columns */
    .overview-page-wrapper .legend-column .row:after {
        content: "";
        display: table;
        clear: both;
    }



.overview-page-wrapper .legend-column .column h4
{
    font-style: normal;
    font-weight: 500;
    font-size:  15px;
    color: #516B88;
}

/* For the Title of the Modal pop up - custom tariffs, tax etc*/
.details-title > h3,
#tax-slider-heading h4,
#custom-duties-slider-heading h4,
.ctn h3,
#trade-agreements-slider-heading h4{
    font-style: normal;
    font-weight: 500;
    font-size: 1.5rem;
    color: #516B88;
}

.info-text {
    font-style: normal;
    font-weight: 500;
    font-size: 1.6rem;
    color: #041B35; /* dark grey*/
    line-height: 1.9rem; /* 19px*/
}

.overview-page-wrapper .row .column .full-width {
    /* background-color: green; */
    /*  width: autofill; */
}

/*   14th DEC */
.collapsible {
    background-color: white; /*  #777  violet*/
    color: white;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
}

/* For Arabic - rows that collapse eg. on the Query Results page for the Custom Tariffs section, align the text to the right */
html:lang(ar) .collapsible {
    text-align: right;
}

.active, .collapsible:hover {
    /*    background-color: #555;  */
}

.table-toggle-list.content {
    padding: 0 18px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    background-color: #f1f1f1;
}

tr.header {
    cursor: pointer;
}

.header .sign:after {
    content: "+";
    display: inline-block;
}

.header.expand .sign:after {
    content: "-";
}

.collapse-row.collapsed + tr { /* + tr */
    display: none;
}

.hidden-row {
    display: none;
}

.hiddenRow {
    padding: 0 !important;
}



.tab-title {
    font-weight: 700;
    font-size: 18px;
    color: #333;
    line-height: 22px;
    padding: 8px 20px 30px;
}


.container .results-panel .results table tbody tr td {
    line-height: 22px;
    vertical-align: top;
    position: relative;
    border: 0;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    color: #041B35;
}


#custom-duties-results > table > tbody > tr.table-toggle-list.expanded > td {
    color: #032B55;
}

.tax-row-info {
    background: #FFFFFF;
    border: 1px solid #EDEDED;
    box-sizing: border-box;
    /* Raws */
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);
    border-radius: 3px;
    padding: 30px;
}




.more-data-container {
    background: #FFFFFF;
    border: 1px solid #EDEDED;
    box-sizing: border-box;
    /* Raws */
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);
    border-radius: 3px;
    padding: 30px;
}

.more-data-container .more-data-container-header {
display: flex;
align-items: flex-end;
align-content: space-around;
padding: 20px;
background: white; /* #EBEEF2; */
align-items: center;
border-bottom: 2px solid #dee4ea;
padding-bottom: 12px;
}



.more-data-container .more-data-container-header .more-data-heading {
    flex-grow: 1;
    display: inline-flex;
    align-self: auto;
    border: 0;
    color: #041B35;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    text-align: center;
    border-bottom: solid 1px;
    border-bottom-color: rgba(6, 43, 85, 0.2);
    border-bottom-left-radius: 1px;
    border-bottom-right-radius: 1px;
    padding-bottom: 12px;
}


    .more-data-container .more-data-container-header .more-data-heading.selected {
        flex-grow: 1;
        display: inline-flex;
        align-self: auto;
        border: 0;
        color: #041B35;
        font-style: normal;
        font-weight: bold;
        font-size: 13px;
        line-height: 16px;
        text-align: center;
        border-bottom: solid 1px;
        /*border-bottom-width: 59%; */
        border-bottom-width: 1px;
        border-bottom-color: red; /* rgba(6, 43, 85, 0.2);  */
        border-bottom-left-radius: 1px;
        border-bottom-right-radius: 1px;
    }

    .more-data-container .more-data-container-header .more-data-heading:hover:after {
        width: 50%;
        left: 0;
        background: red;
    }
   /* .more-data-container .tax-detail-panels .js-tax-detail-panel {
        display: none;
    }
    .more-data-container .tax-detail-panels .js-tax-detail-panel.selected {
        display: block !important;
    }*/

    .more-data-container .column h5 {
      
    font-size: 1.25em;
}
    
.tax-info-data-menu {
    /* position: absolute;  */
    display: flex;
    align-items: flex-end;
    align-content: space-around;
    padding: 15px; /* revert;  */
    color: #041B35;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    text-align: center;
}

    .tax-info-data-menu li {
        flex-grow: 1;
        display: inline-flex;
        align-self: auto;
        border: 1px;
        color: rgba(6, 43, 85, 0.7);
        font-style: normal;
        font-weight: bold;
        font-size: 13px;
        line-height: 16px;
        /* or 123% */
        text-align: center;
        border-bottom: solid 1px;
        border-bottom-color: rgba(6, 43, 85, 0.2);
        border-bottom-left-radius: 1px;
        border-bottom-right-radius: 1px;
    }




    .tax-info-data-menu a {
        font-style: normal;
        text-decoration: none;
        font-weight: bold;
        font-size: 13px;
        line-height: 16px;
        /* or 123% */
        text-align: center;
        /* 70 % */
        color: rgba(6, 43, 85, 0.7);
        cursor: pointer;
    }


        .tax-info-data-menu a:hover {
            font-weight: 800;
            color: #041B35;
            cursor: pointer;
        }


    .tax-info-data-menu .selected {
        color: #062B55; /*  #041B35; */
        font-style: normal;
        font-weight: bold;
        font-size: 13px;
        line-height: 16px;
        text-align: center;
        border-bottom: solid 1px;
        border-bottom-color: red;
        border-bottom-left-radius: 1px;
        border-bottom-right-radius: 1px;
        cursor: pointer;
    }


.responsive-tax-info-data-menu .selected {
    color: #062B55; /*  #041B35; */
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    text-align: center;
    border-bottom: solid 1px;
    border-bottom-color: red;
    border-bottom-left-radius: 1px;
    border-bottom-right-radius: 1px;
}




.tax-info-data-menu a:active {
    color: #062B55; /*  #041B35; */
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    text-align: center;
    border-bottom: solid 1px;
    border-bottom-color: red;
    border-bottom-left-radius: 1px;
    border-bottom-right-radius: 1px;
}



.tax-info-data-menu a:active {
    background-color: #dee4ea; /* yellow;  */
}



.more-data-container .more-data-container-header > span.active {
    flex-grow: 1;
    display: block;
    align-self: auto;
    border: 0;
    color: #041B35;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    text-align: center;
}




.more-data-container .more-data-container-header > span {
    flex-grow: 1;
    display: block;
    align-self: auto;
    border: 0;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    /* or 123% */
    text-align: center;
    /* 70 % */
    padding: 15px;
    color: rgba(6, 43, 85, 0.7);
}





.more-data-container .more-data-container-info-section {
    display: flex;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    /* or 123% */
    text-align: left;
    /* 70 % */
    color: rgba(6, 43, 85, 0.7);
}

html:lang(ar) .more-data-container .more-data-container-info-section {
    text-align: right;
}

.more-data-container .more-data-container-info-section .column {
    flex: 50%;
    padding: 0 0 0 15px;
}

/* for the padding so the light grey vertical line between the two columns is not right up to the text for Arabic ! */
html:lang(ar) .more-data-container .more-data-container-info-section .column {
    flex: 50%;
    padding: 0 15px 0 0;
}

.more-data-container .more-data-container-info-section .column.left {
flex: 50%;
padding: 0 0 0 15px;
}


html:lang(ar) .more-data-container .more-data-container-info-section .column.left {
    flex: 50%;
    padding: 0 15px 0 0;
}


.more-data-container .more-data-container-info-section .column.left-border {
    border-color: rgba(6, 43, 85, 0.2);
    border-left-style: solid;
    border-left-width: 1px;
    /*  background: rgba(6, 43, 85, 0.2);  */
    border-radius: 1px;
}

html:lang(ar) .more-data-container .more-data-container-info-section .column.left-border {
    border-color: rgba(6, 43, 85, 0.2);
    border-right-style: solid;
    border-right-width: 1px;
    border-radius: 1px;
    border-left-style: none;
    border-left-width: 0;
}


.more-data-container .more-data-container-info-section .column h2 {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    /* identical to box height, or 117% */
    text-align: left;
    /* 80 % */
    color: rgba(36, 36, 36, 0.8);
}

html:lang(ar) .more-data-container .more-data-container-info-section .column h2 {
    text-align: right;
}

.more-data-container .more-data-container-info-section .column h3, div.trade-remedy-details-responsive > h3 {
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 16px;
    /* identical to box height, or 114% */
    /* 70 % */
    color: rgba(6, 43, 85, 0.7);
}


.more-data-container .more-data-container-info-section .column h4 {
    font-style: normal;
    font-weight: bold;
    font-size: 12px;
    line-height: 16px;
    /* identical to box height, or 133% */
    /* 70 % */
    color: rgba(6, 43, 85, 0.7);
}


.more-data-container .more-data-container-info-section .column h5 {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    /* identical to box height, or 119% */
    /* Dark Blue */
    color: #041B35;
}


.btn .btn-tax {
    width: 140px;
    padding: 20px;
    bottom: 150px;
    z-index: 9999;
    font-size: 15px;
    position: absolute;
    margin: 0 auto;
}

.right-dark-arrow-expanded {
    background-image: url(../png/down-dark.png);
    border-radius: 0px;
    border: 0px;
    border-radius: 0px;
    border: 0px;
    width: 30px;
    height: 30px;
}

.right-dark-arrow-collapsed {
    background-image: url(../png/right-dark.png);
    border-radius: 0px;
    border: 0px;
    width: 30px;
    height: 30px;
}


tr[aria-expanded=true] .fa-angle-right {
    display: none;
}

tr[aria-expanded=false] .fa-angle-up {
    display: none;
}





#tax-results tr:not([class*="collapsed"]) .fa-angle-right {
    display: none;
}


html:lang(ar) #tax-results tr:not([class*="collapsed"]) .fa-angle-left {
    display: none;
}

#tax-results tr:not([class*="collapsed"]) .fa-angle-up {
    display: block;
}

#custom-duties-results a:not([class*="less"]) .fa-angle-right {
    display: block;
}

html:lang(ar)  #custom-duties-results a:not([class*="less"]) .fa-angle-left {
    display: block;
}

#custom-duties-results a:not([class*="less"]) .fa-angle-up {
    display: none ;
}

#custom-duties-results a.less .fa-angle-right {
    display: none;
}


/*for the trade remdies table, the right angle arrow and the up arrow on row expand / collapse */

#trade-remedy tr[class*="expanded"] .fa-angle-right {
    display: none;
}

.container .results-panel .input {
    display: block;
    width: 75%;
    border: 0;
    border-bottom: 1px solid #D2DAE3;
    line-height: 40px;
    position: relative;
    padding: 0 0 0 22px;
    background: url(../svg/dropdown_big.svg) right center no-repeat;
    outline: none;
    color: #032B55;
    font-size: 1.0625em;
    font-weight: 500;
}

    .container .results-panel .input::before {
        background: url(../svg/product.svg) 0 0 no-repeat;
    }

.container .results-panel .heading {
    font-size: 2.4rem; /* 2.4rem is about 24px computed, which matches the Figma prototype for desktop and mobile. The font-size was previously 32px; */
    color: #080808;
    letter-spacing: -0.19px;
    margin: 50px 0 30px;
}

    .container .results-panel .heading i {
        font-size: 16px;
        display: inline-block;
        position: relative;
        padding: 5px 20px 5px 5px;
        top: -3px;
    }

        .container .results-panel .heading i:hover::after {
            content: attr(data-title);
            display: block;
            position: absolute;
            bottom: 5px;
            left: 35px;
            width: 500px;
            padding: 8px 10px;
            background: #032B55;
            color: #fff;
            font-size: 13px;
            line-height: 18px;
            border-radius: 2px;
            opacity: 0.7;
        }

    .container .results-panel .heading .sub-heading {
        font-size: 15px;
        color: #080808;
        font-weight: 400;
        letter-spacing: -0.19px;
        margin: 10px 0 0 0;
        width: 100%;
    }

        .container .results-panel .heading .sub-heading .txt-product strong,
        .container .results-panel .heading .sub-heading .txt-product em {
            font-style: normal;
        }

.container .results-panel .results .product-label p {
    opacity: 0.85;
    font-weight: 400;
    font-size: 28px;
    color: #080808;
    letter-spacing: -0.19px;
    line-height: 40px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border: none;
}

    .container .results-panel .results .product-label p span {
        font-weight: 400;
        font-size: 24px;
        display: inline;
    }

.container .results-panel .results p {
    border: 1px solid #E3E3E3;
    margin-bottom: 25px;
    opacity: 0.3;
}

.container .results-panel .results .pre-heading {
    margin-bottom: 0;
    font-weight: bold;
    font-size: 14px;
    line-height: 36px;
    color: #B5BBC7;
    letter-spacing: 0.7px;
    border: 0;
    text-transform: uppercase;
    opacity: 1;
}

.container .results-panel .results table thead {
    background: #ebeef2;
}

    .container .results-panel .results table thead th {
        font-weight: bold;
        color: #FFF;
        background: #7E96A9;
        letter-spacing: 0.2px;
        line-height: 20px;
        vertical-align: top;
        opacity: 1;
        border: 0;
        font-size: 16px;
    }

        .container .results-panel .results table thead th:last-child {
            border-right: 0;
        }

        .container .results-panel .results table thead th .tooltip-content {
            text-transform: none;
        }

.container .results-panel .results table tbody tr.even {
    background: #FAFAFA;
}

.container .results-panel .results table tbody tr td {
    line-height: 22px;
    vertical-align: top;
    position: relative;
    border: 0;
    font-size: 14px;
}

    .container .results-panel .results table tbody tr td.bold {
        font-weight: 500;
    }

.container .results-panel .results table tbody tr.expanded {
    font-weight: 500;
}

.container .results-panel .results table tbody tr.table-toggle-list {
    transition: background 0.2s ease-out, color 0.2s ease-out;
}

    .container .results-panel .results table tbody tr.table-toggle-list.expanded {
        background: #002060;
        color: #FFF;
    }
#custom-duties-results table tbody tr.table-toggle-list.expanded {
    color: #043c76 !important;
    background-color: #e0dfdf;
}

.container .results-panel .results table tbody tr.table-toggle-list.expanded .toggle,
.container .results-panel .results table tbody tr.table-toggle-list.expanded a {
    color: #032B55;
    border-top-color: #FFF;
}

#custom-duties-results table tbody tr.table-toggle-list.expanded .toggle {
    color: #032B55;
    border-top-color: #032B55;
}
.container .results-panel .results table tbody tr.table-toggle-list.expanded a:hover {
    color: #FFF!important;
}

#custom-duties-results table tbody tr.table-toggle-list.expanded a:hover {
    color: #032B55 !important;
}
/*Quota results table*/
#custom-duties-results table tbody tr.table-toggle-list.expanded a:hover {
    color: #032B55 !important; 
}
.container .results-panel .results table tbody tr.trade-remedy-company td {
    padding-top: 0;
}

.container .results-panel .results table tbody tr td .ntm-title {
    font-weight: 500;
}

.container .results-panel .results table tbody tr td i {
    font-size: 16px;
    width: 20px;
    text-align: center;
    vertical-align: text-bottom;
}

.container .results-panel .results table tbody tr td .expand {
    position: relative;
    vertical-align: middle;
    display: inline-block;
    width: auto;
    margin-left: 0;
    margin-right: 4px;
    margin-left: 10px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    cursor: pointer;
    transform: rotate(0deg);
    transition: all 0.2s ease-out;
    margin-top: 6px;
    margin-left: 10px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 10px solid #002060;
}

    .container .results-panel .results table tbody tr td .expand.expanded {
        transform: rotate(180deg);
    }

.container .results-panel .results table tbody tr td .ntm-summary {
    margin-top: 8px;
}


.container .results-panel .results table tfoot td {
    font-size: 15px;
    color: #929CA7;
    line-height: 20px;
    border: 0;
    border-top: 2px solid #dee4ea;
}

    .container .results-panel .results table tfoot td.table-source {
        text-align: right
    }

.container .results-panel .results table tbody tr.expand-content {
    display: none;
    font-size: 14px;
}

    .container .results-panel .results table tbody tr.expand-content th {
        font-weight: 500;
        font-size: 13px;
        text-transform: none;
    }

    .container .results-panel .results table tbody tr.expand-content td {
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 13px;
        background: #f9f9f9;
    }


    .container .results-panel .results table tbody tr.expand-content > td {
        padding: 0;
        border-bottom: 2px solid #dee4ea;
        background: #fff;
    }



.container .results-panel .results table.inside-table thead {
    background: transparent;
}

.results-message {
    display: inline-block;
    margin-left: 20px;
}


#trade-remedy tr:not([class*="expanded"]) .fa-angle-up {
    display: none;
}





.nav > li > a.col-vis {
    padding: 8px 20px;
    border: 1px solid #dee4ea;
    border-radius: 2px;
    background: transparent !important;
    font-size: 14px;
    text-transform: uppercase;
}

    .nav > li > a.col-vis:hover {
        border-color: #032B55;
    }

.nav > li.col-vis-ctn {
    display: flex;
}

.nav > li > a img {
    display: inline-block;
    margin-right: 5px;
}

/* align to the right for Arabic! */
/* in Compare Competitors for the tabs Table, Map etc */
html:lang(ar) .nav {
    padding-right: 0;
}


.table-top {
    padding: 20px;
    background: #EBEEF2;
    display: flex;
    align-items: center;
    border-bottom: 2px solid #dee4ea;
}

    .table-top > div {
        flex-grow: 1;
    }

    .table-top .dataTables_filter {
        text-align: right;
    }

    /*  Aligning the search textbox for data availability to be on the far left side of the table - for Arabic!*/
html:lang(ar) .table-top .dataTables_filter {
    text-align: left;
}

        .table-top .dataTables_filter label {
            margin: 0;
        }

        .table-top .dataTables_filter input {
            display: inline-block;
            width: 250px;
            border-radius: 2px;
            border: 1px solid #dee4ea;
            margin-left: 10px;
            height: 35px;
            box-shadow: none;
        }

/* Compare pages - have a gap between the label and the search box for Arabic ! */
html:lang(ar) .table-top .dataTables_filter input {
    margin-left: unset;
    margin-right: 10px;
}



.table-bottom {
    padding: 20px;
    display: flex;
    align-items: center;
    border-top: 2px solid #dee4ea;
}

    .table-bottom > div {
        flex-grow: 1;
    }

    .table-bottom .dataTables_length {
        margin-right: 50px;
    }

    .table-bottom .dataTables_paginate {
        text-align: right;
    }

    .table-bottom .pagination > li > a,
    .table-bottom .pagination > li > span {
        border: 0;
        border-radius: 0;
        color: #032B55;
        font-weight: 400;
    }

    .table-bottom .pagination > .active > a,
    .table-bottom .pagination > .active > span,
    .table-bottom .pagination > .active > a:hover,
    .table-bottom .pagination > .active > span:hover,
    .table-bottom .pagination > .active > a:focus,
    .table-bottom .pagination > .active > span:focus {
        background: transparent;
        font-weight: 700;
        color: #032B55;
    }

.compare-table {
    position: relative;
}

#toggle-col-vis {
    position: absolute;
    width: 315px;
    background-color: #fff;
    z-index: 9999;
    right: 1px;
    top: 1px;
    font-size: 14px;
    color: #032B55;
    letter-spacing: 0.1px;
    line-height: 24px;
    padding: 20px 0 20px 30px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
}

/* Compare pages - filters drop down list, for Arabic ! */
html:lang(ar) #toggle-col-vis {
    left: 0;
    right: unset;
    width: 450px; /*fit-content;*/
    padding: 20px;
}

    #toggle-col-vis span {
        font-weight: 700;
        font-size: 18px;
        color: #333333;
        line-height: 36px;
        text-transform: uppercase;
    }

        #toggle-col-vis span.badge {
            display: inline-block;
            min-width: 10px;
            padding: 3px 7px;
            font-size: 12px;
            font-weight: 700;
            line-height: 1;
            color: #fff;
            text-align: center;
            white-space: nowrap;
            vertical-align: baseline;
            background-color: red;
            border-radius: 10px;
        }

    #toggle-col-vis > ul {
        list-style-type: none;
        padding: 0;
        margin: 0;
    }
        #toggle-col-vis > ul li {
            vertical-align: text-top;
            padding: 0 0 0 30px;
            cursor: pointer;
            text-transform: uppercase;
        }
        /* Compare pages - filters drop down list, for Arabic ! */
        html:lang(ar) #toggle-col-vis > ul li {
            padding: 0 30px 0 0px
        }
            #toggle-col-vis > ul li a {
                color: #032B55;
            }

            #toggle-col-vis > ul li.checked {
                background: url(../svg/checkbox_checked.svg) 0 0 no-repeat;
            }

            /* Compare pages - check box - checked in the filters drop down list, for Arabic ! */
            html:lang(ar) #toggle-col-vis > ul li.checked {
                background: url(../svg/checkbox_checked.svg) 390px no-repeat;
            }

            #toggle-col-vis > ul li.unchecked {
                background: url(../svg/checkbox.svg) 0 0 no-repeat;
            }

            /* Compare pages - check box - checked in the filters drop down list, for Arabic ! */
            html:lang(ar) #toggle-col-vis > ul li.unchecked {
                background: url(../svg/checkbox.svg) 390px no-repeat;
            }

table.dataTable thead th:focus {
    outline: 0;
}

table.dataTable thead .col-vis,
table.dataTable thead .sorting,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc {
    background-image: none;
    position: relative;
    cursor: pointer;
}

table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc {
    padding-right: 35px !important;
}


    table.dataTable thead .sorting_asc:not(.col-vis):after,
    table.dataTable thead .sorting_desc:not(.col-vis):after {
        content: '';
        width: 17px;
        height: 10px;
        display: block;
        position: absolute;
        right: 10px;
        top: 14px;
    }

    table.dataTable thead .sorting_asc:not(.col-vis):after {
        background-image: url('../svg/sort.svg');
        transform: scaleY(-1);
    }

    table.dataTable thead .sorting_desc:not(.col-vis):after {
        background-image: url('../svg/sort.svg');
    }

#chart-view {
    position: relative;
    /*  padding: 15px 20px 0;   - maps has a gap??*/
    background: #FAFAFA;
}

.page-compare-competitor #chart-view:before,
.page-compare-market #chart-view:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    background: #7E96A9;
    z-index: 1;
}

.container .results-panel .results .detail-link,
.container .results-panel .results .quota-link {
    cursor: pointer;
    vertical-align: text-top;
}

    .container .results-panel .results .detail-link:hover,
    .container .results-panel .results .quota-link:hover {
        text-decoration: none;
    }

    .container .results-panel .results .detail-link span,
    .container .results-panel .results .quota-link span {
        font-weight: 500;
        font-size: 16px;
        color: #032B55;
        line-height: 20px;
        display: inline-block;
    }

.ntm-summary-detail-result .inner-table thead tr {
    background: #FFF !important;
}

    .ntm-summary-detail-result .inner-table thead tr th {
        font-size: 15px !important;
        font-weight: 500 !important;
        text-transform: none !important;
        padding: 10px;
        vertical-align: text-top !important;
    }

    .ntm-summary-detail-result .inner-table thead tr td {
        font-size: 15px !important;
        font-weight: 500 !important;
    }

table.req-table {
    border-bottom: 1px solid #0179AD;
    width: 100%;
}

    table.req-table tbody tr td {
        font-size: 14px !important;
        font-weight: 400 !important;
        padding: 10px !important;
    }

    table.req-table tbody tr {
        background: #fff !important;
    }

        table.req-table tbody tr.req-heading {
            border-bottom: 2px solid #0179AD;
        }

.agreement-detail {
    display: flex;
}

    .agreement-detail.loading {
        position: relative;
        height: 40px;
        overflow: hidden;
    }

        .agreement-detail.loading:before {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 1;
            background: #fff url("../gif/itc-loading.gif") no-repeat;
            background-position: center center;
        }

    .agreement-detail .title {
        position: relative;
        margin: 0;
        padding: 5px 15px;
        background: #032B55;
        color: #fff;
        font-size: 15px;
        line-height: 1.5;
        font-weight: 500;
        border-bottom: 1px solid rgba(0, 55, 115, 0.6);
        cursor: pointer;
    }

    .agreement-detail .result {
        border-right: 2px solid #fff;
    }


        .agreement-detail .result:last-child {
            border-right: 0;
        }

    .agreement-detail .result-fta {
        width: 33.3%;
    }

    .agreement-detail > .result-roo {
        width: 66.6%;
    }

    .agreement-detail .result.result-roo > div {
        display: flex;
        height: 100%;
    }

    .agreement-detail .result.result-roo .result {
        width: 50%;
    }

    .agreement-detail .result:last-child {
        border-right: 0;
    }

    .agreement-detail .result-fta {
        width: 33.3%;

    }

    .agreement-detail > .result-roo {
        /* width: 66.6%; */
        width: -webkit-fill-available;
    }

    .agreement-detail .content {
        margin-bottom: 20px;
        padding: 0 10px;
    }

    .agreement-detail .content-row {
        padding: 10px 0 0;
    }

    .agreement-detail .lbl,
    .agreement-detail .ctn {
        padding: 0 15px;
        font-size: 13px;
    }

    .agreement-detail .lbl {
        padding: 0 15px;
        font-size: .875em;
        color: #032B55;
        letter-spacing: 0.3px;
        font-weight: 600;
        text-transform: uppercase;
        line-height: 1;
        position: relative;
    }

    .agreement-detail .ctn {
        word-wrap: break-word;
    }

    .agreement-detail .result {
        display: inline-block;
        vertical-align: top;
    }

    .agreement-detail .lbl a {
        text-transform: capitalize;
        font-size: 13px;
        font-weight: normal;
    }


    .agreement-detail .result.result-roo > div {
        display: flex;
        height: 100%;
    }

    .agreement-detail .result.result-roo .result {
        width: 50%;
    }


    .agreement-detail .content {
        margin-bottom: 20px;
        padding: 0 10px;
    }

    .agreement-detail .content-row {
        padding: 10px 0 0;
    }

    .agreement-detail .lbl,
    .agreement-detail .ctn {
        padding: 0 15px;
        font-size: 13px;
    }

    .agreement-detail .lbl {
        padding: 0 15px;
        font-size: .875em;
        color: #032B55;
        letter-spacing: 0.3px;
        font-weight: 600;
        text-transform: uppercase;
        line-height: 1;
        position: relative;
    }

    .agreement-detail .ctn {
        word-wrap: break-word;
    }

    .agreement-detail .result {
        display: inline-block;
        vertical-align: top;
    }

    .agreement-detail .lbl a {
        text-transform: capitalize;
        font-size: 13px;
        font-weight: normal;
    }


        .agreement-detail .lbl a.button {
            display: block;
            text-align: center;
            line-height: 40px;
            background-color: #032b55;
            color: #fff;
            text-transform: uppercase;
            font-size: .875em;
            font-weight: 500;
            text-decoration: none !important;
            transition: background-color .3s ease-out;
            border: 1px solid #032b55;
            padding-top: 2px;
            transition: background 0.2s ease-out, color 0.2s ease-out;
        }

.map-container {
    min-width: 1156px;
    min-height: 500px;
}

.chart-filters span {
    color: #FFF;
    margin-bottom: 20px;
    text-transform: uppercase;
    font-size: 14px;
}

.chart-filters label {
    font-weight: 400;
    padding-right: 5px;
    color: #032B55;
    display: inline-block;
}

.chart-filters ul {
    -webkit-padding-start: 2px;
}

    .chart-filters ul li {
        list-style-type: none;
        display: inline;
    }

.chart-filters .onOff input[type="checkbox"] {
    position: absolute;
    left: -9999px;
}

    .chart-filters .onOff input[type="checkbox"] + i {
        position: relative;
        margin: 0 5px 0 5px;
        top: 3px;
        cursor: pointer;
        width: 50px;
        height: 22px;
        display: inline-block;
        background: url("../svg/toggle_off.svg") left center no-repeat;
    }

    .chart-filters .onOff input[type="checkbox"]:checked + i {
        background: url("../svg/toggle_on.svg") left center no-repeat;
    }

#country-selection {
    display: block;
    position: relative;
    z-index: 2;
}

    #country-selection input {
        width: 100%;
        padding: 5px 10px;
    }

#chart-country-list ul {
    overflow-y: scroll;
    overflow-x: visible;
    padding: 0;
    /* margin: 20px 0 0;*/
    height: 680px;
}


/* for Arabic! */
html:lang(ar) #chart-country-list ul {
    padding: 2em 0 1em 0;
}


#chart-country-list > ul {
    list-style-type: none;
}

    #chart-country-list > ul li {
        vertical-align: text-top;
        padding: 0 30px;
        cursor: pointer;
        display: block;
    }

        #chart-country-list > ul li a {
            color: #032B55;
        }

        #chart-country-list > ul li.checked {
            background: url(../svg/checkbox_checked.svg) 0 0 no-repeat;
        }

        #chart-country-list > ul li.unchecked {
            background: url(../svg/checkbox.svg) 0 0 no-repeat;
        }

#select-chart-country input:before {
    content: "\f002";
}

.map-filters {
    display: flex;
    background: #FAFAFA;
    padding: 20px;
    border-bottom: 2px solid #dee4ea;
    margin-bottom: 40px;
    justify-content: space-between;
}

    .map-filters ul {
        padding: 0;
        margin: 0;
    }

        .map-filters ul li {
            list-style: none;
        }

            .map-filters ul li label {
                font-weight: 400;
                white-space: nowrap;
                text-transform: none;
            }


/* adding some padding for the labels for the styled radio buttons that appear in the Compare pages - maps tab, for Arabic ! */
html:lang(ar) .map-filters ul li label {
    padding-right: 2em;
}

    .map-filters span {
        font-size: 16px;
        text-transform: uppercase;
        display: block;
        margin: 0 0 10px 0;
    }

.map-type label {
    line-height: 1.2;
    border-bottom: 2px solid transparent;
}

.map-type .map-type-item {
    margin: 0 5px;
    width: 70px;
    height: 110px;
    display: inline-block;
    position: relative;
    text-align: center;
    padding: 5px 0 0;
    cursor: pointer;
    border-radius: 2px;
}

    .map-type .map-type-item label {
        cursor: pointer;
    }

.map-type .map-item {
    width: 60px;
    height: 60px;
    margin: 0 auto;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

.map-type .map-world {
    background-image: url(../png/map-world.png);
}

.map-type .map-asia {
    background-image: url(../png/map-asia.png);
}

.map-type .map-africa {
    background-image: url(../png/map-africa.png);
}

.map-type .map-europe {
    background-image: url(../png/map-europe.png);
}

.map-type .map-middle-east {
    background-image: url(../png/map-middle-east.png);
}

.map-type .map-north-america {
    background-image: url(../png/map-north-america.png);
}

.map-type .map-oceania {
    background-image: url(../png/map-oceania.png);
}

.map-type .map-south-america {
    background-image: url(../png/map-south-america.png);
}

.map-type div.selected-map {
    background-color: #fff;
    border: solid 0.5px #032B55;
}

/*Quota results table*/
#custom-duties-results table tr td a:hover {
    cursor: pointer;
    color: #032B55;
    text-decoration: none;
}

#custom-duties-results thead tr th:last-child,
#trade-remedy-content thead tr th:last-child {
    padding-right: 10px;
    text-align: center;
}

#custom-duties-results .quota-link .toggle {
    display: inline-block;
    width: auto;
    margin-left: 0;
    margin-right: 5px;
}

#custom-duties-results .quota-link.less .toggle {
    transform: rotate(180deg);
}

#custom-duties-results .detail-link .toggle {
    display: inline-block;
    width: auto;
    margin-left: 0;
    margin-right: 5px;
}

#custom-duties-results .detail-link.less .toggle {
    transform: rotate(180deg);
}

#quota-results table thead th {
    background-color: #032B55;
    color: #fff;
    text-transform: capitalize;
}

#quota-results table tr td {
    background-color: #F9F9F9;
    font-size: 13px;
    padding: 8px 15px;
}

#quota-results table tr .inner-text {
    padding-bottom: 10px;
    margin-bottom: 10px;
}

#quota-results table tr td .ellipsis-txt {
    height: 200px;
}

#quota-results table tr .toggle {
    display: block;
}

.account-page {
    padding: 100px 0;
}

.checkbox-styled {
    display: inline-block;
    margin: 1px 15px 1px 0;
}

    .checkbox-styled input {
        position: absolute;
        opacity: 0;
    }

    .checkbox-styled label {
        position: relative;
        cursor: pointer;
        padding: 0 0 0 35px;
        text-transform: uppercase;
        font-size: 14px;
        color: #032b55;
        font-weight: 400;
        height: 24px;
    }

        .checkbox-styled label::before {
            content: "";
            margin-right: 10px;
            display: inline-block;
            vertical-align: text-top;
            width: 24px;
            height: 24px;
            border: 1px solid #032b55;
            background: #fff;
            position: absolute;
            top: 0;
            left: 0;
        }

    .checkbox-styled input:checked + label {
        font-weight: 500;
    }

        .checkbox-styled input:checked + label::before {
            background: #032b55;
        }

        .checkbox-styled input:checked + label::after {
            content: "";
            position: absolute;
            background: url(../png/checkmark.png);
            width: 21px;
            height: 15px;
            top: 5px;
            left: 2px;
        }

    .checkbox-styled input:disabled + label {
        cursor: default;
    }

.radio-styled {
    display: inline-block;
    margin: 1px 15px 1px 0;
}

    .radio-styled input {
        position: absolute;
        opacity: 0;
    }

    .radio-styled label {
        position: relative;
        cursor: pointer;
        padding: 0 0 0 35px;
        text-transform: uppercase;
        color: #032b55;
        font-size: 14px;
        font-weight: 400;
        height: 24px;
    }

        .radio-styled label::before {
            content: "";
            margin-right: 10px;
            display: inline-block;
            vertical-align: text-top;
            width: 24px;
            height: 24px;
            border: 1px solid #032b55;
            background: #fff;
            border-radius: 50%;
            position: absolute;
            top: 0;
            left: 0;
        }

/* styled radio buttons, for say the ones that appear in the Compare pages - maps tab, for Arabic ! */
html:lang(ar) .radio-styled label::before {
    margin-left: 10px;
    margin-right: unset;
    right: 0;
    left: unset;
}


.radio-styled input:checked + label {
    text-shadow: 0px 0 0 #032b55;
}

    .radio-styled input:checked + label::after {
        content: "";
        position: absolute;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background-color: #032b55;
        top: 6px;
        left: 6px;
    }

/* styled radio buttons, for say the ones that appear in the Compare pages - maps tab, for Arabic ! */
html:lang(ar) .radio-styled input:checked + label::after {
   left: unset;
   right: 6px;
}

    .radio-styled input:disabled + label {
        cursor: default;
    }

@media (min-width: 1199px) {
    .container .results-panel .heading .sub-heading {
        width: 100%;
    }
}

/*------------- Hero banner block -------------*/
.hero-banner {
    position: relative;
    height: 550px;
    width: 100%;
    background: url(../jpg/header-image-full.jpg) center / cover;
}

    .hero-banner .inner-wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        max-width: 700px;
        padding: 0 15px;
        margin: auto;
        z-index: 2;
        position: relative;
        flex-direction: column;
        text-align: center;
    }

    .hero-banner:before {
        content: "";
        background: linear-gradient(180deg, rgba(3, 43, 85, 0.1) 0%, rgba(3, 43, 85, 0.7) 50%, rgba(3, 43, 85, 0.2) 100%);
        position: absolute;
        display: block;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
    }

    .hero-banner .title {
        font-weight: 700;
        font-size: 36px;
        color: #FFFFFF;
        letter-spacing: -0.21px;
    }

    .hero-banner .sub-title {
        font-weight: 500;
        font-size: 18px;
        color: #EFEFF4;
        margin: 15px auto 0;
    }

/*------------- Page analyze -------------*/
.page-analyze .block-list-tools {
    margin: 110px auto;
}

.block-list-tools em {
    padding-left: 20px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #CCC;
    font-style: normal;
}

.block-list-tools h2 {
    display: block;
    padding: 0 0 20px 20px;
    margin: 10px 0 0;
    font-weight: 700;
    font-size: 30px;
    color: #333;
    letter-spacing: -0.08px;
    text-transform: none;
    border-bottom: 2px solid #F1F1F1;
}

.block-list-tools h3 {
    line-height: 125%;
    margin-top: 0;
    color: #043C76;
}

.block-list-tools .block-title {
    margin-bottom: 50px;
}

.block-list-tools .block-content {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

    .block-list-tools .block-content li {
        display: flex;
        align-items: flex-end;
        list-style-type: none;
        padding: 35px;
        margin: 0 0 20px 0;
        border: 1px solid #F1F1F1;
        background: #FCFDFF;
        flex-basis: calc(50% - 10px);
        width: calc(50% - 10px);
        transition: background-color 0.2s ease-out;
    }

        .block-list-tools .block-content li:nth-of-type(odd) {
            margin-right: 20px;
        }

    .block-list-tools .block-content .img-wrapper {
        width: 280px;
        height: 220px;
        flex: 1 0 280px;
    }


        .block-list-tools .block-content .img-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

    .block-list-tools .block-content .info {
        padding-left: 35px;
    }

        .block-list-tools .block-content .info a {
            display: block;
            float: left;
            padding: 10px 20px;
            border: 1px solid #043C76;
            font-weight: 500;
            transition: color 0.2s ease-out, background-color 0.2s ease-out;
        }

            .block-list-tools .block-content .info a:hover,
            .block-list-tools .block-content .info a:focus {
                background: #043C76;
                color: #FFFFFF;
                text-decoration: none;
            }

            .block-list-tools .block-content .info a:after {
                content: '\2192';
                padding-left: 10px;
            }



        .block-list-tools .block-content .img-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

    .block-list-tools .block-content .info {
        padding-left: 35px;
    }

        .block-list-tools .block-content .info a {
            display: block;
            float: left;
            padding: 10px 20px;
            border: 1px solid #043C76;
            font-weight: 500;
            transition: color 0.2s ease-out, background-color 0.2s ease-out;
        }

            .block-list-tools .block-content .info a:hover,
            .block-list-tools .block-content .info a:focus {
                background: #043C76;
                color: #FFFFFF;
                text-decoration: none;
            }

            .block-list-tools .block-content .info a:after {
                content: '\2192';
                padding-left: 10px;
            }


    .block-list-tools .block-content .summary {
        margin-bottom: 28px;
        font-weight: 400;
        font-size: 16px;
        color: #9DA2A6;
    }

@media (max-width: 1199px) {
    .block-list-tools .block-content li {
        width: 100%;
        flex-basis: 100%;
    }

        .block-list-tools .block-content li:nth-of-type(odd) {
            margin-right: 0;
        }
}

@media (max-width: 767px) {
    .page-analyze .block-list-tools {
        padding: 0 15px;
    }

    .block-list-tools .block-content li {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .block-list-tools .block-content .info {
        padding: 0;
    }

        .block-list-tools .block-content .info a {
            float: none;
            margin: auto;
            max-width: 200px;
        }
}

/*------------- Page Availability -------------*/
.page-resources-availability .block-data-availability {
    padding: 110px 0;
    background: #F9F9F9;
}

    .page-resources-availability .block-data-availability .container {
        max-width: 1406px;
        width: 100%;
    }

.page-resources-availability .nav-tabs {
    display: flex;
}

.page-resources-availability .tab-content {
    border: 5px solid #032B55;
    height: 805px;
    overflow: auto;
}

.page-resources-availability .nav-tabs li {
    height: 120px;
    flex: 1 0 50%;
    background: #7E96A9;
}

    .page-resources-availability .nav-tabs li a {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        font-size: 30px;
        font-weight: 500;
        color: #FFF;
        height: 100%;
        width: 100%;
        padding: 10px 40px;
        background: #7E96A9;
        transition: background-color 0.2s ease-out;
    }

        .page-resources-availability .nav-tabs li a:hover {
            color: #FFF;
        }

    .page-resources-availability .nav-tabs li.active a {
        background: #032B55;
        color: #FFF;
    }

.page-resources-availability .nav-tabs .tab-icon {
    margin-right: 30px;
}

.page-resources-availability .block-data-availability .txt-disclaimer {
    margin-top: 30px;
    font-size: 16px;
    color: #929CA7;
}

@media (max-width: 1199px) {
    .page-resources-availability .nav-tabs li a {
        font-size: 20px;
    }
}

/*------------- Page Access - Page Access Overview and sub pages -------------*/
.page-access-overview .main-search-container,
.page-access-detail .main-search-container {
    position: relative;
    background: url(../jpg/header-image-full.jpg) center 20% / cover;
}

    .page-access-overview .main-search-container:before,
    .page-access-detail .main-search-container:before {
        content: "";
        background: linear-gradient(180deg, rgba(3, 43, 85, 0.6) 0%, rgba(3, 43, 85, 0.5) 75%, rgba(3, 43, 85, 0.4) 100%);
        position: absolute;
        display: block;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    /*------------- Page Access - Page Customs Duties -------------*/
    /* Adding Compare pages, COVID19 page */
    .page-access-detail .main-search-container .container .search-box,
    .page-compare-detail .main-search-container .container .search-box,
    .page-trade-measure .main-search-container .container .search-box,
    .page-resources-detail .main-search-container .container .search-box {
        flex: 1 0 auto;
    }

.page-access-detail .search .search-button,
.page-compare-detail .search .search-button,
.page-trade-measure .search .search-button {
    width: 100%;
    max-width: 175px;
    margin: 0 auto;
    padding: 22px 0;
    line-height: 1;
    text-align: center;
}

.page-access-overview #ntm-summary-results table tr.loading > td > div,
.page-access-detail #ntm-summary-results table tr.loading > td > div {
    position: relative;
    overflow: hidden;
    height: 30px;
}

    .page-access-overview #ntm-summary-results table tr.loading > td > div:before,
    .page-access-detail #ntm-summary-results table tr.loading > td > div:before {
        content: "";
        background: url(../gif/itc-loading-38.gif) center left no-repeat #fff;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        max-height: 30px;
        height: 100%;
    }

.quota-results {
    border-spacing: 2px;
    border-collapse: separate;
}

.container .results-panel #quota-results table thead th {
    border-right: 0;
    font-size: 14px;
    text-align: center;
}

.container .results-panel #quota-results table thead td {
    font-size: 13px;
}

.no-padding {

    padding: 0!important;
}

.agreement-detail .find-more-wrapper {
    position: absolute;
    width: 1140px;
    bottom: 15px;
    left: 0;
}

    .agreement-detail .find-more-wrapper .lbl {
        max-width: 300px;
        margin: auto;
    }

        .agreement-detail .find-more-wrapper .lbl .button {
            transition: background 0.2s ease-out, color 0.2s ease-out;
        }

#custom-duties-results table .find-more-wrapper .lbl .button:hover {
    background: #fff;
    color: #032b55;
}

.container .results-panel .results .inside-table {
    border-spacing: 2px;
    border-collapse: separate;
}

    .container .results-panel .results .inside-table thead th {
        color: #FFF;
        background: #032B55;
    }

        .container .results-panel .results .inside-table thead th td {
            border-bottom: 0;
            background: #F9F9F9;
        }

.container .results-panel .ntm-summary-detail-result .inner-table {
    margin-bottom: 20px;
    border-collapse: collapse;
    width: 100%;
}

    .container .results-panel .ntm-summary-detail-result .inner-table thead th {
        border: 2px solid #FFF;
    }

    .container .results-panel .ntm-summary-detail-result .inner-table thead th {
        background: #032B55;
    }

    .container .results-panel .ntm-summary-detail-result .inner-table tbody td {
        padding: 10px;
        background: #F9F9F9;
        border: 2px solid #FFF;
        font-size: 13px;
    }

    .container .results-panel .ntm-summary-detail-result .inner-table tbody tr:nth-child(2n) td {
        background: #FFF;
    }

.ntm-summary-detail-result .inner-table th {
    background: #032B55;
}

.ntm-summary-detail-result .table .inner-table {
    counter-reset: rowNumber;
}

.ntm-summary-detail-result .inner-table tbody tr {
    counter-increment: rowNumber;
}

/* for the NTM summary */
    .ntm-summary-detail-result .inner-table tbody tr td:first-child:before {
        content: counter(rowNumber) '. ';
        color: #002060;
        font-weight: bold;
        font-size: 15px;
    }

    .ntm-summary-detail-result .inner-table tbody tr:only-child td:before {
        content: '';  
    }

#ntm-summary-results .tab-title {
    display: flex;
    justify-content: space-between;
    padding: 10px 15px;
    color: #FFF;
    background: #7E96A9;
    margin: 0 0 5px;
    font-size: 16px;
}

    #ntm-summary-results .tab-title.collapsed .toggle {
        transform: rotate(180deg);
    }

    #ntm-summary-results .tab-title .toggle {
        transform: rotate(0deg);
        cursor: pointer;
        transition: transform 0.2s ease-out;
        line-height: 120%;
    }

        #ntm-summary-results .tab-title .toggle:before {
            content: "\f077";
        }

.tab-title > span:last-child {
    width: 175px;
    display: flex;
    justify-content: space-between;
}

.container .results-panel .tab-title .ntm-year {
    display: block;
    font-size: 15px;
    font-weight: normal;
}

/*------------- Page Compare Market and Competitor -------------*/
/* Hide the second chart temporarily*/
.page-compare-detail .results-panel table th,
.page-compare-detail .results-panel table td {
    text-align: center;
}

    .page-compare-detail .results-panel table th.text-left,
    .page-compare-detail .results-panel table td.text-left {

        text-align: left;
    }

    .page-compare-detail .results-panel table th.first,
    .page-compare-detail .results-panel table td.first{

        padding-left: 15px;
    }

    .page-compare-detail .results-panel table th .txt-unit {
        display: block;
        margin: auto;
        font-size: 9px;
        white-space: nowrap;
    }

.page-compare-market #chart-country-list ul,
.page-compare-competitor #chart-country-list ul {
    height: 660px;
}

.page-compare-market #stack-container,
.page-compare-competitor #stack-container,
.page-compare-market #trade-chart-container,
.page-compare-competitor #trade-chart-container {
    position: absolute;
    visibility: hidden;
    opacity: 0;
}

.page-compare-market .filter .selection,
.page-compare-competitor .filter .selection {
    display: inline-block;
    height: 30px;
    padding-left: 30px;
    background: url(../svg/checkbox.svg) 0 0 no-repeat;
    vertical-align: text-top;
    cursor: pointer;
}

.page-compare-market #country-selection .filter,
.page-compare-competitor #country-selection .filter {
    display: flex;
    padding: 1em; /* for Compare - Markets - Charts to have some padding around the filters */
}

.page-compare-market #country-selection .filter .selection,
.page-compare-competitor #country-selection .filter .selection {
    white-space: nowrap;
    margin-right: 30px;
}


html:lang(ar) .page-compare-market #country-selection .filter .selection,
html:lang(ar) .page-compare-competitor #country-selection .filter .selection {
    margin-left: 30px;
    margin-right: unset;
}

.page-compare-market .filter .selection.has-selected,
.page-compare-competitor .filter .selection.has-selected {
    background: url(../svg/checkbox_checked.svg) 0 0 no-repeat;
}


.page-compare-market .map-filters,
.page-compare-competitor .map-filters {
    position: relative;
    padding-top: 13px;
    padding-right: 10px;
}

    .page-compare-market .map-filters:before,
    .page-compare-competitor .map-filters:before {
        content: "";
        display: block;
        position: absolute;
        background: #7E96A9;
        height: 45px;
        left: 0;
        right: 0;
        top: 0;
    }

    .page-compare-market .map-filters .filter-section-heading,
    .page-compare-competitor .map-filters .filter-section-heading {
        position: relative;
        z-index: 1;
        margin-bottom: 30px;
        font-weight: bold;
        color: #FFF;
        white-space: nowrap;
    }


        /* for Russian, for the maps titles, centre it to give it a bit more space*/
        .page-compare-market .map-filters .filter-section-heading.ru,
        .page-compare-competitor .map-filters .filter-section-heading.ru {

            text-align: center;
        }



.page-compare-market .map-type,
.page-compare-competitor .map-type {
    flex-wrap: wrap;
}

    .page-compare-market .map-type .map-type-list,
    .page-compare-competitor .map-type .map-type-list{

        display: flex;
    }


    .page-compare-market .map-type .filter-section-heading,
    .page-compare-competitor .map-type .filter-section-heading {
        width: 100%;
    }

.table-top {
    background: #7E96A9;
    color: #FFF;
    border-bottom: 0;
}

.container .results-panel .results table thead th {
    background: #062B55; /* previously - #032b55;  */
}


.container .results-panel .results table thead th.blank {
    /* to accommodate the exlamation icon in the tax module */
    background: white;
}

.page-compare-detail .dataTable th .txt-wrapper {
    position: relative;
    letter-spacing: -0.2px;
}

    .page-compare-detail .dataTable th .txt-wrapper span.badge {
        display: inline-block;
        min-width: 10px;
        padding: 3px 7px;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
        color: #fff;
        text-align: center;
        white-space: nowrap;
        vertical-align: baseline;
        background-color: red;
        border-radius: 10px;
    }

.page-compare-detail .dataTable th .styled-tooltip {
    position: absolute;
    padding-left: 2px;
    font-size: 11px;
    z-index: 1;
    text-align: left;
}

    .page-compare-detail .dataTable th .styled-tooltip i {
        font-size: 10px;
    }

.page-compare-detail .dataTable th:nth-child(n+7) .styled-tooltip .tooltip-content {
    right: 0;
}

/* for the left most tooltip to fly out to the right, when in Arabic ! */
html:lang(ar) .page-compare-detail .dataTable th:nth-child(n+7) .styled-tooltip .tooltip-content {
    left: 0;
    right: unset;
}

/* for the Trade Remedies details on small screens, align the headings of the table to the right */
html:lang(ar) .table > thead > tr > th,
html:lang(ar) th{
    text-align: right;
}

.page-compare-market .highcharts-mapbubble-series .highcharts-point,
.page-compare-competitor .highcharts-mapbubble-series .highcharts-point {
    pointer-events: none;
}

/*------------- Page Compare Product -------------*/
.page-compare-product #breadcrumb {
    padding: 0;
    margin: 0;
    display: inline-block;
    list-style-type: none;
}

    .page-compare-product #breadcrumb > li {
        display: inline-block;
        margin: 0 0 0 5px;
    }

        .page-compare-product #breadcrumb > li:after {
            content: " > ";
            margin: 0 5px;
        }

        .page-compare-product #breadcrumb > li:last-child:after {
            display: none;
        }

        .page-compare-product #breadcrumb > li a.active {
            font-weight: bold;
        }

.page-compare-product .results-panel table th .txt-unit {
    display: block;
    margin: auto;
    font-size: 9px;
    white-space: nowrap;
}

.page-compare-detail .results-panel table th,
.page-compare-product .results-panel table td {
    text-align: center;
}

    .page-compare-product .results-panel table th.text-left,
    .page-compare-product .results-panel table td.text-left {
        text-align: left;
    }

.chart-filters #chart-country-list,
.chart-filters .filter {
    position: relative;
}

    .chart-filters #chart-country-list:before,
    .chart-filters .filter:before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: -1;
        background: url(../gif/itc-loading-38.gif) center center no-repeat rgba(255, 255, 255, 0.8);
        visibility: hidden;
        opacity: 0;
    }

    .chart-filters .filter:before {
        background: unset;
    }

.chart-filters .loading #chart-country-list:before,
.chart-filters .loading .filter:before {
    z-index: 1;
    opacity: 1;
    visibility: visible;
    cursor: wait;
}

/*------------- Page Access - Page Regulatory Requirement -------------*/
.page-regulatory-requirement .search .regulation-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .page-regulatory-requirement .search .regulation-wrapper label {
        white-space: nowrap;
    }

    .page-regulatory-requirement .search .regulation-wrapper .input {
        width: auto;
    }

/*------------- Page Resources Detail- (Glossary && FAQ) -------------*/
.page-resources-detail .hero-banner .inner-wrapper {
    max-width: 800px;
}

.page-resources-detail .hero-banner .title {
    font-size: 50px;
}

.page-resources-detail .hero-banner .sub-title {
    margin: 5px auto 25px;
}


.page-resources-detail .hero-banner .search-input-group {
    position: relative;
    width: 350px;
    overflow: hidden;
}

.page-resources-detail .no-result {
    margin-top: 30px;
}

.page-resources-detail .hero-banner .search-input-group .term {
    width: 100%;
    padding: 3px 15px;
    font-style: italic;
    color: #333;
    text-overflow: ellipsis;
}

.page-resources-detail .hero-banner .search-input-group input::-webkit-input-placeholder,
.page-resources-detail .hero-banner .search-input-group input::-moz-placeholder,
.page-resources-detail .hero-banner .search-input-group input:-moz-placeholder,
.page-resources-detail .hero-banner .search-input-group input:-ms-input-placeholder {
    color: #333;
    font-style: italic;
}

.page-resources-detail .hero-banner .search-button {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background: transparent;
    border: 0;
    padding: 0 10px;
    outline: 0;
}


/* Glossary search textbox - move the search icon to the left side of the Search input field for Arabic!*/
html:lang(ar) .page-resources-detail .hero-banner .search-button {
    right: unset;
    left: 0;
}


    .page-resources-detail .block-actions {
    display: flex;
    justify-content: flex-end;
    font-size: 17px;
    padding: 30px 0;
}

    .page-resources-detail .block-actions .toggle-all {
        display: inline-block;
        margin-left: 15px;
        color: #333;
        opacity: 1;
        transition: opacity 0.2s ease-out;
        cursor: pointer;
    }

        .page-resources-detail .block-actions .toggle-all:hover {
            opacity: 0.6;
        }

        .page-resources-detail .block-actions .toggle-all .toggle {
            display: inline-block;
        }


        .page-resources-detail .block-actions .toggle-all.toggle-open-all .toggle {

            transform: rotate(0deg);
        }

.page-resources-detail .block-content {
    margin-bottom: 50px;
    box-shadow: 0px 1px 10px #F9F9F9;
}


    .page-resources-detail .block-content ul {
        list-style-type: none;
        padding: 15px 20px;
    }

.page-resources-detail .term .term-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    width: 100%;
    background: #F9F9F9;
    padding: 0 15px;
    box-shadow: 1px 1px 5px #F9F9F9;
}

.page-resources-detail .term:nth-child(2n) .term-group {
    background: #FFF;
}

.page-resources-detail .toggle {
    position: relative;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 10px solid #002060;
    cursor: pointer;
    transform: rotate(180deg);
    transition: all 0.2s ease-out;
    font-size: 0;
}

.page-resources-detail .term.collapsed .toggle {
    transform: rotate(0)
}

.page-resources-detail .term:nth-child(2n+1) .toggle {
    border-top-color: #7E96A9;
}
/* AfCFTA Page - search for a term in Terminology tab */
.page-resources-detail .hero-banner .search-input-group,
.afcfta-page .search-input-group {
    position: relative;
    width: 350px;
    overflow: hidden;
}

.page-resources-detail .no-result {
    margin-top: 30px;
}

.page-resources-detail .hero-banner .search-input-group .term,
.afcfta-page .search-input-group .term {
    width: 100%;
    padding: 3px 15px;
    font-style: italic;
    color: #333;
    text-overflow: ellipsis;
}

.page-resources-detail .term .term-group .group-text,
.afcfta-page .term .term-group .group-text {
    display: block;
    /* width: 40px; */
    height: 40px;
    line-height: 40px;
    font-size: 17px;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    color: #FFF;
    border-radius: 100%;
    color: #FFF;
    font-weight: bold;
}
/* Library section of the AfCFTA Page */
.afcfta-page .term .term-group .group-text {
    display: inline;
    color: black; /*grey;*/
    font-size: 1.2em;
}

.afcfta-page .term .terms-by-group .term-source-text .source-title {
    font-size: 1.1em;
    font-weight: 600;
}

.afcfta-page .term .term-group {
    /* background-color: lightgrey;*/
    border-bottom: 1px solid #7E96A9;
}

.afcfta-page .term {
    background-color: #f6f7f8; /* light grey/blue */
    padding: 1em;
    margin-bottom: 1.2em;
}
.page-resources-detail .term:nth-child(2n) .term-group .group-text {
    background: #002060;
}

.page-resources-detail .term:nth-child(2n+1) .term-group .group-text {
    background: #7E96A9;
}

.page-resources-detail .term .term-name {
    color: #002060;
    font-weight: bold;
    font-size: 17px;
    cursor: pointer;
}

    .page-resources-detail .term .term-name:hover {
        text-decoration: underline;
    }

.page-resources-detail .term:nth-child(2n+1) .term-name {
    color: #7E96A9;
}

.page-resources-detail .term .term-definition {
    margin-bottom: 30px;
}

.page-resources-detail .highlight {
    background-color: yellow
}
/* Highlighting for the AfCFTA page*/
.page-resources-detail .highlight,
.afcfta-page .highlight {
    background-color: yellow
}
/*------------- Page FAQ -------------*/
.page-resources-faq .hero-banner .sub-title {
    margin-top: 0;
}

.page-resources-faq .term .term-group .group-text {
    width: auto;
    border-radius: 0;
    text-transform: uppercase;
}

.page-resources-detail .term:nth-child(2n) .term-group .group-text {
    background: transparent;
    color: #002060;
}

.page-resources-detail .term:nth-child(2n+1) .term-group .group-text {
    background: transparent;
    color: #7E96A9;
}

.page-resources-faq .term-definition a {
    color: #5B9BD5;
    text-decoration: underline;
}

.page-resources-faq .block-content .term-definition ul {
    padding: 0 0 0 50px;
    list-style-type: disc;
}

.page-resources-faq .block-content .term-definition ol {
    padding-left: 50px;
}

.page-resources-faq .block-content .term-definition em {
    color: #002060;
    font-weight: bold;
}

page-resources-faq .block-content .term-definition b {
    font-weight: bold;
}

/*------------- Page Analyze Landing -------------*/
.page-analyze-landing .hero-banner:before {
    background: linear-gradient(180deg, rgba(3, 43, 85, 0.6) 0%, rgba(3, 43, 85, 0.5) 75%, rgba(3, 43, 85, 0.4) 100%);
}

.page-analyze-landing .hero-banner .inner-wrapper {
    max-width: 100%;
}

.page-analyze-landing .hero-banner .title {
    font-size: 36px;
    line-height: 120%;
    margin-top: 30px;
}


.page-analyze-landing .block-list-tools {
    margin: 60px auto 30px;
}

    .page-analyze-landing .block-list-tools .block-content li {
        position: relative;
        align-items: flex-start;
        flex-basis: calc(50% - 20px);
        width: calc(50% - 20px);
        margin-bottom: 40px;
        background: transparent;
    }


        .page-analyze-landing .block-list-tools .block-content li:nth-of-type(odd) {
            margin-right: 40px;
        }

        .page-analyze-landing .block-list-tools .block-content li:before,
        .page-analyze-landing .block-list-tools .block-content li:after {
            content: "";
            position: absolute;
            z-index: -1;
        }

        .page-analyze-landing .block-list-tools .block-content li:before {
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            border: 8px solid #fff;
            box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.5), inset 1px 1px 10px rgba(0, 0, 0, 0.3);
            transition: box-shadow 0.2s ease-out;
        }

        .page-analyze-landing .block-list-tools .block-content li:after {
            top: 3px;
            right: 3px;
            bottom: 3px;
            left: 3px;
            border: 2px solid #043C76;
        }

        .page-analyze-landing .block-list-tools .block-content li:hover:before {
            box-shadow: 1px 1px 7px rgba(4, 60, 118, 1), inset 1px 1px 10px rgba(4, 60, 118, 1);
        }

    .page-analyze-landing .block-list-tools .block-content {
        padding-left: 0
    }

    .page-analyze-landing .block-list-tools h3 {
        font-weight: 600;
    }

    .page-analyze-landing .block-list-tools .block-content .info {
        padding: 0;
    }

        .page-analyze-landing .block-list-tools .block-content .info h3 a {
            border: 0;
            padding: 0;
            float: none;
        }

            .page-analyze-landing .block-list-tools .block-content .info h3 a:after {
                visibility: hidden;
            }

            .page-analyze-landing .block-list-tools .block-content .info h3 a:hover,
            .page-analyze-landing .block-list-tools .block-content .info h3 a:focus {
                background: transparent;
                text-decoration: underline;
                color: #043C76;
            }

/* ===== trivial style for form search ===== */
.footnote {
    display: block;
    margin: 15px 0;
    text-align: left;
    color: #666;
}

/* ===== table with toggle list ===== */
.table-toggle-list .trigger-togger-wrapper {
    display: flex;
    align-items: center;
    padding: 0 5px 0 10px;
}

.table-toggle-list .trigger-togger-wrapper .measure-summary-wrapper {
    display: flex;
    flex-grow: 1;
    font-weight: bold;
    /*   font-size: 1.2em;*/
}

.table-toggle-list .trigger-togger-wrapper .measure-summary-wrapper > span {
    white-space: nowrap;
}

.container .results-panel .results table tbody tr td .measure-summary-wrapper i {
    font-size: 12px;
    vertical-align: top;
    text-align: unset;
}

.table-toggle-list .trigger-togger .measure-summary {
    position: relative;
}

.table-toggle-list .measure-summary-wrapper .measure-extra-infor {
    position: absolute;
    z-index: 1;
    background: #fff;
    border-radius: 2px;
    box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
    color: #333;
    font-weight: normal;
    padding: 10px 30px 15px;
    width: 100%;
    max-width: 500px;
    top: 28px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease-out;
    left:150px;
}

.table-toggle-list .measure-summary:hover .measure-extra-infor {
    opacity: 1;
    visibility: visible;
}

    .table-toggle-list .measure-summary:hover .measure-extra-infor .action-bar {
        margin: auto;
        text-align: center;
    }

    .table-toggle-list .measure-summary:hover .measure-extra-infor .btn-learn-more {
        display: inline-block;
        margin: auto;
        background: #043c76;
        padding: 10px 25px 13px;
        color: #fff;
        margin: 15px auto 5px;
        border-radius: 2px;
        border: 1px solid #043c76;
        transition: background 0.2s ease-out, color 0.2s ease-out;
    }

        .table-toggle-list .measure-summary:hover .measure-extra-infor .btn-learn-more:hover {
            background: #fff;
            color: #043c76;
            text-decoration: none;
        }

.trigger-togger-wrapper .measure-count,
.trigger-togger-wrapper .detail-link {
    align-self: flex-start;
    white-space: nowrap;
}

.container .results-panel .results #ntm-summary-results table tbody tr.even {
    background: #fff;
}

.table-toggle-list .toggle-trigger > td {
    font-weight: normal;
    transition: background 0.2s ease-out;
}

.table-toggle-list .toggle-trigger.expanded > td,
.table-toggle-list .toggle-trigger.expanded.even > td {
    background: #002060;
    color: #FFF;
}

/* Query Results page - NTM section - when the user expands a row, 
    the text colour will be white as the background is already the dark navy 
    #002060  */
.table-toggle-list .toggle-trigger.expanded > td {
    background: #002060!important;
    color: #FFF!important;
}
.table-toggle-list .toggle-trigger.expanded .toggle {
    border-top-color: #FFF;
}

.table-toggle-list .toggle-trigger:nth-child(2n) > td {
     color: #002060; 
}

.table-toggle-list tbody tr {
    border-bottom: 3px solid #fff;
}

.table-toggle-list .toggle-trigger > td {
    color: #333;
    background: #FFF;
}

.table-toggle-list .toggle-trigger.even > td {
    background: #FAFAFA;
}

.table-toggle-list .inner-table td {
    color: #080808;
    width: 100%;
}

.table-toggle-list .toggle {
    position: relative;
    margin-top: 6px;
    margin-left: 10px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 10px solid #002060;
    cursor: pointer;
    transform: rotate(0deg);
    transition: all 0.2s ease-out;
}

    .table-toggle-list .toggle.less {
        transform: rotate(180deg);
    }

.table-toggle-list .inner-table tr {
    position: relative;
}

.table-toggle-list .inner-table ul {
    list-style-type: none;
    padding-left: 42px;
}

    .table-toggle-list .inner-table ul li {
        text-indent: -20px;
    }

.table-toggle-list .inner-table em {
    color: #002060;
    font-style: normal;
    font-weight: bold;
}

.table-toggle-list .inner-table .req-detail em {
    font-weight: normal;
    font-style: italic;
}

.table-toggle-list .inner-table .toggle-more {
    position: absolute;
    bottom: 15px;
    right: 5px;
    color: #002060;
    font-size: 15px;
    cursor: pointer;
}

    .table-toggle-list .inner-table .toggle-more:before {
        content: "\f055";
    }

.table-toggle-list .inner-table td.expanded .toggle-more:before {
    content: "\f056";
}

.table-toggle-list .inner-table .req-title {
    padding-right: 25px;
    font-size: 15px;
}

.table-toggle-list .ntm-summary-detail-result {
    padding: 0 5px;
}

    .table-toggle-list .ntm-summary-detail-result i {
        color: #002060;
    }

/* ===== page account ===== */
    .account-page > .container {
    max-width: 800px;
    width: 100%;
}

.account-page iframe {
    margin: 30px 0;
}

.page-content-collapsable .term .term-group .group-text {
    width: auto;
}

/* @todo === START === these styles might be obsolete when we replace the static content by the one from CMS. Consider to remove them */
.page-methodology .tab-content {
    border-top: 1px solid #7E96A9;
}

.page-methodology #block-terms-content {
    counter-reset: term-section;
}

    .page-methodology #block-terms-content .term-group .group-text:before {
        counter-increment: term-section;
        content: counter(term-section, upper-roman) " - ";
    }

.page-methodology .term .terms-by-group {
    padding: 15px;
}

.page-methodology .term .item-title {
    padding: 7px 15px;
    font-weight: bold;
}

.page-methodology .term ul {
    padding-right: 0;
    padding-bottom: 0;
}

.page-methodology .term .item-description {
    padding: 15px;
}

.page-methodology .term .terms-inner-wrapper ul {
    position: relative;
    list-style-type: none;
    padding-left: 20px;
}

.page-methodology .term .terms-inner-wrapper li {
    position: relative;
    border-left: 1px dashed #002060;
}

.page-methodology .term .terms-inner-wrapper .item-lv-1::before,
.page-methodology .term .terms-inner-wrapper .item-lv-2:before {
    content: "";
    position: absolute;
    left: 20px;
    top: 0;
    height: 100%;
    width: 1px;
    background: #FFF;
    border-left: 1px dashed #002060;
}

.page-methodology .term .terms-inner-wrapper .item-lv-2:after {
    content: "";
    position: absolute;
    left: 40px;
    top: 0;
    height: 100%;
    width: 1px;
    background: #FFF;
    border-left: 1px dashed #002060;
}

.page-methodology .term .terms-inner-wrapper .item-lv-1 .item-title:before,
.page-methodology .term .terms-inner-wrapper .item-lv-2 .item-title:before {
    content: "";
    width: 25px;
    left: -22px;
    top: 10px;
    background: #FFF;
    height: 1px;
    border-top: 1px dashed #002060;
    position: absolute;
    transform: rotate(-135deg);
}

.page-resources-detail .term .terms-by-group .term-name.term-detail-piecee,
.page-methodology .term .terms-inner-wrapper li .item-title,
.page-product-search .search-result-detail .section-listing > li .section-heading
{
    position: relative;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #fff;
    color: #002060;
    transition: color 0.2s ease-out, background 0.2s ease-out;
}

.page-methodology .term .terms-inner-wrapper .item-lv-0:nth-child(2n+1) .item-title.collapsed,
.page-methodology .term .terms-inner-wrapper .item-lv-1:nth-child(2n+1) .item-title.collapsed,
.page-methodology .term .terms-inner-wrapper .item-lv-2:nth-child(2n+1) .item-title.collapsed {
    background: #FFF;
}

.page-methodology .term .terms-inner-wrapper .item-lv-0:nth-child(2n) .item-title.collapsed,
.page-methodology .term .terms-inner-wrapper .item-lv-1:nth-child(2n) .item-title.collapsed,
.page-methodology .term .terms-inner-wrapper .item-lv-2:nth-child(2n) .item-title.collapsed {
    background: #F9F9F9;
}

.page-methodology .term .terms-inner-wrapper li .item-title:not(.collapsed) {
    background: #002060;
    color: #FFF;
}

.page-methodology .term .terms-inner-wrapper .item-lv-1 .item-title,
.page-methodology .term .terms-inner-wrapper .item-lv-2 .item-title {
    border-left: 1px dashed #002060;
}

.page-methodology .term .terms-inner-wrapper .item-lv-1 {
    padding-left: 20px;
}

.page-methodology .term .terms-inner-wrapper .item-lv-2 {
    padding-left: 40px;
}


/*.page-resources-detail .term .terms-by-group .terms-inner-wrapper li .item-title .sub-item-toggle,*/
.page-resources-detail .term .terms-by-group .term-name.term-detail-piece .sub-item-toggle,
.page-methodology .term .terms-inner-wrapper li .item-title .sub-item-toggle {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.page-resources-detail .term .term-name:hover {
    text-decoration: none; /* underline in the desktop version */
}

.page-resources-detail .term .terms-by-group .term-name.term-detail-piece.collapsed .icon,
.page-methodology .term .terms-inner-wrapper li .item-title.collapsed .icon {
    display: block;
}

   /* nov26 .page-resources-detail .term .terms-by-group .term-name.term-detail-piece.collapsed .icon:before,  */
    /* the + icon */
.page-methodology .term .terms-inner-wrapper li .item-title.collapsed .icon:before {
    content: "\f055";
 }

     /* the - icon */
.page-methodology .term .terms-inner-wrapper li .item-title .icon:before {
    content: "\f056";
}

.page-methodology .term .terms-inner-wrapper li li .item-title:before {
    content: '';
    position: absolute;
    display: block;
    width: 15px;
    height: 1px;
    background: #fff;
    border-bottom: 1px dashed #002060;
    left: -25px;
    width: 30px;
    top: 50%;
    transform: translateY(-10px) rotate(50deg);
}

.org-chart .org-chart-branch {
    position: relative;
    display: flex;
    align-items: strech;
    list-style-type: none;
    margin-bottom: 26px;
    justify-content: center;
}

    .org-chart .org-chart-branch li {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        background: red;
        flex: 1 0 auto;
        padding: 10px 5px;
        text-align: center;
        border-radius: 5px;
        max-width: 120px;
        font-size: 12px;
        margin: 0 2px;
    }

        .org-chart .org-chart-branch li:before {
            content: "";
            position: absolute;
            height: 20px;
            width: 1px;
            display: block;
            border: 1px solid #ccc;
            border-right-color: rgba(0,0,0,0);
            transform: translateY(-100%);
            top: 0;
            z-index: 1;
        }

    .org-chart .org-chart-branch.root li:before,
    .org-chart .org-chart-branch.root li:after {
        display: none;
    }

    .org-chart .org-chart-branch li:after {
        position: absolute;
        content: "";
        display: block;
        width: calc(100% + 20px);
        height: 19px;
        transform: translateY(-100%);
        top: -1px;
        border-top: 1px solid #ccc;
    }
    .org-chart .org-chart-branch li:first-child:after {
        left: 50%;
    }

    .org-chart .org-chart-branch li:last-child:after {
        right: 50%;
    }

    .org-chart .org-chart-branch li.has-children div:before {
        position: absolute;
        content: "";
        display: block;
        width: 1px;
        height: 20px;
        bottom: 0px;
        left: 50%;
        transform: translateY(110%);
        border: 1px solid #ccc;
        border-right-color: rgba(0,0,0,0);
        bottom: 0;
    }



    .org-chart .org-chart-branch li:first-child:after {
        left: 50%;
    }

    .org-chart .org-chart-branch li:last-child:after {
        right: 50%;
    }

    .org-chart .org-chart-branch li.has-children div:before {
        position: absolute;
        content: "";
        display: block;
        width: 1px;
        height: 20px;
        bottom: 0px;
        left: 50%;
        transform: translateY(110%);
        border: 1px solid #ccc;
        border-right-color: rgba(0,0,0,0);
        bottom: 0;
    }


    .org-chart .org-chart-branch.a-right {
        transform: translate(16%);
    }

.ntlc-cms-table {
    padding: 10px;
    background: #FFF;
    border: 10px solid #F9F9F9;
}

    .ntlc-cms-table > li {
        list-style-type: none;
    }

.org-chart .chapter-title {
    color: #002060;
}

.org-chart .heading-title {
    color: #7E96A9;
}

.org-chart .subheading-title {
    color: #4EC9FD;
}

.org-chart .chapter-content li {
    color: #FFF;
    background: #002060;
}

.org-chart .heading-content li {
    color: #FFF;
    background: #7E96A9;
}

.org-chart .subheading-content li {
    color: #FFF;
    background: #4EC9FD;
}

/* @todo  === END === these styles might be obsolete when we replace the static content by the one from CMS. Consider to remove them */
.page-methodology .tabs-container {
    margin: 50px auto;
}

    .page-methodology .tabs-container .tab-subheading {
        width: 100%;
        padding: 8px 15px;
        background: #7E96A9;
        color: #FFF;
        min-height: 50px;
    }

        .page-methodology .tabs-container .tab-subheading + .content {
            padding: 8px 15px;
        }

.styled-tooltip {
    display: inline-block;
    position: relative;
}

    .styled-tooltip .tooltip-content {
        position: absolute;
        display: flex;
        align-items: center;
        z-index: 1;
        background: #fff;
        border-radius: 2px;
        box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
        color: #333;
        font-weight: normal;
        padding: 10px 15px 10px;
        min-width: 250px;
        max-width: 500px;
        top: 0;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.2s ease-out, transform 0.2s ease-out;
        transform: translateY(-5px);
    }

    .styled-tooltip:hover .tooltip-content {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .styled-tooltip .tooltip-note {
        background: #ccc;
        padding: 0 5px;
        border-radius: 2px;
        font-style: italic;
        cursor: pointer;
    }

.page-trade-agreement table thead th .styled-tooltip em {
    white-space: nowrap;
    font-style: normal;
}

    .page-trade-agreement table thead th .styled-tooltip em > i {
        font-size: 10px;
        vertical-align: super;
    }

.page-trade-agreement .styled-tooltip .tooltip-content {
    position: absolute;
    display: flex;
    flex-direction: column;
    z-index: 1;
    background: #fff;
    border-radius: 2px;
    box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
    color: #333;
    font-weight: normal;
    padding: 10px 15px 10px;
    min-width: 250px;
    max-width: 500px;
    top: 0;
    left: 30%;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease-out, transform 0.2s ease-out;
    transform: translateY(-5px);
    -webkit-transform: translateY(-5px);
    -moz-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    -o-transform: translateY(-5px);
    -webkit-transition: opacity 0.2s ease-out, transform 0.2s ease-out;
    -moz-transition: opacity 0.2s ease-out, transform 0.2s ease-out;
    -ms-transition: opacity 0.2s ease-out, transform 0.2s ease-out;
    -o-transition: opacity 0.2s ease-out, transform 0.2s ease-out;
}

.page-trade-agreement table thead tr th:last-child .styled-tooltip .tooltip-content {
    right: 0;
}

.page-trade-agreement .styled-tooltip:hover .tooltip-content {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    font-size: 12px;
}

.page-trade-agreement .styled-tooltip .tooltip-note {
    background: #ccc;
    padding: 0 5px;
    border-radius: 2px;
    font-style: italic;
    cursor: pointer;
}

.page-trade-agreement .styled-tooltip .tooltip-heading {
    font-weight: bold;
    display: block;
}

.page-trade-agreement table thead th .fta-legend {
    text-align: left;
    padding: 10px 0 0;
}

    .page-trade-agreement table thead th .fta-legend ol {
        margin: 5px 0 10px;
        padding: 0;
    }

    .page-trade-agreement table thead th .fta-legend .item {
        display: block;
        margin-left: 15px;
        color: inherit;
    }

.inner-result-list {
    max-width: 1180px;
    padding: 5px;
    list-style-type: none;
}

    .inner-result-list > li {
        padding: 0;
    }

    .inner-result-list > li:nth-child(odd) {
        background: #FAFAFA;
    }

    /*for the Company Note of Trade Remedies Modal*/
    .inner-result-list.company-list > li:nth-child(odd) {
        background: inherit;
    }


    .inner-result-list ul {
        list-style-type: none;
    }

    .inner-result-list > li {
        position: relative;
    }

        .inner-result-list > li .toggle-more {
            position: absolute;
            bottom: 10px;
            right: 10px;
            cursor: pointer;
            color: #032B55;
        }

            .inner-result-list > li .toggle-more:before {
                content: "\f055";
            }

        .inner-result-list > li.expanded .toggle-more:before {
            content: "\f056";
        }

    .inner-result-list .txt-truncatable {
        display: inline-block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: calc(1180px - 280px);
        vertical-align: top;
    }

        .inner-result-list .txt-truncatable.full-view {
            white-space: unset;
        }

        .inner-result-list .txt-truncatable + .toggle-truncation {
            padding-left: 15px;
            cursor: pointer;
            font-weight: bold;
            color: #032B55;
            transition: text-shadow 0.2s ease-out;
        }

    /* for the Company Note - Trade Remedies Modal */

    .inner-result-list.company-list .txt-truncatable {
        display: inline-block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: calc(1180px - 280px);
        vertical-align: top;
    }

    .inner-result-list.company-list .txt-truncatable.full-view {
        white-space: unset;
    }

/* for the Trade Remedies details modal on small screens, if they expand the text, align it to the right for Arabic !*/
html:lang(ar) .inner-result-list.company-list .txt-truncatable.full-view {
    text-align: right;
}

.inner-result-list.company-list .txt-truncatable + .toggle-truncation {
    padding-left: 15px;
    cursor: pointer;
    font-weight: bold;
    color: #032B55;
    transition: none; /* text-shadow 0.2s ease-out;*/
}


    .inner-result-list.company-list .txt-truncatable + .toggle-truncation {
        padding-left: 0;
        cursor: pointer;
        font-weight: bold;
        color: rgba(6, 43, 85, 0.7);
        transition: none; /* text-shadow 0.2s ease-out;*/
    }


    .inner-result-list.company-list .txt-truncatable + .toggle-truncation:hover {
        text-shadow: none; /* 1px 1px 1px rgba(0,0,0, 0.5);*/
    }

.inner-result-list.company-list .txt-truncatable + .toggle-truncation:before {
    content: '[ More ]';
}

/* Expand button for the text in the Company note table in the Trade Remedies modal in Arabic ! */
html:lang(ar) .inner-result-list.company-list .txt-truncatable + .toggle-truncation:before {
    /* content: '[ More ]';*/
    content: '[ + ]';
    text-align: right;
}

.inner-result-list.company-list .txt-truncatable.full-view + .toggle-truncation:before {
    content: '[ Less ]';
}

/* Collapse button for the text in the Company note table in the Trade Remedies modal in Arabic ! */
html:lang(ar) .inner-result-list.company-list .txt-truncatable.full-view + .toggle-truncation:before {
    /* content: '[ Less ]';*/
    text-align: right;
    content: '[ - ]';
}

    .inner-result-list.company-list .item-result {
        width: calc(100% - 5px);
    }

    .inner-result-list.company-list .item-result-title {
        padding: 4px 8px;
        color: #002060;
        font-style: normal;
        font-weight: bold;
        min-height: 30px;
        transition: color 0.2s ease-out, background 0.2s ease-out;
    }

    .inner-result-list.company-list .expanded .item-result-title {
        color: #002060;
    }

    /***********************/


    .inner-result-list .txt-truncatable + .toggle-truncation:hover {
        text-shadow: 1px 1px 1px rgba(0,0,0, 0.5);
    }

    .inner-result-list .txt-truncatable + .toggle-truncation:before {
        content: '[ + ]';
    }

    .inner-result-list .txt-truncatable.full-view + .toggle-truncation:before {
        content: '[ - ]';
    }

    .inner-result-list .item-result {
        width: calc(100% - 5px);
    }

    .inner-result-list .item-result-title {
        padding: 4px 8px;
        color: #002060;
        font-style: normal;
        font-weight: bold;
        min-height: 30px;
        transition: color 0.2s ease-out, background 0.2s ease-out;
    }

    .inner-result-list .expanded .item-result-title {
        color: #002060;
    }

    .inner-result-list .item-result-detail {
        font-size: 13px;
        padding-left: 20px;
    }

        .inner-result-list .item-result-detail em {
            color: #002060;
            font-style: italic;
        }

        .inner-result-list .item-result-detail i {
            font-size: 16px;
            width: 20px;
            text-align: center;
            vertical-align: text-bottom;
            color: #002060;
        }

.container .results-panel .results table .inner-result-list .item-result-detail .styled-tooltip i {
    font-size: 10px;
    vertical-align: text-top;
}

/* ===== page trade agreement ===== */
.page-trade-agreement .container .results-panel .results table th,
.page-trade-agreement .container .results-panel .results table th {
    background: #032b55;
}

.page-trade-agreement .container .results-panel .results table tbody tr td .expand {
    border: 0;
}

.page-trade-agreement table.dataTable thead .sorting_asc span:after,
.page-trade-agreement table.dataTable thead .sorting_desc span:after {
    top: 50%;
    transform: translateY(-50%);
}

.page-trade-agreement table.dataTable thead .sorting_desc span:after {
    transform: translateY(-50%) scaleY(-1);
}

.page-trade-agreement .filter-result-criteria {
    text-align: left;
}

    .page-trade-agreement .filter-result-criteria .txt-title {
        text-transform: uppercase;
        font-weight: bold;
        color: #929CA7;
    }

    .page-trade-agreement .filter-result-criteria ul {
        display: inline-block;
        padding: 0;
    }

    .page-trade-agreement .filter-result-criteria ul {
        list-style-type: none;
    }

        .page-trade-agreement .filter-result-criteria ul li {
            display: inline-block;
            margin-left: 20px;
        }

    .page-trade-agreement .filter-result-criteria .onoff {
        cursor: pointer;
    }

        .page-trade-agreement .filter-result-criteria .onoff > span {
            letter-spacing: -.5px;
        }

    .page-trade-agreement .filter-result-criteria input {
        visibility: hidden;
        width: 0;
        height: 0;
    }

        .page-trade-agreement .filter-result-criteria input + i {
            display: inline-block;
            vertical-align: middle;
            font-size: 17px;
            line-height: 23px;
            color: #032B55;
        }

            .page-trade-agreement .filter-result-criteria input + i:before {
                content: "\f204";
            }


    .page-trade-agreement .filter-result-criteria ul li {
        display: inline-block;
        margin-left: 20px;
    }

    .page-trade-agreement .filter-result-criteria .onoff {
        cursor: pointer;
    }

        .page-trade-agreement .filter-result-criteria .onoff > span {
            letter-spacing: -.5px;
        }

    .page-trade-agreement .filter-result-criteria input {
        visibility: hidden;
        width: 0;
        height: 0;
    }

        .page-trade-agreement .filter-result-criteria input + i {
            display: inline-block;
            vertical-align: middle;
            font-size: 17px;
            line-height: 23px;
            color: #032B55;
        }

            .page-trade-agreement .filter-result-criteria input + i:before {
                content: "\f204";
            }


        .page-trade-agreement .filter-result-criteria input:checked + i:before {
            content: "\f205";
        }

.page-trade-agreement .status {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    height: 10px;
    width: 10px;
    border-radius: 50%;
    overflow: hidden;
}

    .page-trade-agreement .status.c06_Signed {
        background: #f1bb05;
    }

    .page-trade-agreement .status.c02_Under_negotiation {
        background: #0a97d9;
    }

    .page-trade-agreement .status.c05_Concluded {
        background: #00689d;
    }

    .page-trade-agreement .status.c04_Negotiations_suspended {
        background: #1a3e4c;
    }

    .page-trade-agreement .status.c03_Negotiations_stalled {
        background: #26bde2;
    }

    .page-trade-agreement .status.c08_Inactive {
        background: #3d1100;
    }

    .page-trade-agreement .status.c07_In_force {
        background: #0ca66d;
    }

    .page-trade-agreement .status.c10_Status_unknown {
        background:#4c4c4c;
    }

    .page-trade-agreement .status.c01_Consultations {
        background: #dd1367;
    }

.page-trade-agreement .find-more-wrapper {
    display: none;
}

#agreement-list-result .detail-link .toggle {
    display: inline-block;
    width: auto;
    margin-left: 0;
    margin-right: 5px;
}

#agreement-list-result .detail-link.less .toggle {
    transform: rotate(180deg);
}

/*------------- CMS content -------------*/
.cms-content figcaption {
    color: #7E96A9;
    font-style: italic;
    font-size: 13px;
}

.cms-content .box-figure {
    margin: 15px auto;
    padding: 15px 30px 15px 45px;
    border: 1px solid #7E96A9;
    border-radius: 3px;
}

.page-methodology .cms-content .term .terms-inner-wrapper .box-figure ol li {
    border-left: 0;
}

.cms-content ol {
    margin: 0 0 1.5em;
    padding: 0;
    counter-reset: item;
}

    .cms-content ol > li {
        margin: 0;
        padding: 0 0 0 2em;
        text-indent: -2em;
        list-style-type: none;
        counter-increment: item;
    }


        .cms-content ol > li:before {
            display: inline-block;
            width: 1em;
            padding-right: 0.5em;
            font-weight: bold;
            text-align: right;
            content: counter(item) ".";
        }


    .cms-content ol.alphabetical-list {
        list-style-type: lower-alpha;
        margin: 1em 2em 1.5em;
        padding: 1em 1em;
        counter-reset: item;
        border-left: none;
    }

        .cms-content ol.alphabetical-list > li {
            margin: 0;
            padding: 0 0 0 2em;
            text-indent: -2em;
            list-style-type: lower-alpha;
            counter-increment: item;
            position: relative;
            border-left: none !important;
            content: counter(item, lower-alpha) ") ";
        }

            .cms-content ol.alphabetical-list > li:before {
                content: ")";
                position: absolute;
                display: inline-block;
                left: -0.6em;
            }

.blue-border-around-text {
    border: 1px solid #08AAEE; /* darker blue #516B88; */
    padding: 1em;
    border-radius: 5px
}



div.screen-shot-list-counter {
    counter-reset: screenshots-counter;
}

.cms-content ol.screen-shot-ordred-list {
    list-style: none;
    margin: revert!important;
    padding: revert!important;
    counter-reset: initial!important;
}

    .cms-content ol.screen-shot-ordred-list li {
        counter-increment: screenshots-counter;
        padding: 0 0 1em 0;
    }

        .cms-content ol.screen-shot-ordred-list li::before {
            content: counter(screenshots-counter) ". ";
            color: #385577; /*#be1e2d;*/
            font-weight: bold;
            margin-left: -1em;
        }

    .page-methodology .term .terms-inner-wrapper .item-description ul.list-style-bullets {
    /*  padding-left: 2em;*/
    list-style-type: disc;
    padding: 1em 2em;
}

.cms-content a {
    color: #1E90FF;
}

.cms-content table th {
    color: #002060;
    font-weight: bold;
}

.cms-content figure {
    margin: 15px auto;
    max-width: 80%;
    width: 100%;
}

.cms-content .table-boxed td {
    vertical-align: middle;
}

    .cms-content .table-boxed td ul {
        list-style-type: disc;
    }

    .cms-content .table-boxed td:first-child {
        background: #F9F9F9;
        font-weight: bold;
    }
.page-methodology .term .terms-inner-wrapper .item-description li {
    border-left: 0;
}
/* Resources - FAQ -  align this to the right for Arabic! */
html:lang(ar) .page-methodology .term .terms-inner-wrapper .item-description li {
    border-right: 0;
}

.page-methodology .term .terms-inner-wrapper .item-description ul {
    padding-left: 40px;
}

html:lang(ar) .page-methodology .term .terms-inner-wrapper .item-description ul {
    padding-right: 40px;
}

.page-methodology .term .terms-inner-wrapper .item-description ul ul,
.page-methodology .term .terms-inner-wrapper .item-description figure ul {
    list-style-type: disc;
    padding-left: 40px;
}

html:lang(ar) .page-methodology .term .terms-inner-wrapper .item-description ul ul,
html:lang(ar) .page-methodology .term .terms-inner-wrapper .item-description figure ul {
    padding-right: 40px;
}


.page-methodology .term .terms-inner-wrapper .bullet-ordered {
    padding-left: 40px;
}

html:lang(ar) .page-methodology .term .terms-inner-wrapper .bullet-ordered {
    padding-right: 40px;
}

.page-methodology .term .terms-inner-wrapper .bullet-ordered li {
    list-style-type: disc;
    border-left: 0;
}

html:lang(ar) .page-methodology .term .terms-inner-wrapper .bullet-ordered li {
    border-right: 0;
}


/*------------- Page 404 -------------*/
.page-404 {
    display: flex;
    flex-direction: column;
    height: 100vh;
}


    .page-404 .hero-banner {
        flex: 1 0 auto;
        height: auto;
    }

        .page-404 .hero-banner:before {
            background: linear-gradient(180deg, rgba(3, 43, 85, 0.7) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.1 ) 100%)
        }

        .page-404 .hero-banner .inner-wrapper {
            padding: 30px 0;
        }

        .page-404 .hero-banner .sub-title {
            text-shadow: 5px 0px 8px rgba(0,0,0,0.5);
        }

        .page-404 .hero-banner .block-actions {
            margin: 30px auto;
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .page-404 .block-actions .txt-or {
        padding: 0 15px;
        font-weight: bold;
        color: #fff;
        text-transform: uppercase;
    }
    .page-404 .block-actions a {
        margin: 0 15px;
        padding: 6px 30px;
        text-transform: uppercase;
        display: block;
        width: 100%;
        line-height: 57px;
        border: 0;
        text-align: center;
        background: #032B55;
        border-radius: 2px;
        color: #fff;
        letter-spacing: 1px;
        transition: background-color 0.3s ease-out;
        cursor: pointer;
    }



    .page-404 .hero-banner {
        flex: 1 0 auto;
        height: auto;
    }

        .page-404 .hero-banner:before {
            background: linear-gradient(180deg, rgba(3, 43, 85, 0.7) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.1 ) 100%)
        }

        .page-404 .hero-banner .inner-wrapper {
            padding: 30px 0;
        }

        .page-404 .hero-banner .sub-title {
            text-shadow: 5px 0px 8px rgba(0,0,0,0.5);
        }

        .page-404 .hero-banner .block-actions {
            margin: 30px auto;
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .page-404 .block-actions .txt-or {
        padding: 0 15px;
        font-weight: bold;
        color: #fff;
        text-transform: uppercase;
    }
    .page-404 .block-actions a {
        margin: 0 15px;
        padding: 6px 30px;
        text-transform: uppercase;
        display: block;
        width: 100%;
        line-height: 57px;
        border: 0;
        text-align: center;
        background: #032B55;
        border-radius: 2px;
        color: #fff;
        letter-spacing: 1px;
        transition: background-color 0.3s ease-out;
        cursor: pointer;
    }


        .page-404 .block-actions a:focus,
        .page-404 .block-actions a:hover {
            background-color: #194d83;
        }

    .page-404 .block-actions .txt-or {
        text-shadow: 5px 0px 8px rgba(0,0,0,0.5);
    }


/*------------- Page Resource - Product Search -------------*/
.page-product-search .results-panel {
    display: block;
}

.page-product-search #market-access-query-form .keyword-input {
    max-width: 605px;
    margin-right: 40px;
}


    .page-product-search #market-access-query-form .keyword-input .input {
        background: none;
    }

.page-product-search #market-access-query-form .country-selection.hidden + .keyword-input {
    max-width: 880px;
    margin-right: 40px;
}

.page-product-search .search-result-detail ul {
    list-style-type: none;
    background: #FFF;
}


.page-product-search .search-result-detail .section-listing {
    padding: 0;
}


.page-product-search .search-result-detail .section-listing {
    padding: 0;
}

    .page-product-search .search-result-detail .section-listing > li .section-heading {
        vertical-align: middle;
        width: 100%;
        font-size: 17px;
        vertical-align: middle;
        font-weight: bold;
        padding: 0px 15px;
        margin: 5px 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 10px 0;
    }

        .page-product-search .search-result-detail .section-listing > li .section-heading > .txt {
            display: flex;
        }

        .page-product-search .search-result-detail .section-listing > li .section-heading .txt-name {
            display: flex;
            justify-content: space-between;
            padding: 5px 15px;
            margin-right: 10px;
            height: 36px;
            width: 200px;
            background: #7E96A9;
            color: #FFF;
            cursor: pointer;
            flex: 1 0 auto;
            white-space: nowrap;
        }

        .page-product-search .search-result-detail .section-listing > li .section-heading .txt-description {
            line-height: 35px;
            color: #7E96A9;
        }


    .page-product-search .search-result-detail .section-listing > li .section-heading {
        vertical-align: middle;
        width: 100%;
        font-size: 17px;
        vertical-align: middle;
        font-weight: bold;
        padding: 0px 15px;
        margin: 5px 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 10px 0;
    }

        .page-product-search .search-result-detail .section-listing > li .section-heading > .txt {
            display: flex;
        }

        .page-product-search .search-result-detail .section-listing > li .section-heading .txt-name {
            display: flex;
            justify-content: space-between;
            padding: 5px 15px;
            margin-right: 10px;
            height: 36px;
            width: 200px;
            background: #7E96A9;
            color: #FFF;
            cursor: pointer;
            flex: 1 0 auto;
            white-space: nowrap;
        }

        .page-product-search .search-result-detail .section-listing > li .section-heading .txt-description {
            line-height: 35px;
            color: #7E96A9;
        }

.page-product-search .search-result-detail ul[data-level="2"] {
    font-size: 16px;
}

.page-product-search .search-result-detail ul[data-level="4"] {
    font-size: 15px;
}

.page-product-search .search-result-detail ul[data-level="6"] {
    font-size: 14px;
}

.page-product-search .search-result-detail ul[data-level="8"] {
    font-size: 13px;
}

.page-product-search .search-result-detail .product-by-section ul[data-level="4"] li {
    background: #FFF;
}

.page-product-search .search-result-detail .product-by-section li .item-title {
    padding: 5px 0;
    font-weight: bold;
    color: #032B55;
    display: flex;
    align-items: flex-start;
}

.page-product-search .search-result-detail ul[data-level="2"] > li > .item-title {
    align-items: center;
}

.page-product-search .search-result-detail .product-by-section li li .item-title {
    color: #333;
}

.page-product-search .search-result-detail ul[data-level="6"] li .item-title {
    font-weight: normal;
}

.page-product-search .search-result-detail .product-by-section li li .item-title .txt {
    display: flex;
    align-items: flex-start;
}

.page-product-search .search-result-detail .product-by-section li li .item-title .product-code {
    background: #F9F9F9;
    color: #032B55;
}


    .page-product-search .search-result-detail .product-by-section li li .item-title .product-code span {
        margin-right: 3px;
    }


    .page-product-search .search-result-detail .product-by-section li li .item-title .product-code span {
        margin-right: 3px;
    }


        .page-product-search .search-result-detail .product-by-section li li .item-title .product-code span:nth-child(n+3) {
            margin-right: 0;
        }

.page-product-search .search-result-detail .product-by-section li li .item-title .product-name {
    line-height: 33px;
}

.page-product-search .search-result-detail .product-by-section li li .item-title .product-code span:nth-child(2n) {
    color: #7E96A9;
}

.page-product-search .search-result-detail .product-by-section li:nth-child(2n+1) {
    background: #F9F9F9;
}

    .page-product-search .search-result-detail .product-by-section li:nth-child(2n+1) li {
        background: #FFF;
    }

.page-product-search .search-result-detail .product-by-section .product-code {
    padding: 5px 10px 5px 10px;
    margin-right: 5px;
    background: #032B55;
    color: #FFF;
    cursor: pointer;
}


/*------------- Page About - Data Availability (new proposal) -------------*/
.page-data-availability #top-tab-list {
    display: flex;
    border-bottom: 1px solid #7E96A9;
}

.page-data-availability .nav-sub-tabs {
    background: #FAFAFA;
}

.page-data-availability .nav-tabs > li a {
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.page-data-availability .table tfoot tr {
    background: #032b55;
}

.page-data-availability .container .results-panel .results table tfoot td {
    color: #FFF;
    font-weight: bold;
}

.page-data-availability .map-type-list {
    display: flex;
}

#datatable-applied-tariffs_wrapper,
#tariff-tate-quotas-tariffs_wrapper,
#non-tariff-measures-tariffs_wrapper {
    /*overflow: scroll;*/
}

.table-bottom:empty {
    padding: 0;
}

.pivot-table {
    overflow: scroll;
    position: relative;
    max-height: 650px;
}

    .pivot-table.loading {
        overflow: hidden;
    }

    .pivot-table .row {
        display: flex;
        position: relative;
    }

        .pivot-table .row .cell {
            border-left: 1px solid #eee;
            border-bottom: 1px solid #eee;
            padding: 5px 10px;
            text-align: center;
            flex-basis: 150px;
            width: 150px;
            max-width: 150px;
            flex: 1 0 auto;
        }

            .pivot-table .row .cell:first-child {
                flex-basis: 200px;
                width: 200px;
                max-width: 200px;
                flex: 1 0 auto;
                position: sticky;
                left: 0;
                background: #fff;
            }


            .pivot-table .row .cell:nth-child(2) {
                margin-left: 15px;
            }

        .pivot-table .row.first,
        .pivot-table .row.last {
            position: sticky;
            background: #fff;
            z-index: 1;
        }

        .pivot-table .row.first {
            top: 70px;
        }

        .pivot-table .row.first,
        .pivot-table .row.last {
            position: sticky;
            background: #fff;
            z-index: 1;
        }

        .pivot-table .row.first {
            top: 70px;
        }

        .pivot-table .row.last {
            bottom: 0;
        }

            .pivot-table .row.first .cell,
            .pivot-table .row.last .cell {
                background: #032b55;
                color: #fff;
                font-weight: bold;
                padding: 8px 0;
            }

.table-pivot-fitler {
    background: #7E96A9;
    color: #FFF;
    border-bottom: 0;
    padding: 15px 15px;
    display: flex;
    justify-content: space-between;
    align-content: center;
    position: sticky;
    left: 0;
    right: 0;
    top: 0;
    z-index: 2;
    height: 70px;
}

    .table-pivot-fitler input {
        margin-left: 10px;
        color: #333;
    }

    .table-pivot-fitler .dropdown-menu {
        color: #333;
        max-height: 150px;
        overflow: scroll;
        z-index: 2;
    }

        .table-pivot-fitler .dropdown-menu li:hover {
            background: #eee;
        }

        .table-pivot-fitler .dropdown-menu li {
            padding: 5px 10px;
        }

.pivot-table .country-name {
    display: block;
    width: 100%;
    text-align: left;
}

/*------------- Page Availability -------------*/
.page-data-availability .nav-tabs > li {
    flex: 1 0 auto;
}

.page-data-availability .map-filters {
    position: relative;
    display: flex;
    padding-top: 13px;
    padding-right: 10px;
}

.page-data-availability .container .results-panel .map-instrument .input {
    width: 100%;
    padding-left: 0;
}

.page-data-availability .chosen-container .chosen-single span {
    text-indent: 5px;
    font-size: 15px;
    text-transform: capitalize;
}

.page-data-availability .chosen-container .chosen-results li {
    text-transform: capitalize;
}

.page-data-availability .chosen-container .chosen-drop {
    font-weight: normal;
}

.page-data-availability .map-filters span {
    text-transform: none;
}

.page-data-availability .map-filters .chosen-container {
    border-bottom: 0;
}

.page-data-availability .map-filters .map-instrument {
    width: 380px;
}

.page-data-availability .map-filters .filter-section-heading {
    position: relative;
    z-index: 1;
    margin-bottom: 30px;
    font-weight: bold;
    color: #FFF;
    white-space: nowrap;
    text-transform: uppercase;
}

.page-data-availability .styled-tooltip ul {
    margin: 0;
}

.mobile-warning-main-content {
    display: none;
    /*color: #ff0000;*/
    padding: 15px;
    font-size: 18px;
    text-align: center;
}

/*------------- Responsive style -------------*/
/*------------- ---------------- -------------*/
@media (max-width: 1199px) {

    /* Twitter timeline frame on the home page*/
    /* when it's responsive, change the height for the twitter timeline to be auto (and not 510px)*/
    .block-twitter .twitter-timeline {
        height: auto;
    }

    .footer-white {
        background-color: #FFFFFF;
    }

    /* NTM Regulatory Requirements - table results summary wrapper for the 
        Home - query results page, 
        as well as the Access - Regulatory Requirements page*/
    .measure-summary {
        color: #062B55; /* #041B35 ; */
        /* font-size: 0.9em; font now defined in measure-summary-wrapper*/
        font-style: normal;
        font-weight: 500;
        /*  line-height: 130%; */
    }

    .measure-summary-wrapper {
        display: flex;
        flex-grow: 1;
        font-weight: 500;
        font-size: 1.3em;
        line-height: 1.5em;
    }
        .measure-summary-wrapper > span {
            font-weight: 500;
        }

    .modal-content.modal-content-no-border {
        position: relative;
        background-color: #fff;
        -webkit-background-clip: unset;
        background-clip: unset;
        border: 0;
        outline: 0;
        -webkit-box-shadow: 0;
        border-radius: unset;
        box-shadow: none;
    }

    .req-title {
        font-weight: 500;
        font-size: 0.9em; /* 13px*/
        line-height: 1.2em; /* 15px;*/
        color: #041B35;
    }
    .ntm-detail-responsive {
        
    }
    .req-detail{
       
        padding: 0;
        list-style-type: none;
    }

    span.measure-property {
        color: #0073A4;
    }

    .req-detail li{
        padding: 1em 0em;
    }
        .more-data-container {
        padding: 0px;
        width: -webkit-fill-available;
    }

    .modal-header {
        padding: 1em;
        border: 0;
    }

    .home #market-access-query-form .d-flex,
    .page-access-overview #market-access-query-form .d-flex,
    .page-trade-agreement #trade-agreement-query-form .d-flex {
        flex-wrap: wrap;
    }

    /* centre the submit button on small screens */
    .home #market-access-query-form .search-submit-wrapper,
    .page-access-overview #market-access-query-form .search-submit-wrapper {
        max-width: 100%;
        display: flex;
        justify-content: center; /* flex-end; */
    }

    .home #market-access-query-form .search-submit-wrapper button,
    .page-access-overview #market-access-query-form .search-submit-wrapper button {
        max-width: 196px;
    }

    .module-list {
        padding: 35px 0;
    }

    .tax-module-list {
        /*    padding: 35px 0;*/
        padding: 0px 0;
    }

    .home #market-access-query-form .country-selection,
    .page-access-overview #market-access-query-form .country-selection {
        max-width: 25%;
    }


    /* for the search form on the Home page, Access - Customs Duties page */
    .home #market-access-query-form .product-selection,
    .page-access-overview #market-access-query-form .product-selection,
    .page-access-detail #market-access-query-form .product-selection /* ACCESS Customs Tariffs page, Trade Remedies page and Regulatory Requirements page */ 
    {
        max-width: 100%; /* 50% */
        display: flex;
        flex-direction: column;
    }
    .search .search-input-group .product-label {
        /*display: inline-block;
        vertical-align: text-top;
        text-align: left;
        float: left;*/
        order: 1;
    }
    .chosen-container {
        /* width: auto;*/
    }

    .page-access-overview #market-access-query-form .search-input-group.ntlc-wrapper {
        min-width: -webkit-fill-available;
        /* max-width: min-content; */
        max-width: 20vw;
        width: auto;
    }
    .search .search-input-group .product-switch {
        order: 4;
    }

    .search .search-input-group .clearfix {
        order: 2;
    }

    .search .search-input-group .input {
        order: 3;
    }

    .search .search-input-group .find-product {
        order: 5;
        text-align:left;
    }

    /* Home page - product search - align this to the right for Arabic! */
    html:lang(ar) .search .search-input-group .find-product {
        text-align: right;
    }

    .search-input-group product-selection.product-label{
        order:1;
    }
    .search-input-group product-selection.product-switch {
        order: 5;
    }
    .search-input-group product-selection.clearfix {
        order: 2;
    }

    .search-input-group product-selection.input product {
        order: 3;
    }

    .search-input-group product-selection.find-product {
        order: 4;
    }

    .mobile-warning {
        display: block;
    }
}

@media (max-width: 992px) {
    .module-list .boxes {
        flex-wrap: wrap;
    }

    .module-list .boxes .box {
        flex: 1 0 auto;
        max-width: 48%;
        margin: 0.2em;
    }
}

#model-regions-about {
    display: block;
}

#model-regions-about-responsive {
    display: none;
}

.discover-tools {
    display: none;
}

div.twitter-title {
    display: none;
}


footer-responsive {
    display: none;
}

#footer-responsive {
    display: none;
}


#methodology-dropdown-heading, #data-avalability-dropdown-heading {
    display: none;
}



.page-title {
    display: none;
}



/* was 767px */
/* now 991.98px changes to responsive screen as we've just added the Learn menu item */
/* @media (max-width: 991.98px) {*/
@media (max-width: 1199px) {

    .page-resources-detail .block-actions {
        padding: 1em 1em;
    }

        .page-resources-detail .block-actions .toggle-all {
            font-style: normal;
            font-weight: 500;
            font-size: 0.8em;
            line-height: 1em;
            /* identical to box height, or 115% */
            text-decoration-line: underline;
            /* #516B88 70% */
            color: #516B88;
        }

    /* don't show the up and down arrows for Close All and Open All toggle links*/
    .page-resources-detail .toggle {
        all: unset;
    }


    #methodology-dropdown-heading, #data-avalability-dropdown-heading {
        display: block;
        background: #FFFFFF;
        /* /#6A8099 60% */
        border: 1px solid #6A8099;
        box-sizing: border-box;
        border-radius: 5px;
        margin: 1em 1em;
        width: 90%;
        font-style: normal;
        font-weight: bold;
        font-size: 0.8em;
        line-height: 1em;
        /* identical to box height */
        /* /#385577 80% */
        color: #385577;
        padding: 0.6em 0.5em;
    }


        #methodology-dropdown-heading option,
        #data-avalability-dropdown-heading option {
            font-style: normal;
            font-weight: bold;
            font-size: 1em;
            line-height: 1.2em;
            /* identical to box height */
            /* /#385577 80% */
            color: #385577;
        }

    .page-resources-detail .block-content {
        /*  box-shadow: 0px 1px 10px #f9f9f9;*/
        /*   width: max-content; */
    }

    .page-resources-detail .term:nth-child(2n) .term-group .group-text {
        all: unset;
    }

    .page-methodology .term .item-title {
        padding: 0;
    }

    /* for the titles of terms in the Methodology page and also the Glossary */
    /* also for the Product Search page*/
    .page-resources-detail .term .terms-by-group .term-name.term-detail-piece,
    .page-methodology .term .terms-inner-wrapper li .item-title {
        padding: 0.5em 0.5em;
        position: relative;
        display: flex;
        justify-content: space-between;
        /*   transition: color 0.2s ease-out, background 0.2s ease-out;*/
        /* margin: 1em 1em;*/
        transition: none;
        min-height: 4em;
        background: #E6EAEE !important;
        border-radius: 5px;
        margin-bottom: 1em;
        font-style: normal;
        font-weight: 500;
        font-size: 13px;
        line-height: 15px;
        /* identical to box height, or 115% */
        /* #062B55 */
        color: #062B55;
        width: 100%;
        align-items: center
    }

    /* Glossary - search for a term - in the results, for the search term to not be justified if it appears in the title*/
    .page-resources-detail .term .terms-by-group .term-name.term-detail-piece {
        /* justify-content: normal;*/
    }
    /* remove the dashed left border when using  small screens */
    .page-methodology .term .terms-inner-wrapper .item-lv-1 .item-title, .page-methodology .term .terms-inner-wrapper .item-lv-2 .item-title {
        border-left: none; /*1px dashed #002060;*/
    }

    /* remove the angled dash line that is associated with level 2 menu items*/
    .page-methodology .term .terms-inner-wrapper .item-lv-1::before, .page-methodology .term .terms-inner-wrapper .item-lv-2:before {
        all: unset;
        border-left: none; /*1px dashed #002060;*/
    }

    .page-methodology .term .terms-inner-wrapper .item-lv-1 .item-title:before, .page-methodology .term .terms-inner-wrapper .item-lv-2 .item-title:before {
        all: unset;
        border-left: none; /*1px dashed #002060;*/
    }


    .page-methodology .term .terms-by-group {
        /*   padding: 0.2em; */
    }

    /* to have the product code above the item's title for mobiles  */
    .page-product-search .search-result-detail .product-by-section > li .item-title {
        display: flex;
        flex-direction: column;
        align-items: flex-start !important;
        padding: 5px;
        border-radius: 3px;
    }

    /* for the actively (expanded) term in Methodology and Glossary and product search */
    /* SEARCH PRODUCT - when the title has been selected - make the background pale blue */
    .page-product-search .search-result-detail .section-listing > li .section-heading:not(.collapsed),
    .page-resources-detail .term .terms-by-group .term-name.term-detail-piece:not(.collapsed),
    .page-methodology .term .terms-inner-wrapper li .item-title:not(.collapsed),
    .page-product-search .search-result-detail .product-by-section li li .item-title:not(.collapsed),
    .page-product-search .search-result-detail .product-by-section li .item-title:not(.collapsed) {
        color: #0073A4; /* pale BLUE*/
        background-color: rgba(0, 115, 164, 0.2) !important;
        border-radius: 5px;
    }

    .page-product-search .search-result-detail .product-by-section li .item-title .product-code {
        background: #385577;
        color: white;
        border-radius: 3px;
    }
    /* for 2 levels in, make the product code have a darker navy #516B88 background and white text*/
    .page-product-search .search-result-detail .product-by-section li li .item-title .product-code {
        background: #516B88;
        color: white;
    }

    /* for 3 levels in, make the product code have a grey background and white text*/
    .page-product-search .search-result-detail .product-by-section li li li .item-title .product-code {
        background: #6A8099; /*  and #516B88 for a level higher*/
        color: white;
    }

    /* Product search results - for all the levels except the top level, the left indent should be much smaller for mobiles */
    .page-product-search .search-result-detail ul[data-level="2"] {
        padding-left: 0.6em; /* or padding-left: 0; to remove the indent completely */
    }

    .page-product-search .search-result-detail ul[data-level="3"] {
        padding-left: 0.6em;
    }

    .page-product-search .search-result-detail ul[data-level="4"] {
        padding-left: 0.6em;
    }

    .page-product-search .search-result-detail ul[data-level="5"] {
        padding-left: 0.6em;
    }

    .page-product-search .search-result-detail ul[data-level="6"] {
        padding-left: 0.6em;
    }

    .page-methodology .term .terms-inner-wrapper li {
        position: relative;
        border-left: none /*1px dashed #002060;*/;
    }

    .page-methodology .term .item-title {
        /* padding: 7px 15px; */
        /* font-weight: bold; */
    }


    .cms-content figure {
        /* margin: 15px auto; */
        /* max-width: 80%; */
        /* width: 100%; */
        margin: 0px auto;
        max-width: 100% !important;
        width: 100%;
        margin: 0px auto !important; /*15px auto;*/
    }

    .page-methodology .term .terms-inner-wrapper .item-lv-1 {
        padding-left: 0px; /*20px;*/
    }

    .page-methodology .term .terms-inner-wrapper .item-lv-2 {
        padding-left: 4px; /* 40px;*/
    }

    .page-methodology .term .terms-inner-wrapper ul {
        position: relative;
        list-style-type: none;
        padding-left: 5px; /* 20px; */
    }

    #cd img {
        max-width: 100% !important;
    }

    .page-methodology .term .item-description {
        padding: 0;
    }

    .cms-content .box-figure {
        margin: 0 auto; /*15px auto;*/
        /* padding: 15px 30px 15px 45px; */
        padding: 0em 0em;
        border: none; /*1px solid #7E96A9;*/
        border-radius: 3px;
    }

    /* table to have less padding on the left*/
    .page-methodology .term .terms-inner-wrapper .item-description ul ul, .page-methodology .term .terms-inner-wrapper .item-description figure ul {
        list-style-type: disc;
        padding-left: 1.2em;
    }

    .terms-breadcrumb {
        color: #385577;
        font-size: 0.8em;
        font-weight: 600;
        background-color: #FFFFFF;
        line-height: 1.0em;
    }
    #cd > .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
        padding: 1px;
        line-height: 1.42857143;
        vertical-align: top;
        border-top: 1px solid #ddd;
    }

    .page-methodology .term .terms-inner-wrapper .item-lv-2:after {
        content: "";
        position: absolute;
        left: 0; /* 40px;*/
        top: 0;
        height: 100%;
        width: 1px;
        background: #FFF;
        border-left: none; /*1px dashed #002060;*/
    }


    .page-resources-detail .term:nth-child(2n+1) .term-group .group-text {
        background: transparent;
        color: #7E96A9;
        font-style: normal;
        font-weight: 500;
        font-size: 13px;
        line-height: 15px;
        /* identical to box height, or 115% */
        /* #062B55 */
        color: #062B55;
        align-content: center;
        text-align: left;
    }

    /* Glossary - gruop-text align it to the right for Arabic! */
    html:lang(ar) .page-resources-detail .term:nth-child(2n+1) .term-group .group-text {
        all: unset;
        text-align: right;
    }


    /* Dec9 - PRODUCT SEARCH item title level 1 */
    .page-product-search .search-result-detail .section-listing > li .section-heading, .page-product-search .search-result-detail .product-by-section > li .item-title, .page-product-search .search-result-detail .product-by-section > li > li .item-title, .term-group {
        margin: 1em 1em;
        min-height: 4em;
        background: #E6EAEE !important;
        border-radius: 5px;
        margin-bottom: 1em;
        font-style: normal;
        font-weight: 500;
        font-size: 13px;
        line-height: 15px;
        /* identical to box height, or 115% */
        /* #062B55 */
        color: #062B55;
    }

    /* Product Search results - let's get rid of the margin on the left for mobiles*/
    .page-product-search .search-result-detail .section-listing > li, .page-product-search .search-result-detail.section-heading {
        margin: 0;
    }
        .page-product-search .search-result-detail .section-listing > li .section-heading,
        .page-product-search .search-result-detail .product-by-section > li .item-title,
        .page-product-search .search-result-detail .product-by-section > li li .item-title,
        .page-product-search .search-result-detail .product-by-section > li li li .item-title {
            margin-left: 0;
        }

            /* Dec9 - PRODUCT SEARCH item title level 1 */
            .page-product-search .search-result-detail .section-listing > li .section-heading .txt-name {
                background: #062B55;
                margin-top: 0.7em;
                border-radius: 3px;
            }


        /* Dec9 - product search - title items */
        .page-product-search .search-result-detail .section-listing > li .section-heading,
        .page-product-search .search-result-detail .product-by-section > li .item-title,
        .page-product-search .search-result-detail .product-by-section > li > li .item-title,
        .page-resources-detail .term .term-group {
            text-align: left;
            width: auto;
            align-items: center;
        }

            .page-resources-detail .term .term-group toggle {
                display: none;

            }


    #footer-responsive > div.lighter > h3 {
        color: #CDD5DD;
        font-weight: 500;
        font-size: 1.7em;
        line-height: 2.0em;
    }

    #footer-responsive > div.lighter > div > div > div.sponsors > h3,
    #footer-responsive > div.lighter > div > div > div.partners > h3 {
        color: #CDD5DD;
        font-weight: 500;
        font-size: 1.7em;
        line-height: 2.0em;
    }

    #footer-responsive > div.lighter > div > div > div.sponsors,
    #footer-responsive > div.lighter > div > div > div.partners {
        text-align: center;
        /*  padding: 2em 2em;
        margin: 1em 1em 1.5em 0.5em;*/
    }

        /* a line under Partners */
        /* 
    #footer-responsive > div.lighter > div > div > div.partners {
        border-bottom: solid 1px yellow; 
    }*/

        #footer-responsive > div.lighter > div > div > div.sponsors > a {
            margin: 1em;
        }

    #footer-responsive > div.lighter > div > div > div.navigation-bottom > nav {
        font-size: 1em;
        line-height: 1.6em;
        font-weight: 300;
    }

        /* for the top level menu items to be blue */
        #footer-responsive > div.lighter > div > div > div.navigation-bottom > nav > ul > li > a {
            color: #4FCBFF;
            font-size: 1.4em;
            font-weight: 500;
            line-height: 2.4em;
            padding: 1.5em 1.5em;
        }

        /* hide the Accounts /Sign in and language switch options in the Footer navigation */
        #footer-responsive > div.lighter > div > div > div.navigation-bottom > nav > ul.main-nav.right-nav > li.menu-item-accounts {
            display: none;
        }

    footer-responsive .lighter .row-container .row {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100vw;
    }

    footer-responsive .lighter .row-container .contact-details {
        /* border: 1px solid red;*/
    }

        footer-responsive .lighter .row-container .contact-details .contact-info {
            /*   border: 1px solid blue;*/
            /*   padding: 1em 1em;*/
            display: flex;
            align-items: unset;
            font-size: 1em;
            font-weight: 500;
            line-height: 1.2em;
        }

    footer-responsive .lighter .row-container .social h3 {
        color: #CDD5DD;
        font-weight: 500;
        font-size: 1.7em;
        line-height: 2.0em;
    }

    #footer-responsive > div.lighter > div > div > div.navigation-bottom {
        display: flex;
        align-items: unset;
        flex-direction: column;
        text-align: center;
    }

    footer-responsive .lighter .row-container .social a:hover {
        text-decoration: none;
    }

    #footer-responsive > div.lighter > div > div > div.social {
        justify-content: unset;
        text-align: center
    }

    #footer-responsive > div.lighter > div > div > div.navigation-bottom > h3 {
        color: #CDD5DD;
        font-weight: 500;
        font-size: 1.7em;
        line-height: 2.0em;
    }

    #footer {
        display: none;
    }

    footer-responsive {
        display: block;
    }

    #footer-responsive {
        display: block;
    }

    footer-responsive {
        color: #fff;
    }

        footer-responsive .lighter {
            background-color: #364454;
            padding: 90px 0 30px;
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        footer-responsive .darker {
            background-color: #313E4D;
            padding: 20px 0;
            font-size: .875em;
        }

        footer-responsive .title {
            font-size: 18px;
            text-transform: uppercase;
            font-weight: 500;
            margin: 0 0 22px 0;
        }

        footer-responsive ul {
            margin: 0;
            padding: 0;
        }

            /* spacing and padding between the menu items in the footer*/
            footer-responsive ul li {
                list-style: none;
                margin: 0 0 5px 0;
                padding: 0.2em 0.2em
            }

        footer-responsive a {
            color: #fff; /* !important*/
        }

        footer-responsive .block-sponsors a:hover,
        footer-responsive .block-sponsors a:focus {
            text-decoration: none;
        }

        footer-responsive .block-partners a:hover,
        footer-responsive .block-parnters a:focus {
            text-decoration: none;
        }

        footer-responsive p {
            color: #fff;
            max-width: 530px;
        }

        footer-responsive img {
            margin-bottom: 30px;
            max-width: 540px;
        }

        footer-responsive .block-sponsors .title {
            padding-left: 5px;
        }




    /* Hide the Other Tools section on mobile which lists in great detail all the other tools*/
    .col-md-8.block-other-tools {
        display: none;
    }

    .discover-tools {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 6em;
    }

    .discover-icon {
        display: block;
        content: '';
        background-image: url('../png/discover-icon-sml.png');
        background-repeat: no-repeat;
        height: 100px; /* You must set a specified height */
        width: 100px;
        background-position: center; /* Center the image */
        background-size: cover; /* Resize the background image to cover the entire container */
    }

    .discover-tools h3 {
        color: #062B55; /* previously  #043c76; */
        line-height: 2em; /* 26px;*/
        margin-bottom: 45px;
        font-weight: 500;
        font-size: 1.7em;
        text-align: center;
    }

    .discover-tools hr {
        margin-top: 0px;
        margin-bottom: 3em;
        border-top: 4px solid #08AAEE;
        width: 25%;
    }

    .css-button-rounded {
        background: #fff; /*#2fc974; */
        border: 2px solid #0073A4;
        color: #0073A4;
        font-weight: 600;
        display: block;
        padding: 2em 1em;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
        width: 46%;
        border-radius: 5px;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    }

    .css-button-rounded {
        -webkit-border-radius: 0.5em;
        -moz-border-radius: 0.5em;
        -ms-border-radius: 0.5em;
        -o-border-radius: 0.5em;
    }


        .css-button-rounded:hover {
            background: #CDD5DD; /*#E6EAEE;*/
            text-decoration: none;
        }

    div.col-md-4.block-twitter {
        width: 100%;
    }


        div.col-md-4.block-twitter .twitter-container {
            border: 1px solid #CDD5DD;
            border-radius: 5px;
            box-sizing: border-box;
            box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        }



    div.twitter-title {
        /* display: block;*/
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 6em;
    }

    div.col-md-4.block-twitter h3 {
        color: #062B55;
        line-height: 2em;
        margin-bottom: 45px;
        font-weight: 500;
        font-size: 1.7em;
        text-align: center;
    }

    div.col-md-4.block-twitter hr {
        margin-top: 0px;
        margin-bottom: 3em;
        border-top: 4px solid #08AAEE;
        width: 25%;
    }


    .home-about .container h3 {
        line-height: 26px;
        margin-bottom: 45px;
        color: #062B55; /*#043c76*/
        text-align: center;
    }



    .model-regions-about h3 {
        color: #062B55; /* previously  #043c76; */
        line-height: 2em; /* 26px;*/
        margin-bottom: 45px;
        font-weight: 500;
        font-size: 1.7em;
        text-align: center;
    }




    /******************************************************/



    .ui-selectmenu-menu.ui-front {
        color: #CC464F;
        border: 3px solid #CDD5DD;
        box-sizing: border-box;
        border-radius: 5px;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        width: 100%;
        font-size: 1.2em;
        line-height: 2em;
        width: fit-content !important;
        z-index: 11;
    }


    .ui-selectmenu-menu option:checked {
        color: #CC464F;
    }


    .model-regions-about select {
        color: #CC464F;
        border: 1px solid #CDD5DD;
        box-sizing: border-box;
        border-radius: 5px;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        width: 100%;
        font-size: 1.2em;
        line-height: 2em;
    }

    /* option:checked { color: red; }*/
    .model-regions-about option:checked {
        color: #CC464F;
    }


    .model-regions-about:focus, .model-regions-about:focus {
        border-color: inherit;
        outline: none;
    }


    .model-regions-about option:not(:checked) {
        color: #385577;
    }


    .model-regions-about ul {
        list-style: none; /* Remove default bullets */
        /* list-style-type: circle;*/
        color: #385577; /* #0073A4; */ /*dark blue*/
        font-weight: 500;
        line-height: 1.4em;
    }


    html:lang(ar) .model-regions-about ul {
        list-style: none; /* Remove default bullets */
        margin-right: -2em;
    }

    .model-regions-about ul li::before {
        /* content: "\2022"; */ /* Add content: \2022 is the CSS Code/unicode for a bullet */
        content: "\25CB"; /* \25EF  \25CB */
        color: #CC464F; /* Change the color */
        font-weight: 800; /* If you want it to be bold */
        display: inline-block; /* Needed to add space between the bullet and the text */
        width: 1em; /* Also needed for space (tweak if needed) */
        margin-left: -1em; /* Also needed for space (tweak if needed) */
        font-size: 1.25em;
        line-height: 2em;
    }

    html:lang(ar) .model-regions-about ul li::before {
        margin-right: -1em; /* Also needed for space (tweak if needed) */
        margin-left: 0;
    }


    .model-regions-about a {
        color: #0073A4; /*dark blue*/
        font-weight: 500;
    }



    .ui-selectmenu-menu .ui-menu.customicons .ui-menu-item-wrapper {
        padding: 0.5em 0 0.5em 3em;
    }

    .ui-selectmenu-menu .ui-menu.customicons .ui-menu-item .ui-icon {
        height: 24px;
        width: 24px;
        top: 0.1em;
    }

    .ui-icon.importers-and-exporters {
        background: url('../png/exporters-importers-icon-sml.png') 0 0 no-repeat;
        background-repeat: no-repeat !important;
        background-position: left top;
        float: left;
        padding: 1em 1em;
        margin-right: 1em;
    }

    .ui-icon.policy-makers {
        background: url('../png/exporters-importers-icon-sml.png') 0 0 no-repeat;
        background-repeat: no-repeat !important;
        background-position: left top;
        float: left;
        padding: 1em 1em;
        margin-right: 1em;
    }

    .ui-icon.researchers {
        background: url('../png/exporters-importers-icon-sml.png') 0 0 no-repeat;
        background-repeat: no-repeat !important;
        background-position: left top;
        float: left;
        padding: 1em 1em;
        margin-right: 1em;
    }

    .ui-icon.trade-negotiator {
        background: url('../png/exporters-importers-icon-sml.png') 0 0 no-repeat;
        background-repeat: no-repeat !important;
        background-position: left top;
        float: left;
        padding: 1em 1em;
        margin-right: 1em;
    }

    fieldset {
        border: 0;
        width: inherit;
        margin-bottom: 2em;
    }

    .ui-icon {
        background-position: left top;
    }

    /******/



    .ui-selectmenu-menu .ui-front .ui-selectmenu-menu {
        width: 100%;
        border: 1px solid green;
    }



    .ui-widget-content {
        background: #fff;
        border: 1px solid #a6c9e2;
    }

    .ui-menu .ui-menu-item {
        line-height: 1.7rem; /* 17px */
        list-style: outside none none;
        margin: 0;
        padding: 0.2em 0.8em;
        font-size: 1.3rem; /* 13px*/
    }

    .ui-menu-item:hover {
        background-color: white;
        color: #385577;
        cursor: pointer;
    }

    .ui-menu .ui-state-focus,
    .ui-menu .ui-state-active {
        background-color: white;
        color: #385577;
        cursor: pointer;
    }


    /******************************************************/

    .model-regions-about hr {
        margin-top: 0px;
        margin-bottom: 3em;
        border-top: 4px solid #08AAEE;
        width: 25%;
    }

    #model-regions-about-responsive {
        display: flex;
        flex-direction: column;
        align-items: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }


    .model-regions-about .usecases {
        border: 1px solid #CDD5DD;
        box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
        border-radius: 5px;
        background: white;
        /*  display: flex;
        flex-direction: column;*/
        align-items: flex-start;
        padding: 2em 2em;
        width: -webkit-fill-available;
    }

    #model-regions-about {
        display: none;
    }


    .model-regions-about h4 {
        font-size: 1em;
        font-weight: 500;
        color: #6A8099;
        text-transform: uppercase;
    }

    .home-about .model-regions-about.usercase {
        display: none;
    }

    .home-about {
        background: rgba(8, 170, 238, 0.1); /*#08AAEE*/
    }

    .txt-introduction {
        display: none;
    }


    /* for the About - Methodology top banner */


    .page-title {
        display: block;
        margin: 1em 1em;
        font-style: normal;
        font-weight: bold;
        font-size: 14px;
        line-height: 16px;
        /* identical to box height, or 114% */
        /* /#385577 80% */
        color: #385577;
    }

    .hero-banner {
        height: auto;
        /*   background: url(../images/background/header-image-full.jpg) center /cover, linear-gradient(180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.5 ) 100%); */
        background: url(../jpg/header-image-full.jpg) center,linear-gradient( 180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.4) 80%, rgba(3, 43, 85, 0) 100%);
    }

        .hero-banner :before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            display: inline-block;
            background: linear-gradient(180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.1 ) 100%)
        }

    /* rounded border around the page results - for Methodology, Analyse - Trade Agreements and Glossary pages*/
    .page-methodology .tabs-container, .page-resources-glossary .tabs-container, .page-trade-agreement .tabs-container {
        margin: 2em 0.2em;
        border: 1px solid #CDD5DD;
        box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
        border-radius: 10px;
    }


    .page-data-availability .tabs-container {
        margin: 2em 0.2em;
        border: 1px solid #CDD5DD;
        box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
        border-radius: 10px;
    }

    /* COVID page */
    .page-trade-measure .tabs-container {
        margin: 0;
        border-radius: 5px 5px 0 0;
    }


        /* COVID page - for 2nd section to have red circle bullet points for each LI item */
        .page-trade-measure .tabs-container .nav-tabs {
            border: 0;
            display: flex;
            /* flex-basis: fit-content; */
            flex-wrap: wrap;
        }

    .page-trade-measure .terms-inner-wrapper ul {
        margin-right: 0;
        padding-left: 0;
        list-style: none;
    }

        .page-trade-measure .terms-inner-wrapper ul > li {
            align-items: center;
            display: flex;
            margin: 5px 0;
        }


        .page-trade-measure .terms-inner-wrapper ul li:before {
            content: url('../png/red-circle-bullet-point.png');
            /*content: '🚩';*/
            /*   border: 1px solid #808080;
            border-radius: 100%;*/
            width: 1em;
            height: 1em;
            display: inline-block;
            padding: 1em; /*0.25em*/
            line-height: 1.0;
            margin-right: 0.5em;
        }


    /* Blue title at the top of the page */
    .hero-banner .inner-wrapper .title, .main-search-container .container .search-box .title {
        font-weight: 700;
        font-size: 2.8rem; /* 36px; */
        color: #4FCBFF;
        letter-spacing: -0.21px;
        line-height: 4rem; /*40px; */
        padding: 2em 0.5em;
        z-index: 3; /* for the blue title to stand out more, over the gradient background, when on small screens*/
        margin-top: 1em; /* have a bit of space between the title and the nav bar on small screens*/
    }
    /* hide the subtitle section for small screens */
    .hero-banner .inner-wrapper .sub-title, .main-search-container .container .search-box .sub-title {
        display: none;
    }
    /*

    .tabs-container ul {
        font-family: Arial, Verdana;
        font-size: 14px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .tabs-container ul li {
            display: block;
            position: relative;
            float: left;
        }


    
    .tabs-container li ul {
        display: none;
    }

            */


    /*

    #methodology-tabs-heading ul li {
        display: block;
        position: relative;
        float: left;
    }


    .tabs-container ul li a {
        display: block;
        text-decoration: none;
        color: #ffffff;
        border-top: 1px solid #ffffff;
        padding: 5px 15px 5px 15px;
        background: #2C5463;
        margin-left: 1px;
        white-space: nowrap;
    }

        .tabs-container ul li a:hover {
            background: #617F8A;
        }

    .tabs-containerli:hover ul {
        display: block;
        position: absolute;
    }

    .tabs-container li:hover li {
        float: none;
        font-size: 11px;
    }

    .tabs-container li:hover a {
        background: #617F8A;
    }

    .tabs-container li:hover li a:hover {
        background: #95A9B1;
    }



        */

    #methodology-tabs-heading {
        display: none;
    }


    .dropdown-menu {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
        display: none;
        float: left;
        min-width: 160px;
        padding: 5px 0;
        margin: 2px 0 0;
        font-size: 14px;
        text-align: left;
        list-style: none;
        background-color: #fff;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
        border: 1px solid #ccc;
        border: 1px solid rgba(0,0,0,.15);
        border-radius: 4px;
        -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
        box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    }

    .main-search-container.search-box .sub-title {
        display: none;
    }


    .main-search-container {
        position: relative;
        background: url(../jpg/header-image-full.jpg) center 20% / cover;
        background: url(../jpg/header-image-full.jpg) center 20% / cover, linear-gradient(180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.5 ) 100%);
    }

        .main-search-container :before {
            background: linear-gradient(180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.1 ) 100%)
        }



    /* hide the entire header with the ITC logo, language switch options etc. for smaller devices */
    header {
        display: none;
    }

    #debug-db-config-display {
        display: none;
    }

    .preloader,
    .topbar,
    .clear-loading loading-effect-2 {
        display: none;
    }

    .itc-logo-simple {
        width: 2.2em;
        height: 2.2em;
        display: block;
        background-image: url(../png/itc-logo-simple.png);
        background-repeat: no-repeat;
        position: absolute;
        top: 30%;
        left: 0.625em;
        padding: 0.2em 0.2em;
    }

    .world-logo-simple {
        width: 4em;
        height: 4em;
        display: block;
        background-image: url(../png/sml-globe-blue-bg.png);
        color: rgba(255,255,255,.5);
        background-repeat: no-repeat;
        position: absolute;
        top: 30%;
        left: 3.625em;
        /*   border: pink 1px solid;*/
    }

    .navbar-toggler {
        /*  content: '';*/
        width: 4em;
        display: block;
        background-image: url("../png/sml-hamburger-simple.png");
        background-repeat: no-repeat;
        position: absolute;
        top: 30%;
        right: 0.625em;
    }


    header .culture-selection {
        position: absolute;
        top: 27px;
        left: 50%;
        transform: translateX(-50%);
    }

    header .block-logos {
        height: auto;
        padding: 15px 0;
    }

        header .block-logos .logo {
            flex-direction: column;
            align-items: unset;
        }

            header .block-logos .logo img {
                margin-right: 0;
                max-width: 90px;
            }

        header .block-logos .mm-logo {
            position: absolute;
            right: 15px;
            top: 15px;
        }

        header .block-logos .logo span {
            text-align: center;
        }

            header .block-logos .logo span strong {
                margin-top: 15px;
            }

        header .block-logos .mm-logo img {
            width: 60px;
        }


    /* for Russian, need the header to show up for the modal for Customs Tariffs on small screens*/

    .lang-ru .header-nav, .header-nav {
        height: 5em; /* 40px; */
        z-index: 9999;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }

        .header-nav > .container {
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            max-width: 100%;
            width: 100%;
            background: rgba(3, 43, 85, 0.5);
            transform: translateX(-100%);
            transition: opacity 0.2s ease-out;
            opacity: 0;
            will-change: transform;
        }

            .header-nav > .container .btn-close {
                display: inline-block;
                position: fixed;
                top: 1.3em;
                right: 3.2em;
                background: transparent;
                width: 3em;
                border: 0;
                outline: 0;
            }


    #main-nav-close {
        z-index: 1;
        text-align: right;
    }
    /* close button on the responsive nav bar menu*/
    .header-nav > .container .btn-close:focus,
    .header-nav > .container .btn-close:active {
        outline: 0;
    }

    .header-nav > .container .btn-close i {
        color: #fff;
        /* font-size: 18px;*/
        font-size: 2em;
        font-weight: 300;
    }

    .main-nav-active {
        /*overflow: hidden; */
    }

        .main-nav-active .header-nav > .container {
            transform: translateX(0);
            opacity: 1;
        }

    .header-nav nav {
        /*padding-top: 10em;  */
        padding: 10em 1em;
        top: 0;
        position: absolute;
        right: 0;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        max-width: 38.75em; /* 620px;*/
        background: rgb(3, 43, 85);
        height: 100%;
        overflow-y: auto;
    }

        .header-nav nav ul,
        .header-nav nav ul li {
            width: 100%;
        }

            .header-nav nav ul.main-nav {
                flex-grow: 0;
            }

            .header-nav nav ul li {
                border-bottom: 1px solid rgba(255, 255, 255, 0.2);
            }


            /* Account or LOGIN*/
            .header-nav nav ul:last-child li:last-child {
                border-bottom: 0;
            }


    #culture-selection-dropdown {
        display: inline-flex;
        background-color: #385577;
        color: #FFFFFF;
        position: relative;
        float: right;
        top: -3.75em;
        width: 4em;
        height: 3.75em;
        text-transform: uppercase;
        margin-right: 1.2em;
        cursor: pointer;
    }

    /* for Arabic, move the language selection dropdown list to the left side of the Accounts button */
    html:lang(ar) #culture-selection-dropdown {
        position: inherit;
        float: left;
        top: -3.75em;
        margin-right: 0;
    }
    .header-nav nav ul li.menu-item-language-switch-dropdown {
        display: block !important;
        border: 1px solid pink;
    }

    .header-nav nav ul li.menu-item-accounts {
        margin-top: 3em;
    }

        .header-nav nav ul li.menu-item-accounts a {
            border: 1px solid white;
            width: 10em;
        }

    /* for the Install button (PWA) */
    .header-nav nav ul li.menu-item-install {
        color: yellow;
        padding-left: 2em;
    }

        .header-nav nav ul li.menu-item-install a {
            color: yellow;
        }

    .header-nav nav ul > li {
        display: block;
    }

    /* + next to the top menu item for the responsive nav bar menu*/
    .header-nav nav ul.main-nav li.menu-a-left {
        position: relative;
    }

    html:not(:lang(ar)) .header-nav nav > ul > li.has-children:after {
        position: absolute;
        top: 10px;
        right: 15px;
        content: "+"; /* this is to indicate that there are submenu items for the user to click, in the responsive navbar*/
        color: rgba(255, 255, 255, 0.7);
        background: url(../png/white-down-arrow-sml.png);
        font-size: 1rem; /* 16px; */
        cursor: pointer;
        pointer-events: none;
    }

    /* for Arabic, in the navigation menu for small screens, have the +/- expand / collapse to the left hand side*/
    html:lang(ar) .header-nav nav > ul > li.has-children:after {
        position: absolute;
        top: 10px;
        left: 15px;
        content: "+"; /* this is to indicate that there are submenu items for the user to click, in the responsive navbar*/
        color: rgba(255, 255, 255, 0.7);
        background: url(../png/white-down-arrow-sml.png);
        font-size: 1rem; /* 16px; */
        cursor: pointer;
        pointer-events: none;
    }

    /* for the submenu to expand */
    .header-nav nav > ul > li.has-children.expanded:after {
        content: "-";
        font-weight: bold;
        color: #4FCBFF;
    }

    .header-nav nav ul.main-nav li {
        display: block;
    }


    .header-nav nav ul.main-nav .sub-menu .sub-menu li {
        display: block;
    }

    .header-nav nav > ul > li.has-children.expanded > a {
        color: #4FCBFF; /* lighter teal*/
    }

    #culture-selection-dropdown {
        display: block !important;
    }

    .header-nav nav ul .sub-menu {
        display: block;
        position: relative;
        opacity: 1;
        transform: none;
        visibility: visible;
    }

    .header-nav nav .sub-menu ul {
        display: none; 
        padding: 0;
    }

    .header-nav nav > ul > li .sub-menu:before,
    .header-nav nav ul.main-nav li a:hover:after, .header-nav nav ul.main-nav li a.active:after {
        display: none; 
    }

    .header-nav nav .sub-menu li {
        display: block;
        width: auto;
    }

    .header-nav nav .sub-menu ul li a {
        padding-left: 30px;
        display: block;
    }

    .header-nav nav ul.main-nav li a {
        transition: background 0.1s ease-out;
    }

    .header-nav nav ul.main-nav .sub-menu .sub-menu li a{
        transition: background 0.1s ease-out;
    }

    .header-nav nav ul.main-nav .sub-menu .sub-menu li a {
        transition: background 0.1s ease-out;
    }

    .header-nav nav .sub-menu ul li a:hover,
    .header-nav nav .sub-menu ul li a.active,
    .header-nav nav .sub-menu ul li a:focus,
    .header-nav nav .sub-menu ul li a:active,
    .header-nav nav .sub-menu .sub-menu ul li a:hover span,
    .header-nav nav .sub-menu .sub-menu ul li a:active span,
    .header-nav nav .sub-menu .sub-menu ul li a:focus span,
    .header-nav nav .sub-menu .sub-menu ul li a:active span.regional-intiative-title, 
    .header-nav nav .sub-menu .sub-menu ul li a:hover span.regional-intiative-title {
        background: white;
        color: rgb(3, 43, 85);
    }

    .main-search-container .container {
        height: auto; /* 86vh;  66vh; */
        background: linear-gradient( 180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.4) 80%, rgba(3, 43, 85, 0) 100%);
        width: 100%;
    }

    footer .lighter {
        padding: 50px 0 30px;
    }

    footer .container {
        text-align: center;
    }

    footer .block-sponsors {
        text-align: center;
    }

    footer .title {
        margin: 20px auto;
    }


    /* for the title above the Search box */


    .page-access-detail .main-search-container .container .search-box .title,
    .page-compare-market .main-search-container .container .search-box .title,
    .page-compare-detail .main-search-container .container .search-box .title,
    .page-trade-agreement .main-search-container .container .search-box .title,
    .home .main-search-container .container .search-box .title,
    .page-trade-measure .main-search-container .container .search-box .title {
        font-size: 2em; /*  24px; */
        margin: 15px auto;
    }

    .page-access-overview .main-search-container .container .search-box .title {
        font-size: 2em; /*  24px; */
        margin: 15px auto;
    }


    /* the search box at the top of these pages ... */
    .page-trade-agreement .main-search-container .container .search-box .search,
    .page-compare-detail .main-search-container .container .search-box .search,
    .page-regulatory-requirement .main-search-container .container .search-box .search,
    .page-trade-remedies .main-search-container .container .search-box .search,
    .page-customs-duties .main-search-container .container .search-box .search,
    .home .main-search-container .container .search-box .search,
    .page-access-overview .main-search-container .container .search-box .search,
    .page-trade-agreement .main-search-container .container .search-box .search,
    .page-resources-detail .main-search-container .container .search-box .search {
        display: flex;
        flex-direction: column;
        max-width: 100%;
        margin: 2em 0.2em; /*1em 1em; */
        border-radius: 5px;
        align-items: center;
        justify-content: center;
    }

    .page-trade-agreement .main-search-container .container .search-box .search {
        align-items: normal;
    }
    
    /*.home #market-access-query-form .country-selection,
    .home #market-access-query-form .product-selection {
        max-width: 100%;
    }*/
        .module-list .boxes .box {
        word-break: break-word;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-width: 20vw;
        height: auto;
        min-height: 20vw;
        padding-bottom: 4%;
        margin: 0.2em 0.2em;
        border: 1px solid #CDD5DD;
        box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
        border-radius: 10px;
    }

    .tax-module-list .boxes .box {
        max-width: 100%;
        min-height: unset;
        /*   margin: 1em;*/
    }


    .home-about .container {
        padding: 50px 15px 90px;
    }

    .home-about .usercase {
        flex-direction: column;
        display:none;
    }

    .home-about .usercase.visible {
        display: flex;
    }
    

    .home-about .usercase > img {
        display: none;
    }

    .home-about .usercase-description {
        max-width: 100%;
        margin: 0 0 15px;
    }

    .home-tools-society {
        padding: 50px 0;
    }

    .mobile-warning-main-content {
        display: block;
    }

    .is-on-mobile #main-content {
        display: none;
    }

    .search.row {
        display: none;
    }
}

/* ===== Hide autofill safari icon in input field ===== */
input::-webkit-contacts-auto-fill-button {
    visibility: hidden;
    display: none !important;
    pointer-events: none;
    position: absolute;
    right: 0;
}

.page-data-availability .action-export {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
}

.btn-export-xlsx {
    border: 0;
    border-radius: 0;
    padding: 5px 15px;
    background: #fff;
    transition: background-color 0.1s ease-out;
    -webkit-transition: background-color 0.1s ease-out;
    -moz-transition: background-color 0.1s ease-out;
    -ms-transition: background-color 0.1s ease-out;
    -o-transition: background-color 0.1s ease-out;
}

    .btn-export-xlsx:hover {
        background: #ddd;
    }

.results-panel .nav-tabs {
    position: relative;
}

.input.product.loading:after {
    content: "";
    height: 40px;
    width: 100%;
    left: 0;
    display: block;
    background: url(../gif/itc-loading-38.gif) center center no-repeat #fff;
}


.tariff-regime-detail + .tariff-regime-tooltip {
    background: #647D96;
    color: #fff;
    padding: 8px 15px 30px;
    font-size: 13px;
    position: absolute;
    z-index: 1;
    max-height: 400px;
    overflow-y: scroll;
    box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.1);
    border: 1px solid #647D96;
    min-width: 350px;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease-out;
}

.tariff-regime-detail.clicked + .tariff-regime-tooltip {
    visibility: visible;
    opacity: 1;
}

.tariff-regime-tooltip > div {
    font-weight: bold;
    font-size: 1.2em;
}

.tariff-regime-tooltip ul {
    padding-left: 20px;
    text-align: justify;
    column-count: 2;
    list-style-type: none;
}

    .tariff-regime-tooltip ul li {
        white-space: nowrap;
    }


    /* Yellow menu title for the navigation bar styles (for NEW!) */
.yellow-menu-title {
    color: yellow;
    text-transform: uppercase;
}

/* ===== COVID19 element styles ===== */
.header-nav nav ul.main-nav .menu-item-covid19 a {
    color: #fff; /* #f74d4d; */
    font-weight: 800;
    text-shadow: 1px -2px 30px #f74d4d;
    transition: all 0.05s ease-out;
}

.header-nav nav ul.main-nav .menu-item-covid19 .sub-menu a {
    color: #fff;
    letter-spacing: 0;
}

.menu-item-covid19:hover .ico path {
    fill: #fff;
}

    .menu-item-covid19:hover .ico path:last-child {

        fill: #f74d4d!important;
    }

.menu-item-covid19 .ico {
    height: 30px;
    width: 40px;
    display: inline-block;
    vertical-align: middle;
    transform: translateY(-2px);
    -webkit-transform: translateY(-2px);
    -moz-transform: translateY(-2px);
    -ms-transform: translateY(-2px);
    -o-transform: translateY(-2px);
}

    .menu-item-covid19 .ico path {
        fill: #f74d4d;
        stroke-width: 2px;
        transition: all 0.1s ease-out;
    }

@keyframes placeholderAnimate {
    0% {
        background-position: -650px 0;
    }

    100% {
        background-position: 650px 0;
    }
}

.page-trade-measure .placeholder-content {
    height: 100%;
    width: 100%;
    overflow: hidden;
    background: #000;
    position: relative;
    -webkit-animation-duration: 1.7s;
    animation-duration: 1.7s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-name: placeholderAnimate;
    animation-name: placeholderAnimate;
    background: #f6f7f8;
    background: -webkit-gradient(linear, left top, right top, color-stop(2%, #eee), color-stop(18%, #ddd), color-stop(33%, #eee));
    background: linear-gradient(to right, #eee 2%, #ddd 18%, #eee 33%);
    background-size: 1300px;
}

.page-trade-measure .main-search-container {
    position: relative;
    background: url(../jpg/header-image-full-covid19.jpg) center 20% / cover;
}

    .page-trade-measure .main-search-container .container .search-box .sub-title {
        font-weight: 500;
        font-size: 18px;
        color: #EFEFF4;
        margin: 15px auto 35px;
        max-width: 650px;
    }

    .page-trade-measure .main-search-container .container {
        position: relative;
        background-color: transparent;
        display: flex;
        align-items: center;
        height: 350px;
        z-index: 1;
    }

.page-trade-measure .block-content {
    margin-top: 100px;
}

.page-trade-measure table {
    table-layout: fixed;
    width: 100%;
}

    .page-trade-measure table thead th {
        font-weight: bold;
        color: #FFF;
        background: #032b55;
        letter-spacing: 0.2px;
        line-height: 20px;
        vertical-align: top;
        opacity: 1;
        border: 0;
        font-size: 16px;
        text-align: center;
    }


    .page-trade-measure table tbody tr.even {
        background: #FAFAFA;
    }

    .page-trade-measure table tbody td {
        line-height: 22px;
        vertical-align: top;
        position: relative;
        border: 0;
        font-size: 14px;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;
    }

.page-trade-measure #DataTables_Table_0_wrapper > .row:first-child {
    background: #7E96A9;
    color: #FFF;
    padding-top: 8px;
    padding-bottom: 8px;
}

.page-trade-measure table tbody td:nth-child(5) {
    text-transform: capitalize;
}

.page-trade-measure table tbody td:nth-child(7) {
    text-transform: capitalize;
}

.page-trade-measure .trade-direction {
    display: block;
    position: relative;
}

/* COVID19 trademeasures for the carousel in Arabic! */
html:lang(ar) .page-trade-measure .trade-direction {
    padding-left: 1em;
}

    .page-trade-measure .trade-direction:after {
        position: absolute;
        display: inline-block;
        top: 6px;
        right: -10px;
        content: "";
        width: 10px;
        height: 10px;
        border-radius: 50%;
        margin-left: 4px;
        border: 1px solid #fff;
    }

.page-trade-measure .internal-link {
    text-decoration: underline;
}

.page-trade-measure td.restrictive,
.page-trade-measure td.liberalising,
.page-trade-measure td.status-active,
.page-trade-measure td.status-active a {
    color: green;
}

.page-trade-measure td.status-investigation {
    color: orange;
}

.page-trade-measure td.status-terminated,
.page-trade-measure td.status-terminated a,
.page-trade-measure td.restrictive {
    color: red;
    text-transform: capitalize;
}

.page-trade-measure.td.col-direction span:after {
    position: relative;
}

.page-trade-measure .table-explaination span {
    display: inline-block;
    margin: 0 2px;
    vertical-align: middle;
    padding-right: 10px;
}

    .page-trade-measure .table-explaination span:after {
        position: static;
    }

.page-trade-measure .trade-direction.Export:after {
    background: #0ca5ec;
}

.page-trade-measure .table-top .table-action {
    flex-grow: 0;
    margin-left: 15px;
}

.page-trade-measure .table-top .btn-export-xlsx {
    background: transparent;
    padding: 0;
}

.page-trade-measure .trade-direction.Import:after {
    background: #032b55;
}

.page-trade-measure #map-container-export path[visibility=hidden],
.page-trade-measure #map-container-import path[visibility=hidden] {
    visibility: visible !important;
    pointer-events: none;
    fill: #eee;
}

.page-trade-measure #map-container-export .highcharts-credits tspan:not(:first-child),
.page-trade-measure #map-container-import .highcharts-credits tspan:not(:first-child) {
    display: none;
}

.page-trade-measure #map-container-export .highcharts-credits,
.page-trade-measure #map-container-export .highcharts-credits {
    pointer-events: none;
}

.down-icon {
    /* url(../images/icons/png/down-dark.png );   url(/content/images/icons/png/down-icon.png) */
    background-image: url(../png/down-icon.png);
    display: inline-flex;
    width: 15px;
    height: 15px;
}


.up-icon {
    background-image: url(../png/up-icon.png);
    display: inline-flex;
    width: 15px;
    height: 15px;
}



/* for the Overview boxes - learn more buttons*/


.btn-learn-more-overview {
    margin-top: auto;
    border: 1px solid rgba(6, 43, 85, 0.8);
    background-color: rgba(6, 43, 85, 0.8);
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 3px;
    width: 22rem;
    color: rgba(6, 43, 85, 0.8);
    font-size: 1.4rem; /*1.25rem; */
    padding: 1rem 1rem;
    font-weight: 500;
}


    .btn-learn-more-overview:hover {
        color: white;
        border: 1px solid rgba(6, 43, 85, 0.8);
        background-color: rgba(6, 43, 85, 0.8);
    }





/* the first div in the slic*/
.ctn {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items:  normal; /* was center;*/
    justify-content: center;
    /*border: 1px solid #CDD5DD;
    box-sizing: border-box;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);*/
    border-radius: 5px;
    padding: 1em 3em;
}
.slick-slider {
    padding: 1em 0em;
}

.slick-track {
    display: flex !important;
}


.slick-slide > div {
    height: 100%;
}


html:lang(ar) .downloads-list-responsive .slick-slide > div {
    direction: rtl;
}

    /*
.slick-slide {
    height: auto; 
}*/
    .slide {
        height: 100%;
    }


/* styling the Bootstrap popvers on the Query Results page (they used to have the blue background */
.popover-blue + .popover .popover-content {
    background: none;
    font-size: 1.1rem;
    color: #041B35;
    line-height: 1.9rem;
    width: inherit;
}

.popover-blue + .popover .popover-title {
    background: none;
    font-size: 1.2rem;
    color: #0073A4;
    font-weight: 600;
}


.popover-blue-bg + .popover .popover-content {
    background-color: rgba(6, 43, 85, 0.8);
    /*   background-color: #0073A4;   color: rgba(6, 43, 85, 0.7);*/
    font-size: 1.1rem;
    color: #FFFFFF;
    line-height: 1.9rem;
    width: inherit;
    box-sizing: border-box;
    box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
    border-radius: 5px;
}

.popover-blue-bg + .popover .popover-title {
    background: none;
    font-size: 1.2rem;
    color: #0073A4;
    font-weight: 600;
}

.popover-blue-bg + .popover.right > .arrow:after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: rgba(6, 43, 85, 0.8);
    border-left-width: 0;
}

.popover-blue-bg + .popover.left > .arrow:after {
    right: 1px;
    bottom: -10px;
    content: " ";
    border-left-color: rgba(6, 43, 85, 0.8);
    border-right-width: 0;
}


/* for when the popover is above, make the little triangle blue too*/
.popover-blue-bg + .popover.top > .arrow:after {
    bottom: 1px;
    margin-left: -10px;
    content: " ";
    border-top-color: rgba(6, 43, 85, 0.8); /*#fff;*/
    border-bottom-width: 0;
}

/* for when the popover is below, make the little triangle blue too*/
.popover-blue-bg + .popover.bottom > .arrow:after {
    top: 1px;
    margin-left: -10px;
    content: " ";
    border-top-width: 0;
    border-bottom-color: rgba(6, 43, 85, 0.8); /*#fff;*/
}



/* for the Compare Markets page - popovers in the datatable to be white*/

.popover-white-bg + .popover .popover-content {
    background-color: #FFFFFF; /*rgba(6, 43, 85, 0.8);*/
    /*   background-color: #0073A4;   color: rgba(6, 43, 85, 0.7);*/
    font-size: 1.1rem;
    color: rgba(6, 43, 85, 0.8); /* #FFFFFF; */
    line-height: 1.9rem;
    width: inherit;
    box-sizing: border-box;
    box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
    border-radius: 5px;
}

.popover-white-bg + .popover .popover-title {
    background: none;
    font-size: 1.2rem;
    color: #0073A4;
    font-weight: 600;
}

.popover-white-bg + .popover.right > .arrow:after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: rgba(6, 43, 85, 0.8);
    border-left-width: 0;
}

.popover-white-bg + .popover.left > .arrow:after {
    right: 1px;
    bottom: -10px;
    content: " ";
    border-left-color: rgba(6, 43, 85, 0.8);
    border-right-width: 0;
}


/* for when the popover is above, make the little triangle white too*/
.popover-white-bg + .popover.top > .arrow:after {
    bottom: 1px;
    margin-left: -10px;
    content: " ";
    border-top-color: rgba(6, 43, 85, 0.8); /*#fff;*/
    border-bottom-width: 0;
}

/* for when the popover is below, make the little triangle white too*/
.popover-white-bg + .popover.bottom > .arrow:after {
    top: 1px;
    margin-left: -10px;
    content: " ";
    border-top-width: 0;
    border-bottom-color: rgba(6, 43, 85, 0.8); /*#fff;*/
}

.container .results-panel .results table tbody tr td.popover-on-left {
    width: 2.6em;
}

/* Styling popovers in general*/
/*
    .popover-content {
        color: red;
        font-size: 10px;
    }

    */


.btn-link-more-details {
    border: 1px solid #0073A4;
    box-sizing: border-box;
    border-radius: 3px;
    background-color: white;
    color: #0073A4;
    padding: 1em 2em;
    min-width: 50vw;
    text-align: -webkit-center;
    margin: 2em 0.3em; /* 3em*/;
    font-size: 0.9em;
    white-space: normal; /* for wrapping to occur if the button text goes over more than one line */
}

.more-button-area {
    display: flex;
    justify-content: center;
}

.details-title-row {
    background-color: #CDD5DD ;/* #E6EAEE;  */
}

.details-title {
    /*  margin: 1em 0.2em;  */
    display: inline-block;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
    margin: 1em 1em 0em 1em;
    padding: 1em 0em 0em 1em;
}

.modal-for-details {
    position: relative;
    padding: 0px;
}

.wrap-for-details {
    padding: 0px;
    transition: all 0.3s;
}

#taxes-fees-charges-responsive-content {
    display: none;
}

#custom-duties-responsive-content{
    display: none;
}

#custom-duties {
    display: block;
}


#ntm-summary {
    display: block;
}

#trade-remedy {
    display: block;
}

#trade-remedy-responsive-content {
    display: none;
}
#ntm-summary-responsive-content {
    display: none;
}

#access-customs-duties-summary {
    display:block;
}

#access-customs-duties-summary-wrapper {
    display: none;
}

/* Access - Trade Remedy page - summary */
#access-trade-remedy-summary{
    display: block;
}

#access-trade-remedy-summary-wrapper {
    display: none;
}

#access-ntm-summary-sub-heading {
    display: block;
}

#access-ntm-summary-wrapper {
    display: none;
}

#ntm-summary-source {
    display: none;
}


#search-results-responsive{
    display:none;
}


#search-results-desktop {
    display: block;
}
/* Access page title icon */
.page-icon {
    display: none;
}

.col-vis {
    display: block;
}

/* Compare Market */
/* for the number of checked countries in the check box list of countries in the Chart tab - desktop*/
#select-chart-country, #chart-country-list {
    display: block;
}

#breadcrumb{
    display: block;
}

/* Compare Product - summary information for desktop */
#summary-info-desktop {
    display: block;
}

#compare-market-highlight-responsive, #compare-competitor-highlight-responsive, #compare-product-highlight-responsive {
    display: none;
}


#toggle-select-single-view-responsive-data-avalability {
    display: none;
}

#data-availability-tabs-container-mobile {
    display: none;
}

#data-availability-tabs-container > div.bar-above-tabs{

    display: none;
}

/*Show the excel export button for Data availability for desktop */
 ul > li.action-export {
    display: block;
}

 /* data availablibilty single year indicator drop down list */
.single-country-selector-dropdown-here{
    display: none;
}


table.dataTable {
    margin: 0 !important;
    width: 100% !important;
}

.responsive-filter-maps {
    display: none;
}

.search-for-glossary {
    display: none;
}

#glossary-query-form{
    display: block;
}

/* COVID page - hide the bar-above-tabs for desktop */
.page-trade-measure .bar-above-tabs {
    display: none;
}

#trade-measures-responsive-content {
    display: none;
}

.page-trade-measure .table-view-content {
    display: block;
}

.page-trade-measure #btn-print {
    display: block;
}

/* Analyse - Trade Agreements - summary */
#trade-agreement-highlight{
    display: block;
}

#trade-agreements-summary-wrapper {
    display: none;
}

#agreement-list-result{
    display: block;
}
#trade-agreements-responsive-content{
    display: none;
}

/* Product search - the little + icon next to the heading title to expand the section */
.page-product-search .section-listing .section-heading .item-title .txt-title-with-icon .sub-item-toggle,
#search-result-detail .span.sub-item-toggle {
    display: none;
}

/* PRODUCT SERCH PAGE */
#summary-for-product-search-desktop {
    display: block;
}
#summary-for-product-search-responsive {
    display: none;
}

/* Overview summary boxes - Custom Duties */
#customs-duties-results-section.two-columns-flex {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
}

/* small changes in layout for the Overview Summary boxes - customs duties */
.customs-tariffs-summary {
    display: flex;
    gap: 1.2rem;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    font-size: 1.2em;
}

.customs-tariff-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4em;
}

.customs-tariff-rate-info {
    display: flex;
}

.customs-tariff-rate-details {
    line-height: 1;
    margin-bottom: 0;
    font-size: 14px; /* 1.2em*/
    font-weight: bold;
    color: #fd5763;
}

.customs-tariff-rate-label {
    width: 100%;
    font-size: 0.9em;
    text-align: center;
    line-height: 1;
}

#customs-duties-results-section.two-columns-flex > div.item {
    flex: 50%;
    word-break: break-word; /* if "Tarifs préférentiels" in overview box of Custom Tariffs, break on the word */
}

/* show the search summary for Compare Markets for small screens */
#compare-market-highlight {
    display: block;
}



.summary-heading {
    font-weight: 700;
    font-size: 15px; /*1em; */
    line-height: 18px; /* 1.3em */
    ;
    /*  color: #041B35;*/
    color: rgba(6, 43, 85, 0.7);
}

.summary-row {
    display: flex;
    align-items: flex-start;
    padding: 0em 0em 1em 0em;
    column-gap: 1.875rem;
    /* new */
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1em;
}

.summary-group {
    display: flex;
    gap: 1.5em;
    align-items: center;
}


.summary-column {
    display: flex;
    flex-direction: column;
    row-gap: 0.25em;
}

.summary-text {
    font-size: 15px; /*1em; */
    line-height: 18px; /*1.3em;*/
    color: #041B35;
}

.summary-column-blank {
    width: 25px;
}

.summary-column-with-show-more-button {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    width: -webkit-fill-available;
}

.offline .tabs-container {
    margin: 50px auto;
    padding: 1em;
}

.buttons-to-offline-pages {
    display: flex;
    justify-content: space-evenly;
    margin-top: 1em;
}


/* Hide the install button when it's on desktop */
#main-nav-wrapper > nav > ul.main-nav.right-nav > li.menu-item-install{
    display:none;
}


/* SMALL SCREENS HERE RESPONSIVE-DESIGN*/
@media (max-width: 1199px) {
    /* Display install button on small screens */
    #main-nav-wrapper > nav > ul.main-nav.right-nav > li.menu-item-install {
        display: inline-block;
    }
    /* offline page buttons*/
    .buttons-to-offline-pages {
        height: auto;
        width: auto;
        z-index: 6;
        margin-top: 1em;
        margin-bottom: 1em;
    }

    /* for the install button */
    .header-nav nav ul li.menu-item-install {
        padding-left: 0;
        color: yellow;
    }

    /* on small screens, have a bit of padding for the NEW! for Ukraine temporary measures in the nav bar */
    .header-nav nav .yellow-menu-title {
        padding: 1em;
    }
    /* slick button sometimes still shows on Trade Remedies page for 1 item so let's hide it*/
    .slick-arrow.slick-hidden{
        display: none!important;
    }

    /* Trade Agreements page  - hide the filter in the search form */
    .page-trade-agreement .filter-result-criteria {
        display: none;
    }
    /* Trade Agreements page  - hide the Overview Summary row of the In Search filter  */
    #inforce-filter-row{
        display:none;
    }

    /* Trade Agreements search form - In Force filter button to not have a background*/
    .page-trade-agreement .filter-result-criteria input:checked + i:before {
        background: unset;
        content: "\f205";
    }

    /* when the In Force filter is unchecked*/
    .page-trade-agreement .filter-result-criteria input + i:before {
        content: "\f204";
        background: unset;
    }



    /* On small screens, truncate the longer country names in the country select lists 
        like "Hong Kong, China Special Administrative Region and
        "Macao, China Special Administrative Region" so that it does increase width of the select element. 
    */
    .chosen-container-single .chosen-single span {
        font-size: inherit;
        white-space: nowrap;
        width: 12em;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        /* for the NTM summary - details view on mobile */
    .ntm-summary-detail-result .inner-table tbody tr td:first-child:before {
        /*      content: counter(rowNumber) '. '; */
        /* todo: [I18nEntries]*/
        content: 'Measure ' counter(rowNumber) '. '; /*  Adding the prefix of "Measure" before the row count */
        color: #002060;
        font-weight: bold;
        font-size: 1em;
    }


    /* when there's only 1 requirement */
    .ntm-summary-detail-result .inner-table tbody tr:only-child td:before {
        content: '';
        /* content: 'Measure 1. '; */ /* Adding the prefix of "Measure" before the content  */
    }

/* Access - Custom Tariffs - Globe for the Tariff Regime Details DIV that shows up when the user clicks on the Globe icon next to the Tariff regime in the carousel */
.tariff-regime-detail + .tariff-regime-tooltip {
    padding: 8px 8px 30px;
    width: auto; /*20%;*/
}


    .tariff-regime-tooltip > div {
        font-size: 1em;
        padding: 0em 10em 0em 0em;
        width: 80%;
    }

    .tariff-regime-tooltip ul {
        padding-left: 0px;
        text-align: initial;
        column-count: 1;
        padding-bottom: 10em;
        width: 80%;
    }

        .tariff-regime-tooltip ul li {
            white-space: initial;
            /* padding: 0em 2em 0em 0em; */
            padding: 0em 3em 0em 0em;
            width: 80%;
        }


    /* INCOTERMS PAGE */

    .page-content-incoterms h2,
    .page-content-incoterms h2 > strong,
    .page-content-incoterms h2 > h2 > strong > em {
        font-style: normal;
        font-weight: 500;
        font-size:1.25em; /*24px;*/
        line-height: 1.33em;/* 28px;*/
        color: rgba(36, 36, 36, 0.8);
    }

    .page-content-incoterms h3,
    .page-content-incoterms h3 > strong {
        font-style: normal;
        font-weight: 500;
        font-size: 1.17em; /* 18px;*/
        line-height: 1.2em;/*21px;*/
        color: #041B35;
    }
    .page-content-incoterms p {
        font-style: normal;
        font-weight: 500;
        font-size: 0.95em; /*14px;*/
        line-height: 130%;
        /* or 18px */
        /* #062B55 */
        color: #062B55;
        margin-top: 1em;
        margin-bottom: 1em;
    }
    .page-content-incoterms .block-content img {
        max-width: 100%;
        width: auto;
        height: auto;
    }


    .page-content-incoterms ul {
        list-style: initial !important;
        padding: 15px 20px;
        font-style: normal;
        font-weight: 500;
        font-size: 0.95em; /*14px;*/
        line-height: 130%;
        /* or 18px */
        /* #062B55 */
        color: #062B55;
    }
    .page-content-incoterms ul > li{

        padding: 0.4em;

    }
        /* PRODUCT SERCH PAGE */
        /* PRODUCT SEARH FORM */
        .page-product-search .search-input-group {
            display: flex;
            flex-direction: column;
        }

    /*for the '+' expand icon next to the item title*/
    .page-product-search .search-result-detail .product-by-section li .item-title.collapsed span.sub-item-toggle .icon:before,
    .page-product-search .section-listing .section-heading .item-title .txt-title-with-icon.collapsed span.sub-item-toggle .icon:before,
    .page-product-search .section-listing .section-heading .item-title.collapsed span.sub-item-toggle .icon:before {
        content: "\f055";
    }

    /*for the '-' expand icon next to the item title*/
    .page-product-search .search-result-detail .product-by-section li .item-title:not(.collapsed) span.sub-item-toggle .icon:before,
    .page-product-search .section-listing .section-heading .item-title span.sub-item-toggle .icon:before,
    .page-product-search .section-listing .section-heading .item-title .txt-title-with-icon span.sub-item-toggle .icon:before,
    .page-methodology .term .terms-inner-wrapper li .item-title .icon:before {
        content: "\f056";
    }

    #summary-for-product-search-responsive {
        display: block;
    }

    #summary-for-product-search-desktop{
        display: none;
    }
    /* Second product code for level 2*/
    .page-product-search .search-result-detail .product-by-section li li .item-title .product-code span:nth-child(2n) {
        color: #cdd5dd;
    }

    /* Product search - the little + icon next to the heading title to expand the section */
    .page-product-search .section-listing .section-heading .item-title .txt-title-with-icon .sub-item-toggle, #search-result-detail .span.sub-item-toggle {
        display: block;
    }


    .page-product-search .search-result-detail .section-listing > li .section-heading > .txt {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    /* for the top level and also the sublevels */
        .page-product-search .search-result-detail .section-listing > li .section-heading > .txt .txt-title-with-icon,
        .page-product-search .search-result-detail .section-listing .product-by-section .item-title .txt .txt-title-with-icon,
        .page-product-search .search-result-detail .section-listing .product-by-section .item-title .txt-title-with-icon {
            display: flex;
            align-items: center;
            justify-content: space-between;/*space-around;*/
            width: 100%;
        }

    /* OVERVIEW QUERY RESULTS PAGE */
    /* TAXES -results section */
    /* modal for Tax details (mobile)*/
    .more-data-container .more-data-container-info-section .column h2 {
        color: #0073A4;
    }



    /* Analyse - Trade Agreements - summary */
    #agreement-list-result {
        display: none;
    }
    #trade-agreement-highlight {
        display: none;
    }
    #trade-agreements-summary-wrapper {
        display: block;
    }
    #trade-agreements-responsive-content {
        display: block;
    }
    /* changing the search icon on the Search form of Analyse - Trade Agreements*/
    .page-trade-agreement .search .search-input-group .input.import:before {
        background: url(../png/country-icon.png) 0 0 no-repeat;
        width: 21px;
        height: 21px;
        padding: 1em;
        left: -10px;
    }

    .page-trade-agreement .search .search-input-group .input:before {
        /* background: linear-gradient( 180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.1 ) 100%);*/
        background: url(../png/relation-icon.png) 0 0 no-repeat;
        width: 21px;
        height: 21px;
        padding: 1em;
        top: 6px;
        left: -10px;
    }

    .page-trade-agreement .search .search-input-group .input.export:before {
        /* background: linear-gradient( 
180deg, rgba(3, 43, 85, 0.9) 0%, rgba(3, 43, 85, 0.0) 60%, rgba(3, 43, 85, 0.1 ) 100%); */
        background: url(../png/partner-icon.png) 0 0 no-repeat;
        width: 21px;
        height: 21px;
        padding: 1em;
        top: auto;
        left: -10px;
    }



    /* centering the search button on the search form, when on small screens*/
    #market-access-query-form .search-input-group.search-submit-wrapper, .search-submit-wrapper, #trade-agreement-query-form .search-submit-wrapper {
        max-width: 100%;
        display: flex;
        justify-content: center;
    }



    /* COVID19 page */
    /* hide the "Download Printable Version" button for desktop, as it's now in the download icon just above the carousel */
    .page-trade-measure #btn-print {
        display: none;
    }
    /* for some padding at the bottom of the COVID19 carousel of trade measures */
    .page-trade-measure #search-results-responsive {
        padding-bottom: 2em;
        margin-bottom: 2em;
    }

    .indicator-title {
        display: flex;
        flex-direction: row;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        line-height: 1.2em;
        align-items: center;
        /*    border: 1px solid red;*/
        width: 100%;
    }

    .page-trade-measure .trade-direction.Import:after {
        background: #08AAEE; /* light blue */ /*#032b55;*/
    }

    .page-trade-measure .trade-direction.Export:after {
        background: #E41563; /* hot pink  */  /*#032b55;*/
    }

    
    .page-trade-measure .trade-direction:after {
        position: absolute;
        display: inline-block;
        top: 0;
        right: 0;
        content: "";
        width: 10px;
        height: 10px;
        border-radius: 50%;
        margin-left: 4px;
        border: 1px solid #fff;
    }

    /* COVID19 trade measures page - for Arabic*/
    html:lang(ar) .page-trade-measure .trade-direction:after {
        align-items: baseline;
        justify-content: initial;
    }
    /* COVID19 page - import export legend, just under the search input field before the carousel of trade measures  */
        .import-export-legend-item {
        color: #FFFFFF;
        display: flex;
        flex-direction: row;
        justify-content: initial;
        margin-top: 1em;
        margin-left: 1em;
    }
    .import-export-legend {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }


    .import-export-legend-item-description {
        margin-left: 1em;
        /*    margin-top: 1em;*/
    }

    /* COVID19 trademeasures page - legend for the Carousel on small screens for Arabic!*/
    html:lang(ar) .import-export-legend-item-description {
        margin-right: 1em;
    }

    .trade-measures-responsive-content .trade-direction,
    .temporary-measures-responsive-content .trade-direction {
        display: block;
        position: relative;
        margin-top: 1em;
        margin-left: 1em;
    }
    .trade-measures-responsive-content .trade-direction:after,
    .temporary-measures-responsive-content .trade-direction:after {
        position: relative;
        content: "";
        width: 10px;
        height: 10px;
        border-radius: 50%;
        border: 1px solid #fff;
    }


    .page-trade-measure .ctn {
        border: 0;
    }


    .page-trade-measure #table-view-content {
        display: none;
    }
    #trade-measures-responsive-content {
        display: block;
    }
    /* covid19 page section title*/
    .page-trade-measure.page-about-detail .group-text {
        /*  border: 1px solid red;*/
    }

    .page-trade-measure.page-about-detail .term-group {
        background: #FFFFFF !important;
        color: #385577;
        font-style: normal;
        font-weight: bold;
        font-size: 16px;
        line-height: 19px;
    }
    /* the content formatting for COVID19 - Effect on Trade */
    .page-trade-measure span.restrictive,
    .page-trade-measure span.liberalising,
    .page-trade-measure span.status-active,
    .page-trade-measure span.status-active a {
        color: green;
    }
    .page-trade-measure span.status-investigation {
        color: orange;
    }
    .page-trade-measure span.status-terminated,
    .page-trade-measure span.status-terminated a,
    .page-trade-measure span.restrictive {
        color: red;
        text-transform: capitalize;
    }

    /* get rid of the box shadow for each carousel slide in the COVID19 slider */
    .page-trade-measure .ctn {
        box-shadow: none;
    }


    /* Glossary - sub menu expand and collapse small icon to the left of the title */
    /* '+' icon */
    .page-resources-detail .term .terms-by-group .term-name.term-detail-piece.collapsed .icon:before {
        content: "\f055";
        align-self: flex-end;
    }

    /* '-' icon */
    .page-resources-detail .term .terms-by-group .term-name.term-detail-piece .icon:before {
        content: "\f056";
        align-self: flex-end;
    }


    /* the glossary search form (don't display the desktop version for mobiles ) */
    #glossary-query-form {
        display: none;
    }


    .search-for-glossary {
            display: block;
        }

        .page-data-availability .map-filters .map-instrument {
            width: 90%;
        }

        .page-data-availability .map-filters {
            background: #385577;
            color: #FFF;
            font-weight: 500;
            border: 0;
        }

        .responsive-filter-maps {
            display: block;
        }


        .map-filters {
            flex-direction: column;
        }

        #map-type-list {
            display: none;
        }


        /* data availability - hide the footer #applied-tariffs-table > tfoot */
        tfoot {
            display: none;
        }

        .data-availability-per-year {
            display: flex;
            flex-direction: row;
            align-items: center;
        }

        .availability-text {
            margin-left: 1em;
        }

        .green-tick {
            width: 20px;
            height: 20px;
            background-image: url('../png/green-tick-icon.png');
            display: inline-block;
        }

        .missing-data-dash {
            width: 20px;
            height: 20px;
            background-image: url('../png/red-dash-icon.png');
            display: inline-block;
        }

        #tariff-rate-quotas-table_filter, #applied-tariffs-table_filter, #non-tariff-measurss-table_filter, #non-tariff-measures-table_filter, #trade-flows-table_filter {
            /* padding: 1.2em 0em 0.5em 1em   **************/
        }

        /* data availablity */
        /* Hide the "Showing 1 to 25 of 84 entries" for the datatables in the search results */
        #tariff-rate-quotas-table_info, #applied-tariffs-table_info, #non-tariff-measures-table_info, #non-tariff-measures-table_info, #trade-flows-table_info, #trade-remedies-table_info {
            display: none;
        }


        /* data availability - change the background colour of the tabs to be white instead of grey*/
        .page-data-availability .nav-sub-tabs {
            background: #FFFFFF;
            border-top: 1px solid rgba(6, 43, 85, 0.2);
        }


        /* Hide the excel export button for Data availability as it's now in the tabs above the search results*/

        ul > li.action-export {
            display: none;
        }

        /* hide the tabs list for Data Availability when in responsive mode and show the dropdown with the tab options instead*/
        .page-data-availability #top-tab-list {
            display: none;
        }

        /* the toggle drop down list for Select a view for the Data avalabilty page*/

        #data-availability-tabs-container-mobile {
            display: block;
        }

        #toggle-select-single-view-responsive-data-avalability {
            display: block;
        }

        #module > div:nth-child(2) > div > div > li,
        #module > div:nth-child(2) > div > div > li > a {
            display: none;
        }

        #breadcrumb {
            display: none;
        }

        /* Compare Product - summary information for mobile */
    #compare-market-highlight-responsive,
    #compare-competitor-highlight-responsive
    #compare-product-highlight-responsive {
        display: block;
    }

        #summary-info-desktop {
            display: none;
        }

        .page-compare-product #breadcrumb-products {
            padding: 0;
            margin: 1em 0em 0em 2em;
            display: inline-block;
            list-style-type: none;
        }

            .page-compare-product #breadcrumb-products > li {
                display: inline-block;
                margin: 0 0 0 5px;
            }

                .page-compare-product #breadcrumb-products > li:after {
                    content: " > " !important;
                    margin: 0 5px !important;
                }

                .page-compare-product #breadcrumb-products > li a:not(.collapsed):after {
                    content: '';
                }

                .page-compare-product #breadcrumb-products > li:last-child:after {
                    display: none;
                }

                .page-compare-product #breadcrumb-products > li a.active {
                    font-weight: bold;
                }

        #btn-dismiss-countries-selection {
            float: right;
        }

        /* compare markets - maps view*/
        .table-top .dataTables_filter label {
            margin: 0;
            width: 100%;
        }

        /* high charts subtitle */
        text.highcharts-subtitle {
            display: none;
        }

        /* legend positioning */
        #highcharts-llf5itk-0 > span:nth-child(3)

        #list-map-ave-mobile {
            /*     margin-top: 4em;*/
        }

        #list_map_instruments_chosen > a > span, #list_map_ave_chosen > a > span {
            color: white;
            text-transform: capitalize;
        }


        .page-compare-market .map-filters:before, .page-compare-competitor .map-filters:before {
            height: 0;
        }


        .available-year-label,
        .filter-heading-here {
            font-style: normal;
            font-weight: 600;
            font-size: 1em;
            line-height: 1.2em;
            display: flex;
            align-items: center;
            color: #FFFFFF;
            padding: 1em 0em 0em 1em;
            text-transform: capitalize;
        }

        .single-country-selector-dropdown-here {
            display: block;
            background: #385577;
        }

        .select-single-indicator,
        .map-filter-dropdown {
            color: #041B35;
            font-style: normal;
            font-weight: 500;
            font-size: 13px;
            line-height: 15px;
        }
        /* data availability MAPS year select drop down list */
        #applied_tariffs_available_year_chosen,
        #tariff_rate_quotas_available_year_chosen,
        #trade_remedies_available_year_chosen,
        #non_tariff_measures_available_year_chosen,
        #trade_flows_available_year_chosen {
            display: none;
        }

        /* for data availablity maps years available list - to hide the product background*/
        .container .results-panel .input::before {
            background: none;
            /*     background: url(../images/icons/svg/product.svg) 0 0 no-repeat;*/
        }

        /* YEAR label for the available years drop down list of Data Availablity - Maps page*/
        .available-year-label {
            font-weight: 600;
            font-size: 1em;
            line-height: 1.2em;
            color: #FFFFFF !important;
            padding: 1em 0em 0em 1em;
            text-transform: capitalize;
        }


        .page-data-availability .map-filters {
            position: relative;
            display: flex;
            padding: initial;
        }


        .map-filters {
            padding: 0em 0em 1em 0em;
        }

        .map-filter-dropdown {
            margin-bottom: 1em !important;
        }


        #applied-tariffs-available-year,
        #tariff-rate-quotas-available-year,
        #trade-remedies-available-year,
        #non-tariff-measures-available-year,
        #trade-flows-available-year {
            display: block !important;
            -moz-appearance: none;
            -webkit-appearance: none;
            appearance: none;
            width: 100%;
            padding: 0.8em;
            margin: 1em;
            margin-bottom: 0;
            font-weight: 500;
            font-size: 0.9em;
            line-height: 1.4em;
            border-radius: 5px;
            background: url(../png/down-arrow-sml.png) right 5px center no-repeat, #FFFFFF;
        }

        #applied-tariffs-sub-map-wrapper > div.map-filters > div.map-instrument.search > div > div > div,
        #tariff-rate-quotas-sub-map-wrapper > div.map-filters > div.map-instrument.search > div > div > div,
        #trade-remedies-sub-map-wrapper > div.map-filters > div.map-instrument.search > div > div > div,
        #non-tariff-measures-sub-map-wrapper > div.map-filters > div.map-instrument.search > div > div > div,
        #trade-flows-sub-map-wrapper > div.map-filters > div.map-instrument.search > div > div > div {
            border-bottom: none;
            display: inline-block;
            width: 100%;
        }


        #lstSingleIndicatorView,
        .map-filter-dropdown,
        .map-ave,
        #applied-tariffs-available-year-list,
        #tariff-rate-quotas-available-year-list,
        #non-tariff-measures-available-year-list,
        #trade-remedies-available-year-list,
        #trade-flows-available-year-list,
        .select-single-indicator {
            -moz-appearance: none; /* Firefox */
            -webkit-appearance: none; /* Safari and Chrome */
            appearance: none;
            width: 90%;
            padding: 0.8em;
            margin: 1em;
            margin-bottom: 0;
            font-weight: 500;
            font-size: 0.9em;
            line-height: 1.4em;
            border-radius: 5px;
            background: url(../png/down-arrow-sml.png) right 5px center no-repeat, #FFFFFF;
        }


    /* data availability year list */
    /* for Arabic!*/
    html:lang(ar) #applied-tariffs-available-year-list,
    html:lang(ar) #tariff-rate-quotas-available-year-list,
    html:lang(ar) #non-tariff-measures-available-year-list,
    html:lang(ar) #trade-remedies-available-year-list,
    html:lang(ar) #trade-flows-available-year-list {
        /*  margin: 1em 1.6em 1em 1em;*/
        background: url(../png/down-arrow-sml.png) left 5px center no-repeat, #FFFFFF;
    }
    html:lang(ar) .table-top .dataTables_filter {
        text-align: right;
    }


    html:lang(ar) #applied-tariffs-table > tbody > tr > td,
    html:lang(ar) #trade-flows-table > tbody > tr > td,
    html:lang(ar) #trade-remedies-table > tbody > tr > td,
    html:lang(ar) #tariff-rate-quotas-table > tbody > tr > td,
    html:lang(ar) #non-tariff-measures-table > tbody > tr > td {
        padding-right: 1em;
    }


    #map-view-responsive > div.map-filters > select > option {
        color: #041B35;
        font-weight: 500;
        font-size: 1em;
        line-height: 1.4em;
    }


        .page-compare-market .map-filters, .page-compare-competitor .map-filters {
            position: relative;
            display: flex;
            flex-direction: column;
            background: #385577;
        }


        #btn-select-all-countries {
            /*  float: left;*/
        }

        #select-all-link {
            display: none;
        }

            #select-all-link.expanded {
                display: block;
                width: 90%;
                padding: 0.6em;
                margin: 1em;
                margin-top: 0;
                margin-bottom: 0;
                background: #FFFFFF;
                font-weight: 500;
                font-size: 0.9em; /*1em;*/
                line-height: 1.2em;
                color: #041B35;
                border-radius: 0;
            }

        .number-counties-selected {
            /* background: url(../images/icons/png/down-arrow-sml.png) right 5px center no-repeat; */
            margin-bottom: 0px;
            width: 100%;
        }

        .table-top .dataTables_filter {
            width: 100% !important;
            text-align: left;
        }

        #country-selection input, #imp-vw-results-table-responsive_filter > label > input,
        #exp-vw-results-table-responsive_filter > label > input,
        #prd-vw-results-table-responsive_filter > label > input,
        #applied-tariffs-table_filter > label > input,
        #tariff-rate-quotas-table_filter > label > input,
        #non-tariff-measures-table_filter > label > input,
        #trade-flows-table_filter > label > input,
        #trade-remedies-table_filter > label > input,
        .maps-year-selection {
            width: 90%;
            min-width: 90%;
            padding: 0.6em; /*0.4em;*/
            margin: 1em;
            margin-bottom: 0;
            font-weight: 500;
            font-size: 0.9em;
            line-height: 1.2em;
            color: #041B35;
            border-radius: 5px !important;
            background: url(../png/down-arrow-sml.png) right 5px center no-repeat, #FFFFFF;
        }

        /* don't need the down arrow to the left of the input field as it's a text box, not a drop down */
        #imp-vw-results-table-responsive_filter > label > input, #exp-vw-results-table-responsive_filter > label > input,
        #prd-vw-results-table-responsive_filter > label > input,
        #applied-tariffs-table_filter > label > input,
        #tariff-rate-quotas-table_filter > label > input,
        #non-tariff-measures-table_filter > label > input,
        #trade-flows-table_filter > label > input,
        #trade-remedies-table_filter > label > input {
            background: #FFFFFF
        }
        /* don't round out the bottom left and right corners, so that it blends in wtih the next element, the list of countries, once they click on the drop down list (input of "Selected 6"*/
        #select-chart-country.expanded,
        #country-selection input.expanded {
            border-radius: 5px 5px 0 0;
        }

        #chart-country-list > ul li.unchecked {
            /*  background: url(../images/icons/svg/checkbox.svg) 0 0 no-repeat;*/
            background: url('../png/blue-unchecked-checkbox.png') 0 0 no-repeat;
            padding: 0.1em 0.2em 0.7em 2em;
            /* blue unchecked checkbox*/
        }

        #chart-country-list > ul li.checked {
            background: url('../png/blue-checked-checkbox.png') 0 0 no-repeat;
            padding: 0.1em 0.2em 0.7em 2em;
        }

        .page-compare-market #chart-country-list ul, .page-compare-competitor #chart-country-list ul {
            height: auto;
            /* padding: 0.2em;*/
        }

        .chart-filters #chart-country-list, .chart-filters .filter {
            width: 90%;
            padding: 0.6em;
            margin: 1em;
            margin-top: 0;
            background: #FFFFFF;
            font-weight: 500;
            font-size: 0.9em; /* 13.5px */ /*1em; */
            line-height: 1.2em;
            color: #041B35;
            border-radius: 0 0 5px 5px;
        }

        #chart-country-list {
            display: none;
        }

            #chart-country-list.expanded {
                display: block;
            }

            #chart-country-list > ul li {
                margin: 0.9em 0.2em 0.2em 0.2em;
            }


        #dropdown-countries-here {
            padding: 0.4em;
            margin: 1em 1em 0.8em 1em;
            background: #FFFFFF;
            border-radius: 5px;
            font-style: normal;
            font-weight: 500;
            font-size: 1em;
            line-height: 1.2em;
            color: #041B35;
        }

        ul.dropdown-menu-list-test {
            height: 30px;
            width: 150px;
            border: 1px #000 solid;
        }

            ul.dropdown-menu-list-test li {
                padding: 5px 10px;
                z-index: 2;
            }

                ul.dropdown-menu-list-test li:not(.init) {
                    float: left;
                    width: 130px;
                    display: none;
                    background: #ddd;
                }

                    ul.dropdown-menu-list-test li:not(.init):hover, ul li.selected:not(.init) {
                        background: #09f;
                    }

        li.init {
            cursor: pointer;
        }

        .select > ul {
            list-style: none;
        }

        .select ul li.option {
            background-color: #FFFFFF;
            box-shadow: 0px 1px 0 #DEDEDE, 0px -1px 0 #DEDEDE;
            -webkit-box-shadow: 0px 1px 0 #DEDEDE, 0px -1px 0 #DEDEDE;
            -moz-box-shadow: 0px 1px 0 #DEDEDE, 0px -1px 0 #DEDEDE;
        }

            .select ul li.option:hover {
                background-color: #B8B8B8;
            }

        .select ul li.option {
            z-index: 1;
            padding: 5px;
            display: none;
        }

        .select ul li:first-child {
            display: block;
        }

        .select ul li {
            cursor: default;
        }


        /* Compare Market */
        /* for the number of checked countries in the check box list of countries in the Chart tab - desktop*/
        #select-chart-country, #chart-country-list {
        }

        #list-of-countries-selected, .list-of-countries-selected {
            padding: 0.4em;
            margin: 1em 1em 0.8em 1em;
            background: #FFFFFF;
            border-radius: 5px;
            font-style: normal;
            font-weight: 500;
            font-size: 1em;
            line-height: 1.2em;
            color: #041B35;
        }

        #country-selection {
            background: #385578;
            display: flex;
            flex-direction: column;
            padding: 0em 0em 1em 0em;
        }


        /* Bar cHart responsive container*/
        .chart-filters {
            /*    border: 1px solid red;*/
        }

        /* radio buttons for the chart filters */
        .radio-styled label::before {
            content: "";
            margin-right: 5px;
            display: inline-block;
            vertical-align: text-top;
            width: 24px;
            height: 24px;
            border: 1px solid #FFFFFF;
            background: #385578;
            border-radius: 50%;
            position: absolute;
            top: 0;
            left: 0;
        }

        .radio-styled input:checked + label::after {
            content: "";
            position: absolute;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background-color: white;
            top: 6px;
            left: 6px;
        }

        .page-compare-market #country-selection .radio-selection-filters {
            display: flex;
            background: #385578;
            width: 100%;
            color: #ffffff;
        }

        .radio-styled label {
            position: relative;
            cursor: pointer;
            padding: 0 0 0 2em;
            text-transform: capitalize;
            color: #FFFFFF; /*#032b55;*/
            font-size: 0.9em;
            font-weight: 500;
            height: 1.1em;
            margin: 1em;
        }

        .page-compare-market #country-selection .filter, .page-compare-competitor #country-selection .filter {
            display: flex;
            background: #385578;
            width: 100%;
        }
        /* Compare Markets - Single Country View - carousel slides */
        .intro-slide-content {
            display: flex;
            flex-grow: 1;
            flex-direction: column;
            align-items: center;
            flex-wrap: wrap;
            margin: 0.5em;
        }

        .intro-text-to-select-market {
            font-style: normal;
            font-weight: 500;
            font-size: 1.2em;
            line-height: 1.4em;
            text-align: center;
            /* /#385577 80% */
            color: #385577;
            margin-bottom: 2.5em;
        }

        .market-info-text {
            font-style: normal;
            font-weight: 500;
            font-size: 18px;
            line-height: 21px;
            /* identical to box height */
            text-align: center;
            /* #062B55 */
            color: #062B55;
        }

        .input-group-append {
            display: flex;
            flex-wrap: nowrap;
            height: 2em;
        }

        .input-group-search {
            position: relative;
            display: flex;
            border-collapse: separate;
            background: #FFFFFF;
            border-radius: 5px;
        }

        /* for the input search group on the glossary page - responsive*/
    .input-group-glossary {
        border-radius: 5px;
        border: 1px solid #6A8099;
        margin: 1em 1em 0em 1em;
    }
    .form-control:focus {
        outline: 0 !important;
        border-color: initial;
        box-shadow: none;
    }

        .rounded-right {
            -moz-border-radius-bottomright: .2rem;
            -moz-border-radius-topright: .2rem;
        }

        .input-group-sm > .custom-select,
        .input-group-sm > .form-control,
        .input-group-sm > .input-group-append > .btn,
        .input-group-sm > .input-group-append > .input-group-text,
        .input-group-sm > .input-group-prepend > .btn,
        .input-group-sm > .input-group-prepend > .input-group-text {
            padding: .25rem .5rem;
            font-size: 1.25rem;
            line-height: 1.5;
            border-radius: 5px; /*.2rem;*/
            /*nov  border-radius: 0!important;  */
            background-color: #FFFFFF;
            border: none;
        }

        /* Compare Markets - single country view - filter to search by Country at the top of the carousel */
        .market-filter, .product-filter, .country-filter {
            /* width: 100%;*/
            background-color: #385577;
            line-height: 1em;
            height: auto;
            padding: 1em;
        }

        /* Compare Markets - Single Country View - paging information  */
    #importer-slider-heading > div.importer-heading-item > h4 > span,
    #exporter-slider-heading > div.exporter-heading-item > h4 > span,
    #product-slider-heading > div.product-heading-item > h4 > span,
    #country-slider-heading > div.country-heading-item > h4 > span,
    #applied-tariffs-country-slider-heading > div.country-heading-item > h4 > span,
    #trade-measures-slider-heading > div.trade-measures-heading-item > h4 > span,
    #temporary-measures-slider-heading > div.temporary-measures-heading-item > h4 > span,
    .country-slider-heading > div.country-heading-item > h4 > span {
        font-size: 0.7em;
        color: #385577;
        line-height: 1em;
        margin: 1em;
    }

        /* buttons for the Compare - Markets page */
        .btn-bar-above-tabs {
            border: 0;
            border-radius: 0;
            padding: 5px 15px;
            background: #fff;
            transition: background-color 0.1s ease-out;
            -webkit-transition: background-color 0.1s ease-out;
            -moz-transition: background-color 0.1s ease-out;
            -ms-transition: background-color 0.1s ease-out;
            -o-transition: background-color 0.1s ease-out;
        }

            .btn-bar-above-tabs:hover {
                background: #ddd;
            }

        /* Compare - Markets page */
        /* the list of checkboxes for single country view or single indicator view .... */
        /* #toggle-filters-responsive is for the list of indicators that the user can check or uncheck for the Single Country View */
    #toggle-select-single-view-responsive,
    #toggle-filters-responsive {
        position: absolute;
        width: 20em; /* 315px;*/
        background-color: #fff;
        z-index: 9999;
        right: 5vw; /* 15px; */ /* resizing for Arabic*/
        top: auto;
        font-size: 0.9em; /* 14px;*/
        color: #032B55;
        letter-spacing: 0.1px;
        line-height: 24px;
        padding: 20px 0 20px 30px;
        box-shadow: 0 0 3px 0 rgb(0 0 0 / 20%);
        border-radius: 3px;
    }

    /* Trade agreement single view dropdown list to be on the rigt for Arabic! !*/
    html:lang(ar) #toggle-select-single-view-responsive {
        left: 5vw;
        right: unset;
        padding: 1em;
    }

    /* Trade agreement fo;ers dropdown list to be on the right for Arabic!!*/
    html:lang(ar) #toggle-filters-responsive {
        right: unset;
        left: 4vw; /*8vw;*/
        padding: 0.5em; /* 1em; */
    }


            #toggle-select-single-view-responsive span,
            #toggle-filters-responsive span {
                font-weight: 700;
                font-size: 18px;
                color: #333333;
                line-height: 36px;
                text-transform: uppercase;
            }

                #toggle-select-single-view-responsive span.badge,
                #toggle-filters-responsive span.badge {
                    display: inline-block;
                    min-width: 10px;
                    padding: 3px 7px;
                    font-size: 12px;
                    font-weight: 700;
                    line-height: 1;
                    color: #fff;
                    text-align: center;
                    white-space: nowrap;
                    vertical-align: baseline;
                    background-color: red;
                    border-radius: 10px;
                }

            #toggle-select-single-view-responsive > ul,
            #toggle-filters-responsive > ul {
                list-style-type: none;
                padding: 0;
                margin: 0;
            }


    html:lang(ar) #toggle-filters-responsive > ul {
        list-style-type: none;
        padding: 1em;
        margin: 0;
    }


    #toggle-select-single-view-responsive > ul li,
    #toggle-filters-responsive > ul li {
        vertical-align: text-top;
        padding: 0 0 0 30px;
        cursor: pointer;
        text-transform: capitalize;
        color: #385577;
        font-weight: 500;
    }


    html:lang(ar) #toggle-select-single-view-responsive > ul li,
    html:lang(ar) #toggle-filters-responsive > ul li {
        padding: 0 11vw 0 0px; /*  0 33px 0 0px*/
    }

    #toggle-select-single-view-responsive > ul li a,
    #toggle-filters-responsive > ul li a {
        color: #032B55;
    }


    #toggle-select-single-view-responsive > ul li.checked {
        background: url(../png/tick-icon.png) 0 0 no-repeat;
    }


    html:lang(ar) #toggle-select-single-view-responsive > ul li.checked {
        background: url(../png/tick-icon.png) 15em no-repeat;
    }


    #toggle-filters-responsive > ul li.checked {
        /*  background: url(../images/icons/svg/checkbox_checked.svg) 0 0 no-repeat;*/
        background: url(../png/blue-checked-checkbox.png) 0 0 no-repeat;
    }

    html:lang(ar) #toggle-filters-responsive > ul li.checked {
        background: url(../png/blue-checked-checkbox.png) 15em no-repeat;
    }

    #toggle-select-single-view-responsive > ul li.unchecked,
    #toggle-filters-responsive > ul li.unchecked {
        /*   background: url(../images/icons/svg/checkbox.svg) 0 0 no-repeat;*/
        background: url(../png/blue-unchecked-checkbox.png) 0 0 no-repeat;
    }

    html:lang(ar) #toggle-select-single-view-responsive > ul li.unchecked,
    html:lang(ar) #toggle-filters-responsive > ul li.unchecked {
        /*   background: url(../images/icons/svg/checkbox.svg) 0 0 no-repeat;*/
        background: url(../png/blue-unchecked-checkbox.png) 15em no-repeat;
    }


    /* unchecked or just missing class "checked" */
    #toggle-select-single-view-responsive > ul li {
        background-color: #FFFFFF;
    }

        #toggle-filters-responsive > ul li {
            /*  background: url(../images/icons/svg/checkbox.svg) 0 0 no-repeat;*/
            background: url(../png/blue-unchecked-checkbox.png) 0 0 no-repeat;
        }


    html:lang(ar)  #toggle-filters-responsive > ul li {
        /*  background: url(../images/icons/svg/checkbox.svg) 0 0 no-repeat;*/
        background: url(../png/blue-unchecked-checkbox.png) 15em no-repeat;
    }


        .col-vis {
            display: none;
        }

        #select-single-indicator {
            width: 100%;
            background-color: #385577;
        }

        #list-map-type-mobile > option {
            text-transform: capitalize;
        }

        #list-map-type-mobile {
            /*     margin-top:3.2em;*/
        }

        .select-single-indicator > option,
        #lstSingleIndicatorView > option {
            line-height: 1.7rem;
            list-style: outside none none;
            margin: 0;
            padding: 0.2em 0.8em;
            font-size: 12px;
            font-weight: 500;
        }

        #table-view-tab-responsive > .view-tab-icon-text {
            /*  background-color: #385577; */ /* dark navy for the tab colour */
            font-size: 1em;
            text-transform: capitalize;
        }

        /* Tab texts which are not active */
        .nav-tabs > li > a {
            font-weight: bold;
            font-size: 1em;
            color: #385577;
            text-align: center;
            min-width: 2em;
            border-radius: 0;
            padding: 1em 1.2em;
            text-transform: capitalize;
        }

        /* dataTables sorting icon to be on the left */
        table.dataTable thead .sorting_asc:not(.col-vis):after {
            /* background-image:   url(../images/icons/svg/sort.svg);  */
            transform: scaleY(-1);
            background-image: url('../png/sort-arrows-updown.png');
        }

        table.dataTable thead .sorting_desc:not(.col-vis):after {
            /*     background-image: url(../images/icons/svg/sort.svg); */
            background-image: url('../png/sort-arrows-updown.png');
        }

        table.dataTable thead .sorting_asc:not(.col-vis):after, table.dataTable thead .sorting_desc:not(.col-vis):after {
            content: '';
            width: 1.1em; /* 17px; */
            height: 0.8em; /* 10px; */
            display: block;
            position: absolute;
            /*  right: 10px;*/
            left: 0.3em;
            top: 0.8em; /* 14px;*/
        }

        /* the bar just above the tabs container for Compare pages, Data Availability etc*/
        /* also for the COVID page to have the RESULTS title before the tab headings */
    #search-results-responsive > div.tabs-container > div.bar-above-tabs, #data-availability-tabs-container > div.bar-above-tabs,
    .page-trade-measure .bar-above-tabs, .page-trade-agreement .bar-above-tabs{
        list-style: none;
        display: flex;
        flex-direction: row;
        align-content: center;
        align-items: center;
        justify-content: space-between;
        padding: 0.5em;
    }

    .bar-above-tabs-item {
        /*width:-webkit-fill-available;  for Arabic!*/
        justify-content: space-between;
        display: flex;
    }

        /* Showing 1 to 6 of 6 entries at the top of the data table - don't show for responsive*/
        /* or for product data table*/
        #imp-vw-results-table-responsive_info, #exp-vw-results-table-responsive_info, #prd-vw-results-table-responsive_info {
            display: none;
        }

    .results-title-inside-bar {
        align-self: flex-start;
        /* border: 1px solid red;*/
        font-style: normal;
        font-weight: bold;
        font-size: 1.0em;
        line-height: 1.2em;
        /* identical to box height, or 114% */
        /* /#385577 80% */
        color: #385577;
        padding: 0.4em 0.2em;
        text-transform: uppercase; /* for the title "Results" to be in uppercase for pages like COVID*/
    }

        #search-results-responsive {
            background: #FFFFFF;
            /* /#CDD5DD 20% */
            border: 1px solid #CDD5DD;
            box-sizing: border-box;
            box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
            border-radius: 5px;
            max-width: 100%;
        }

        /* to have the navy blue tab */
        .table-top {
            background: #385577;
            color: #FFF;
            border-bottom: 0;
            /*    padding: 16px; */ /* 20px; */
            padding: 0em 0em 1em 0em;
            display: flex;
            align-items: center;
            border-bottom: 2px solid #dee4ea;
            width: 100%;
        }

        .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
            background: #385577; /* #7E96A9; */
            color: #FFF;
            font-weight: 500;
            border: 0;
        }

        .page-compare-market .map-filters:before, .page-compare-competitor .map-filters:before {
            background: #385577;
        }

        .table-top > div {
            flex-grow: 0;
        }

        .table-top .dataTables_filter input {
            background: #FFFFFF;
            border-radius: 5px;
            display: inline-block;
            /*  width: 250px; */
            border: 1px solid #dee4ea;
            margin-left: 0; /*10px;*/
            height: 35px; /*35px;  3em*/
            box-shadow: none;
        }

        #search-results-responsive > div.tabs-container > ul > li.col-vis-ctn {
            border: 1px solid red;
        }
        /* Access page title icon */
        .page-icon {
            display: block;
            margin: 0.4em 0.1em 0.7em 0.1em;
        }
        /* Compare Pages - page icons that go with the blue page title at the top*/
            .page-icon[data-page-title="CompareProducts"] {
                background: url('../png/compare-products-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

            .page-icon[data-page-title="CompareMarkets"] {
                background: url('../png/compare-markets-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

            .page-icon[data-page-title="CompareCompetitors"] {
                background: url('../png/compare-competitors-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

            /* COVID19 Trade measures icon to go with the blue page title*/
            .page-icon[data-page-title="TradeMeasures"] {
                background: url('../png/shield-virus-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

            /* Methodology icon to go with the blue page title*/
            .page-icon[data-page-title="Methodology"] {
                background: url('../png/about-methodology-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

            /* Data Availability icon to go with the blue page title*/
            .page-icon[data-page-title="DataAvailability"] {
                background: url('../png/about-data-availability-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

           
            /* Home page - Query - icon to go with the blue page title*/
            .page-icon[data-page-title="Query"] {
                /* background: url('../images/icons/png/about-data-availability-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;*/
                content: "";
            }


            /* Analyse - Trade Agreements icon */
            .page-icon[data-page-title="TradeAgreements"] {
                background: url('../png/about-data-availability-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

            /* Resources - FAQ icon */
            .page-icon[data-page-title="FAQ"] {
                background: url('../png/resources-faq-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }

            /* Resources - Glossary icon */
            .page-icon[data-page-title="Glossary"] {
                background: url('../png/glossary-icon.png') 0 0 no-repeat;
                width: 2.3em;
                height: 2.3em;
                content: "";
            }
    
    /* to centre-align the page's icon and blue title at the top of the page */
    .page-compare-detail .title,
    .page-trade-measure .title,
    .page-about-detail .title,
    .page-trade-agreement .title{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    /* Compare Markets results table */
    #toggle-col-vis-responsive {
        position: absolute;
        width: 315px;
        background-color: #fff;
        z-index: 9999;
        right: 1px;
        top: 1px;
        font-size: 14px;
        color: #032B55;
        letter-spacing: 0.1px;
        line-height: 24px;
        padding: 20px 0 20px 30px;
        box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
    }

            #toggle-col-vis-responsive span {
                font-weight: 700;
                font-size: 18px;
                color: #333333;
                line-height: 36px;
                text-transform: uppercase;
            }

                #toggle-col-vis-responsive span.badge {
                    display: inline-block;
                    min-width: 10px;
                    padding: 3px 7px;
                    font-size: 12px;
                    font-weight: 700;
                    line-height: 1;
                    color: #fff;
                    text-align: center;
                    white-space: nowrap;
                    vertical-align: baseline;
                    background-color: red;
                    border-radius: 10px;
                }

            #toggle-col-vis-responsive > ul {
                list-style-type: none;
                padding: 0;
                margin: 0;
            }

                #toggle-col-vis-responsive > ul li {
                    vertical-align: text-top;
                    padding: 0 0 0 30px;
                    cursor: pointer;
                    text-transform: uppercase;
                }

                    #toggle-col-vis-responsive > ul li a {
                        color: #032B55;
                    }

                    #toggle-col-vis-responsive > ul li.checked {
                        background: url(../svg/checkbox_checked.svg) 0 0 no-repeat;
                    }

                    #toggle-col-vis-responsive > ul li.unchecked {
                        background: url(../svg/checkbox.svg) 0 0 no-repeat;
                    }






        #search-results-desktop {
            display: none;
        }

        #search-results-responsive {
            display: block;
        }


        /* for the read more - read less product description in Compare markets - overview summary wrapper */
        #collapseExample {
            border: 0;
            margin-bottom: 0;
            opacity: 1;
        }

        .push {
            margin-left: auto;
        }


        #module {
            width: 100%;
            font-size: 14px;
            line-height: 1.5;
        }


            /*
        #module p.collapse[aria-expanded="false"] {
            height: 42px !important;
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        #module p.collapsing[aria-expanded="false"] {
            height: 42px !important;
        }

        */
            #module p.collapsing[aria-expanded="false"] {
                /* height: 42px !important;  */
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
            }



            #module a.collapsed:after {
                /*  content: '+ Show More';*/
                content: '+ ';
                font-size: 18px;
            }

            #module a:not(.collapsed):after {
                /*    content: '- Show Less';*/
                content: '-';
                font-size: 18px;
            }

            #module a.collapsed{
                text-decoration:none;
            }
            #module a:not(.collapsed) {
                text-decoration: none;
            }


            #module + p.collapsing[aria-expanded="false"] {
                /* height: 42px !important;  */
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
            }

        #collapseExample {
            height: inherit !important; /* height: 42px !important;  */
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
        }

            /* expanded paragraph*/
            #collapseExample.in {
                height: auto;
                -webkit-line-clamp: initial;
            }

        #ntm-summary-source {
            display: block;
        }

        #access-ntm-summary-wrapper {
            display: block;
        }


        #access-ntm-summary-sub-heading {
            display: none;
        }

        #taxes-fees-charges-source {
            margin-left: 0;
        }

        .source-text {
            font-weight: 500;
            font-size: 1em;
            line-height: 1.3em;
            /* or 19px */
            /* 70 % */
            color: rgba(6, 43, 85, 0.7);
            margin: 1em 1em 1em 0em;
        }
        /* Access - Trade Remedy page - summary */
        #access-trade-remedy-summary {
            display: none;
        }

        #access-trade-remedy-summary-wrapper {
            display: block;
        }
        /* for the ACESS - Customs Tariffs product lists to be maximum of 80vw to avoid the overflow width-wise  (chosen has width: 100%!important otherwise */
        #product-list, #ntlc_product_list_chosen {
            max-width: 78vw; /* 80vw   calc(90% - 6em);*/
        }

        #access-customs-duties-summary-wrapper {
            display: block;
        }
        /* hide the summary wrapper of ACCESS - Customs Tariffs for small screens*/
        #access-customs-duties-summary {
            display: none;
        }

        /* also hide the search summary for Compare Markets for small screens */
        #compare-market-highlight {
            display: none;
        }
    
        /* invalid product code on the search form to appear under the product code text box*/
    .search .search-input-group label.error {
        bottom: unset; /*  0    -2.9em;  -2.3rem;  -45px; */
    }

    /* for the Home page, the error should go under the product switch onoff checkbox on small screens*/
    /* as well as for the Access pages, and Compare - Markets, for the red invalid product message to go under the product switch*/
    .page-access-detail #market-access-query-form .product.input > #product-list-error.error,
    .page-access-overview #market-access-query-form .product.input > #product-list-error.error,
    .product.input > #product-list-error.error {
        bottom: -2.9em; /* -1.9em*/
    }

    #market-access-query-form .product.input > #product-list-error.error {
        bottom: -1.9em; 
    }

    /* Access - Trade Remedies Search form - product error */
    .page-trade-remedies #product-list-error.error {
        bottom: -2.9em;
    }
    /* Quota modal styles*/
    .inner-result-list .expanded .item-result-title {
        color: #002060;
        background: rgba(0, 115, 164, 0.1);
        border-radius: 5px;
        font-weight: 600;
    }


        .inner-result-list .item-result-detail i {
            color: unset;
        }

        .quota-information {
            font-style: normal;
            font-weight: 500;
            font-size: 1.3rem; /* 13px*/
            line-height: 1.5rem; /*15px */
            color: #0073A4;
        }
        /* styling the Bootstrap popvers on the Query Results page (they used to have the blue background */
        .popover .popover-content {
            background: none;
            font-size: 1.1rem;
            color: #041B35;
            line-height: 1.9rem;
            width: inherit;
        }

        .popover .popover-title {
            background: none;
            font-size: 1.2rem;
            color: #0073A4;
            font-weight: 600;
        }

        /* changing popovers from blue back to white....*/
        .popover .popover-content {
            background-color: #FFFFFF; /* was blue for the popover- rgba(6, 43, 85, 0.8);  */
            /*   background-color: #0073A4;   color: rgba(6, 43, 85, 0.7);*/
            font-size: 1.1rem;
            color: #0073A4; /* was previously white #FFFFFF; */
            line-height: 1.9rem;
            width: inherit;
            box-sizing: border-box;
            box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
            border-radius: 5px;
        }

        .popover .popover-title {
            background: none;
            font-size: 1.2rem;
            color: rgba(6, 43, 85, 0.8); /* #0073A4;*/
            font-weight: 600;
        }

        popover.right > .arrow:after {
            bottom: -10px;
            left: 1px;
            content: " ";
            border-right-color: #fff; /* rgba(6, 43, 85, 0.8);*/
            border-left-width: 0;
        }

        .popover.left > .arrow:after {
            right: 1px;
            bottom: -10px;
            content: " ";
            border-left-color: #fff; /* rgba(6, 43, 85, 0.8);*/
            border-right-width: 0;
        }
        /* for when the popover is above, make the little triangle blue too*/
        .popover.top > .arrow:after {
            bottom: 1px;
            margin-left: -10px;
            content: " ";
            border-top-color: #fff; /*rgba(6, 43, 85, 0.8);*/ /*#fff;*/
            border-bottom-width: 0;
        }
        /* for when the popover is below, make the little triangle blue too*/
        .popover.bottom > .arrow:after {
            top: 1px;
            margin-left: -10px;
            content: " ";
            border-top-width: 0;
            border-bottom-color: unset; /*rgba(6, 43, 85, 0.8); */ /*#fff;*/
        }
        /* for the Access - Customs Tariffs search box to fit and not blow out across width wise */
        .chosen-container {
            /* width: 326px !important;*/
            /* width: inherit !important;*/
        }

        .measure-label {
            color: #516B88;
            font-size: 0.7em;
        }

        .ntm-summary-detail-result {
            /*  font-size: 0.7em;
        padding: 1em 1em;
        width: calc(90% - 5px); */
            padding: 1em 1em;
            margin: 0.5em 0.5em;
        }
        /* headings in the  Query Results page*/
        .container .results-panel .heading {
            font-size: 2.4rem;
            color: rgba(36, 36, 36, 0.8);
            letter-spacing: -0.19px;
            margin: 50px 0 30px;
            line-height: 2.8rem;
        }

        #trade-remedy-responsive-content {
            display: block;
        }

        #trade-remedy {
            display: none;
        }

        #ntm-summary {
            display: none;
        }

        #ntm-summary-responsive-content {
            display: block;
        }
        /* #quota-results-responsive > ul > li.expanded > div > ul */
        #quota-results-responsive > ul > li.expanded > div > ul {
            font-size: 0.9em; /*13.5px*/
            /*  padding-left: 2em; */
            padding: 2em 1em 1em 0em;
            width: unset;
            font-style: normal;
            font-weight: 500;
            line-height: 1.2em; /* 16px */
            color: #062B55;
        }
            /* between each LI for the quota information */
            #quota-results-responsive > ul > li.expanded > div > ul > li {
                margin: 1.8em 0em 1em 0em; /* 1em 0em 1em 0em;*/
            }

        .inner-result-list .item-result-detail {
            font-size: 0.7em;
            padding-left: 2em;
            width: 20em; /*  calc(90% - 5px);  ......calc(1.2vw *35 + 0.5vmin)  */
        }
        /*for the Company Note of Trade Remedies Modal*/
        .inner-result-list.company-list .item-result-detail {
            font-size: 0.9em;
            /*   border: 1px solid red;*/
            text-align: left;
            padding: 0em;
            width: inherit;
        }

        /* Right align the text in the Company note table in the Trade Remedies modal in Arabic ! */
    html:lang(ar) .inner-result-list.company-list .item-result-detail {
        text-align: right;
    }

    .inner-result-list .item-result {
        width: 20em; /* calc(100% - 5px);*/
        padding-bottom: 0.4rem;
    }
        /*********************************ntm summary results grid ***********/
        /* for positioning of the popovers above the i icon on the left hand side of the NTM summary table, since it's placed inside a TD cell*/
        .popover-here {
            position: absolute;
            float: left;
            width: 80vw;
            margin: inherit;
        }
        /* for the Learn more button in the  NTM tooltips*/
        .popover-content .action-bar a.btn-learn-more {
            color: #fff;
            font-size: 1.2em; /* make it a touch bigger than the main tooltip text*/
        }
        /* have a bit of a gap between the tooltip text and the learn more button*/
        .popover-blue-bg + .popover .popover-content .action-bar {
            padding: 1em 0em;
        }

        .container .results-panel .results #ntm-summary-results table tbody tr.styled-row {
            /*   background-color: red;    */
        }

        .container .results-panel .results #ntm-summary-results table tbody tr td.grey-border {
            background: #FFFFFF;
            border: 1px solid #CDD5DD;
            box-sizing: border-box;
            box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
            border-radius: 5px;
        }

            .container .results-panel .results #ntm-summary-results table tbody tr td.grey-border:hover {
                background-color: #CDD5DD;
            }

        .measure-summary-on-right > .measure-extra-infor {
            position: absolute;
            z-index: 1;
            background: #fff;
            border-radius: 2px;
            box-shadow: 2px 2px 10px 2px rgb(0 0 0 / 10%);
            color: #333;
            font-weight: normal;
            padding: 10px 30px 15px;
            width: 70vw;
            max-width: 70vw;
            top: 28px;
            opacity: 0;
            visibility: hidden;
        }

        .measure-summary-on-right:hover .measure-extra-infor {
            opacity: 1;
            visibility: visible;
        }

        .measure-count {
            margin-left: 0.2em;
        }

        #ntm-summary-results > h5 > span {
            display: flex;
            justify-content: space-between;
            font-size: 0.8em;
            width: inherit
        }

        #ntm-summary-results .tab-title.dark-blue {
            background-color: #385577;
            /*      padding: 1em 1em 1em 1.3em;*/
            margin-left: 1.75em;
            margin-top: 1em;
            margin-bottom: 1em;
        }

        .container .results-panel .results table tbody tr td i {
            font-size: 1.2em;
            width: 0.8em;
            text-align: center;
            vertical-align: text-bottom;
        }

        span.total-measures-text {
            color: #516B88;
            font-weight: 500;
            font-size: 1em;
            line-height: 130%;
            margin-bottom: 1em;
            margin-left: 1.8em;
        }
        /*********************************************************************/
        /* RESULTS TABLE in the modal Trade Remedy Details for small screens */
        .container .results-panel .results table thead {
            background: #ebeef2;
        }

            .container .results-panel .results table thead th {
                font-weight: bold;
                color: #FFF;
                background: #385577; /* slightly paler blue */
                /*   letter-spacing: 0.2px;*/
                line-height: 1.2em;
                vertical-align: top;
                opacity: 1;
                border: 0;
                font-size: 0.8em;
            }

        .container .results-panel .results table tbody tr.even {
            background: #E6EAEE; /* #FAFAFA;  */
        }
        /* ADDED*/
        .table {
            width: 100%;
            max-width: 100%;
            margin-bottom: 20px;
            border-collapse: separate;
            border-spacing: 0 0.4em; /* a small gap between each row */
        }

        /* for About - Methodology CMS content - tables */
        figure > .table {
            font-size: 0.7em;
        }


        .container .results-panel .results table tbody tr td {
            vertical-align: top;
            position: relative;
            border: 0;
            font-style: normal;
            font-weight: 500;
            font-size: 0.7em;
            line-height: 2em;
            color: #385577;
        }

        div.trade-remedy-details-responsive > table > tbody > tr > td {
            vertical-align: top;
            position: relative;
            border: 0;
            font-style: normal;
            font-weight: 500;
            font-size: 0.7em;
            line-height: 2em;
            color: #385577;
            max-width: 13em;
        }
        /****************************************************************/
        /* on small screens, get rid of the 30px margin-left for these sections*/
        #ntm-summary-content,
        #trade-remedy-content,
        #custom-duties-content,
        #taxes-fees-charges,
        .overview-content {
            margin-left: 0;
        }

        /* no margin on the left for the query page's carousels*/
    #tax-list-carousel, .tax-slider-heading, .trade-remedy-slider-heading {
        margin-left: 0;
    }

        #topcontrol .hide {
            display: none;
        }

        #custom-duties {
            display: none;
        }

        #custom-duties-responsive-content {
            display: block;
        }

        #overview-summary-wrapper .column,
        .overview-page-wrapper .column {
            display: flex;
            flex-direction: column;
            flex-basis: 100%;
        }


    #trade-agreements-summary-wrapper .column,
    .overview-page-wrapper .column {
        padding: 1em 1em 0em 0em;
    }

    /* Trade agreement overview summary in Arabic!*/
    #trade-agreements-summary-wrapper .column,
    .overview-page-wrapper .summary-col {
        padding: 0;
    }

    .summary-heading {
        font-weight: 700;
        font-size: 15px; /*1em; */
        line-height: 18px;/* 1.3em */;
        /*  color: #041B35;*/
        color: rgba(6, 43, 85, 0.7);
    }

    .summary-row {
        display: flex;
        align-items: flex-start;
        padding: 0em 0em 1em 0em;
        column-gap: 1.875rem;
    }
    .summary-column {
        display: flex;
        flex-direction: column;
        row-gap: 0.25em;
    }

    .summary-text {
        font-size: 15px; /*1em; */
        line-height: 18px;/*1.3em;*/
        color: #041B35; 
    }

    .summary-column-blank{
        width:25px;
    }
    .summary-column-with-show-more-button {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        width: -webkit-fill-available;
    }

    .overview-page-wrapper .column1 {
        display: flex;
        flex-direction: column;
    }

        #module > div.row.column-full-justified > div.column1 {
            display: flex;
            flex-direction: column;
        }

        #overview-summary-wrapper > div > div.row.column-full-justified {
            display: flex;
            justify-content: space-between;
            flex-flow: nowrap;
        }
        /* for the quota modal */
        .inner-result-list {
            padding: 0;
            max-width: fit-content; /* 20em; */
            list-style-type: none;
        }

            .inner-result-list.company-list {
                padding: 0;
                max-width: inherit; /* 20em; */
                list-style-type: none;
                vertical-align: text-top;
            }
                /* For the Company Note*/
                .inner-result-list.company-list > li {
                    margin-top: 0;
                    padding: 0;
                }


            .inner-result-list > li {
                background: #FAFAFA;
                margin-top: 1em;
            }

            .inner-result-list > li {
                padding: 0.2em;
            }

        #quota-results-responsive > ul > li.expanded {
            /*    background-color: rgba(0, 115, 164, 0.1);*/
            background-color: unset;
        }

        .inner-result-list .txt-truncatable {
            display: inline-block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            max-width: -webkit-fill-available; /* desktop version - it flows off the screen*/
            vertical-align: top;
        }


        .inner-result-list.company-list .txt-truncatable {
            display: inline-block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            max-width: -webkit-fill-available; /* desktop version - it flows off the screen*/
            vertical-align: top;
            -webkit-line-clamp: 3;
            /* border: 1px solid yellow;*/
        }

        .quota-detail .item-result-detail {
            display: flex;
            flex-direction: column;
            align-items: inherit;
        }

        .fta-find-out-more {
            display: flex;
            justify-content: center;
        }

        .fta-result-responsive-find-out-more {
            display: none;
        }

        div.find-more-wrapper {
            color: #0073A4;
            width: fit-content;
            padding: 1em 1em !important;
            border: 3px solid #0073A4;
            box-sizing: border-box;
            border-radius: 5px
        }
        /* for the Agreement details modal's content*/
        .agreement-detail-responsive {
            display: flex;
            flex-direction: column;
            width: 100% /* was max-content;  custom tariffs agreements details*/
        }

        div.content-row {
            padding: 0.8em 0em;
        }

        div.lbl-modal {
            font-size: 1em;
            font-weight: bold;
            color: rgba(6, 43, 85, 0.7);
            line-height: 1.4em;
            text-transform: uppercase; /* for the labels to be in uppercase*/
        }

        div.ctn-modal {
            font-size: 1em;
            font-weight: 500;
            color: #041B35;
            line-height: 1.1em;
            padding: 0.3em 0em
        }

        .details-heading,
        .details-title {
            font-weight: 600;
            line-height: 1.4em;
            font-size: 1.2em;
        }


        .details-heading {
            color: #385577; /*dark blue*/
            font-weight: 600;
            line-height: 1.4em;
            font-size: 1.2em;
            /* margin: 1em 2em;*/ /* caz - new*/
        }

/* ===== COVID19 element styles ===== */
.header-nav nav ul.main-nav .menu-item-covid19 a {
    color: #fff;
    font-weight: 800;
    text-shadow: 1px -2px 30px #f74d4d;
    transition: all 0.05s ease-out;
}
        #taxes-fees-charges .heading {
            margin-left: 0;
        }

        .trade-remedy-details-responsive {
            margin: 1em 2em;
            /*   border: 1px solid red;*/
        }

        .modal-details-title {
            color: #0073A4; /*lighter blue*/
            font-weight: 600;
            line-height: 1.4em;
            font-size: 1.2em;
        }

        .modal-details-content-title {
            color: rgba(6, 43, 85, 0.7);
        }

        .wrap-for-details {
            padding: 1em 1em;
            margin: 0.5em 0.5em;
        }

        .modal-for-details {
            position: relative;
            padding: 0px;
        }

        .styled-tooltip .tooltip-content {
            -webkit-transform: translateX(-40%) !important;
            -moz-transform: translateX(-40%) !important;
            transform: translateX(-40%) !important;
            left: 50%;
            top: 50%;
            height: max-content;
            min-width: 11em;
        }

        .title-with-tooltip {
            align-items: baseline;
            justify-items: left;
            display: flex;
        }

        .tax-info-data-menu {
            /* position: absolute;  */
            background-color: #E6EAEE;
        }

        .overview-page-wrapper .legend-column {
            display: none;
        }

        #taxes-fees-charges-content {
            display: none;
        }


        #taxes-fees-charges-responsive-content {
            display: block;
        }



        .modal-header .close {
            /*  margin-top: 4px !important;*/
            float: left;
        }


        .modal-header {
            padding: 0 !important;
            border: 0;
        }

        .tax-module-list .boxes {
            /* border: 1px solid red;*/
            justify-content: center;
        }

        .tax-module-list .boxes {
            flex-wrap: wrap;
        }

            .tax-module-list .boxes .box {
                flex: 1 0 auto;
                /* max-width: 48%; */
                width: min-content; /*88%; */
                margin: 1em;
            }

        .header-nav nav > ul > li.has-children.expanded:after {
            content: "-"; /* after the user clicks on the top level menu item from the responsive navbar, the + symbol changes to a - after it's been expanded*/
            /* background: url('../../content/images/icons/png/blue-up-arrow-sml.png');*/
            font-weight: bold;
            color: #4FCBFF;
        }

        .header-nav nav > ul > li.has-children.expanded > a {
            color: #4FCBFF;
        }


        .page-trade-measure {
        }

            .page-trade-measure #trade-measures-table thead {
                display: none;
            }

            .page-trade-measure #trade-measures-table tbody tr {
                display: block;
                border-bottom: 1px solid #eee;
                padding: 15px 15px;
            }

            .page-trade-measure #trade-measures-table tbody td {
                width: 100%;
                display: block;
            }

                .page-trade-measure #trade-measures-table tbody td:before {
                    content: attr(data-title) ": ";
                    font-weight: bold;
                    color: #333;
                    padding-top: 5px;
                    padding-bottom: 5px;
                }

            .page-trade-measure .table-top {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
            }



                .page-trade-measure .table-top > * {
                    margin: 8px 0px;
                }

            .page-trade-measure table {
                margin-bottom: 100px;
            }

            .page-trade-measure .table-bottom {
                display: flex;
                flex-direction: column;
                position: fixed;
                bottom: 0;
                z-index: 1;
                background: #fff;
                left: 0;
                right: 0;
                padding: 10px 5px 0;
                visibility: hidden;
            }

                .page-trade-measure .table-bottom > * {
                    flex: 1 0 100%;
                    margin: 0;
                    width: 100%;
                    text-align: center;
                    display: flex;
                    justify-content: center;
                }

                .page-trade-measure .table-bottom .dataTables_length label {
                    display: flex;
                    align-items: center;
                }

                    .page-trade-measure .table-bottom .dataTables_length label select {
                        margin: 0 5px;
                    }

                .page-trade-measure .table-bottom .pagination {
                    margin: 5px 0;
                }
    }

    @media (max-width: 767px) {

        .page-trade-measure #map-container-export .highcharts-credits,
        .page-trade-measure #map-container-export .highcharts-credits {
            display: none;
        }
    }




    @media (max-width: 1199px) {
        .page-trade-measure {
        }

            .page-trade-measure #trade-measures-table thead {
                display: none;
            }

            .page-trade-measure #trade-measures-table tbody tr {
                display: block;
                border-bottom: 1px solid #eee;
                padding: 15px 15px;
            }

            .page-trade-measure #trade-measures-table tbody td {
                width: 100%;
                display: block;
            }

                .page-trade-measure #trade-measures-table tbody td:before {
                    content: attr(data-title) ": ";
                    font-weight: bold;
                    color: #333;
                    padding-top: 5px;
                    padding-bottom: 5px;
                }

            .page-trade-measure .table-top {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
            }



                .page-trade-measure .table-top > * {
                    margin: 8px 0px;
                }

            .page-trade-measure table {
                margin-bottom: 100px;
            }

            .page-trade-measure .table-bottom {
                display: flex;
                flex-direction: column;
                position: fixed;
                bottom: 0;
                z-index: 1;
                background: #fff;
                left: 0;
                right: 0;
                padding: 10px 5px 0;
                visibility: hidden;
            }

                .page-trade-measure .table-bottom > * {
                    flex: 1 0 100%;
                    margin: 0;
                    width: 100%;
                    text-align: center;
                    display: flex;
                    justify-content: center;
                }

                .page-trade-measure .table-bottom .dataTables_length label {
                    display: flex;
                    align-items: center;
                }

                    .page-trade-measure .table-bottom .dataTables_length label select {
                        margin: 0 5px;
                    }

                .page-trade-measure .table-bottom .pagination {
                    margin: 5px 0;
                }
    }

    @media (max-width: 767px) {


        .page-trade-measure #map-container-export .highcharts-credits,
        .page-trade-measure #map-container-export .highcharts-credits {
            display: none;
        }
    }
    /* ===== end COVID19 element styles ===== */


.page-methodology #block-terms-content,
.afcfta-page #block-terms-content {
    counter-reset: term-section;
}

    .page-methodology #block-terms-content .term-group .group-text:before,
    .afcfta-page #block-terms-content .term-group .group-text:before {
        counter-increment: term-section;
        content: counter(term-section, upper-roman) " - ";
    }

.page-methodology .term .terms-by-group,
.afcfta-page .term .terms-by-group {
    padding: 15px;
}

.page-methodology .term .item-title,
.afcfta-page .term .item-title {
    padding: 7px 15px;
    font-weight: bold;
}

.page-methodology .term ul
.afcfta-page .term ul {
    padding-right: 0;
    padding-bottom: 0;
}

.page-methodology .term .item-description,
.afcfta-page .term .item-description {
    padding: 15px;
}

.page-methodology .term .terms-inner-wrapper ul,
.afcfta-page .term .terms-inner-wrapper ul {
    position: relative;
    list-style-type: none;
    padding-left: 20px;
}

.page-methodology .term .terms-inner-wrapper li,
.afcfta-page .term .terms-inner-wrapper li {
    position: relative;
    border-left: 1px dashed #002060;
}
/* Interlinking on the AfCFTA Page*/
.link-to-library {
    color: #b72c2b !important; /*  a darker red than red!important; */
    font-weight: 600;
}

.link-to-FAQ {
    color: black !important; /*green!important;*/
}

.link-to-terminology {
    color: #00344f !important; /*darkblue!important;  */
    font-weight: 600;
}

.title-with-icon {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
/*===end Interlinking on the AfCFTA Page*/