/**
    Project Name: ADCB
    File Name: Layout.css
    Support : Left To Right
    ------------------------------

    Components List
        
        - Common css
            - Typography
            - Body
            - Buttons
            - Helper classes
            - Form Controls
            - Header
            - Footer
            
        - Pages
            - Chairman Message Page Css
            - Home Page Css
            - Work Page Css
            - Key Performance Indicator Page Css
            - Board Of Directors Css
            - Strategic pillar Page Css
            - Board RoundTable Css
            - Sustainability Page Css
            - Risk Management Page Css
            - Business Review Page Css
            - awards Page Css
            - Corparate Governance Page Css
            - Financial Overview Page Css
            - Key Financial Highlights Page Css
**/

/*********************************
    Common Css
**********************************/

/** Typography **/

@font-face {
    font-family: 'MisterKOnstageOT';
    src: url('../fonts/MisterKOnstageOT.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MisterKOnstageOT.otf') format('opentype'),
    url('../fonts/MisterKOnstageOT.woff') format('woff'),
    url('../fonts/MisterKOnstageOT.ttf') format('truetype'),
    url('../fonts/MisterKOnstageOT.svg#MisterKOnstageOT') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MisterKOT';
    src: url('../fonts/MisterKOT.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MisterKOT.otf') format('opentype'),
    url('../fonts/MisterKOT.woff') format('woff'),
    url('../fonts/MisterKOT.ttf') format('truetype'),
    url('../fonts/MisterKOT.svg#MisterKOT') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSans-100';
    src: url('../fonts/MuseoSans-100.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSans-100.otf') format('opentype'),
    url('../fonts/MuseoSans-100.woff') format('woff'),
    url('../fonts/MuseoSans-100.ttf') format('truetype'),
    url('../fonts/MuseoSans-100.svg#MuseoSans-100') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSans-300';
    src: url('../fonts/MuseoSans-300.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSans-300.otf') format('opentype'),
    url('../fonts/MuseoSans-300.woff') format('woff'),
    url('../fonts/MuseoSans-300.ttf') format('truetype'),
    url('../fonts/MuseoSans-300.svg#MuseoSans-300') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSans-300Italic';
    src: url('../fonts/MuseoSans-300Italic.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSans-300Italic.otf') format('opentype'),
    url('../fonts/MuseoSans-300Italic.woff') format('woff'),
    url('../fonts/MuseoSans-300Italic.ttf') format('truetype'),
    url('../fonts/MuseoSans-300Italic.svg#MuseoSans-300Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSans-500';
    src: url('../fonts/MuseoSans-500.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSans-500.otf') format('opentype'),
    url('../fonts/MuseoSans-500.woff') format('woff'),
    url('../fonts/MuseoSans-500.ttf') format('truetype'),
    url('../fonts/MuseoSans-500.svg#MuseoSans-500') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSans-700';
    src: url('../fonts/MuseoSans-700.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSans-700.otf') format('opentype'),
    url('../fonts/MuseoSans-700.woff') format('woff'),
    url('../fonts/MuseoSans-700.ttf') format('truetype'),
    url('../fonts/MuseoSans-700.svg#MuseoSans-700') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSans-700Italic';
    src: url('../fonts/MuseoSans-700Italic.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSans-700Italic.otf') format('opentype'),
    url('../fonts/MuseoSans-700Italic.woff') format('woff'),
    url('../fonts/MuseoSans-700Italic.ttf') format('truetype'),
    url('../fonts/MuseoSans-700Italic.svg#MuseoSans-700Italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSansDisplay-ExtraLight';
    src: url('../fonts/MuseoSansDisplay-ExtraLight.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSansDisplay-ExtraLight.otf') format('opentype'),
    url('../fonts/MuseoSansDisplay-ExtraLight.woff') format('woff'),
    url('../fonts/MuseoSansDisplay-ExtraLight.ttf') format('truetype'),
    url('../fonts/MuseoSansDisplay-ExtraLight.svg#MuseoSansDisplay-ExtraLight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MuseoSansDisplay-Light';
    src: url('../fonts/MuseoSansDisplay-Light.eot?#iefix') format('embedded-opentype'),
    url('../fonts/MuseoSansDisplay-Light.otf') format('opentype'),
    url('../fonts/MuseoSansDisplay-Light.woff') format('woff'),
    url('../fonts/MuseoSansDisplay-Light.ttf') format('truetype'),
    url('../fonts/MuseoSansDisplay-Light.svg#MuseoSansDisplay-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'RedVevet';
    src: url('../fonts/RedVevet.eot?#iefix') format('embedded-opentype'),
    url('../fonts/RedVevet.otf') format('opentype'),
    url('../fonts/RedVevet.woff') format('woff'),
    url('../fonts/RedVevet.ttf') format('truetype'),
    url('../fonts/RedVevet.svg#RedVevet') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Rinstonia-Regular';
    src: url('../fonts/Rinstonia-Regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Rinstonia-Regular.otf') format('opentype'),
    url('../fonts/Rinstonia-Regular.woff') format('woff'),
    url('../fonts/Rinstonia-Regular.ttf') format('truetype'),
    url('../fonts/Rinstonia-Regular.svg#Rinstonia-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/** Typography For Arabic **/

@font-face {
    font-family: 'ZapfinoArabic-Regular';
    src: url('../fonts/ZapfinoArabic-Regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/ZapfinoArabic-Regular.otf') format('opentype'),
    url('../fonts/ZapfinoArabic-Regular.woff') format('woff'),
    url('../fonts/ZapfinoArabic-Regular.ttf') format('truetype'),
    url('../fonts/ZapfinoArabic-Regular.svg#ZapfinoArabic-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Brown-Thin';
    src: url('../fonts/Brown-Thin.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Brown-Thin.otf') format('opentype'),
    url('../fonts/Brown-Thin.woff') format('woff'),
    url('../fonts/Brown-Thin.ttf') format('truetype'),
    url('../fonts/Brown-Thin.svg#Brown-Thin') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINNextLTArabic-Light';
    src: url('../fonts/DINNextLTArabic-Light.eot?#iefix') format('embedded-opentype'),
    url('../fonts/DINNextLTArabic-Light.woff') format('woff'),
    url('../fonts/DINNextLTArabic-Light.ttf') format('truetype'),
    url('../fonts/DINNextLTArabic-Light.svg#DINNextLTArabic-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINNextLTArabic-Medium';
    src: url('../fonts/DINNextLTArabic-Medium.eot?#iefix') format('embedded-opentype'),
    url('../fonts/DINNextLTArabic-Medium.woff') format('woff'),
    url('../fonts/DINNextLTArabic-Medium.ttf') format('truetype'),
    url('../fonts/DINNextLTArabic-Medium.svg#DINNextLTArabic-Medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINNextLTArabic-Regular';
    src: url('../fonts/DINNextLTArabic-Regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/DINNextLTArabic-Regular.woff') format('woff'),
    url('../fonts/DINNextLTArabic-Regular.ttf') format('truetype'),
    url('../fonts/DINNextLTArabic-Regular.svg#DINNextLTArabic-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DINNextLTArabic-UltraLight';
    src: url('../fonts/DINNextLTArabic-UltraLight.eot?#iefix') format('embedded-opentype'),
    url('../fonts/DINNextLTArabic-UltraLight.woff') format('woff'),
    url('../fonts/DINNextLTArabic-UltraLight.ttf') format('truetype'),
    url('../fonts/DINNextLTArabic-UltraLight.svg#DINNextLTArabic-UltraLight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DiwaniLetter';
    src: url('../fonts/DiwaniLetter.eot?#iefix') format('embedded-opentype'),
    url('../fonts/DiwaniLetter.woff') format('woff'),
    url('../fonts/DiwaniLetter.ttf') format('truetype'),
    url('../fonts/DiwaniLetter.svg#DiwaniLetter') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AvantGardeLT-Bold';
    src: url('../fonts/AvantGardeLT-Bold.eot?#iefix') format('embedded-opentype'),
    url('../fonts/AvantGardeLT-Bold.woff') format('woff'),
    url('../fonts/AvantGardeLT-Bold.ttf') format('truetype'),
    url('../fonts/AvantGardeLT-Bold.svg#AvantGardeLT-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/** Body **/

body {
    font-size: 14px;
    font-family: 'MuseoSans-100';
    color: #333D47;
    letter-spacing: 0;
    padding: 0;
    margin: 0;
}

h1 {
    font-size: 28px;
    line-height: 35px;
    color: #333D47;
    letter-spacing: 0.22px;
    margin-top: 0;
    margin-bottom: 10px;
}

.title {
    font-size: 50px;
    line-height: 1.2;
    color: #E2231A;
    letter-spacing: 0.4px;
    margin-top: 0;
    margin-bottom: 10px;
}

h2 {
    font-size: 28px;
    line-height: 35px;
    color: #333D47;
    letter-spacing: 0.22px;
    margin-top: 0;
    margin-bottom: 10px;
}

.sub-title {
    font-size: 22px;
    line-height: 29px;
    color: #333D47;
    letter-spacing: 0;
    margin-top: 0;
    margin-bottom: 10px;
}

h3 {
    font-family: 'MuseoSans-500';
    font-size: 12px;
    line-height: 16px;
    color: #333D47;
    letter-spacing: 0.2px;
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 10px;
}

h4 {
    font-size: 14px;
    line-height: 22px;
    color: #333D47;
    letter-spacing: 0;
    margin-top: 0;
    margin-bottom: 10px;
}

h5 {
    font-family: 'MuseoSans-500';
    font-size: 10px;
    color: #333D47;
    letter-spacing: 1.1px;
    margin-top: 0;
    margin-bottom: 10px;
}

p {
    font-size: 14px;
    color: #333D47;
    letter-spacing: 0;
    line-height: 22px;
}

a,
a:hover,
a:focus {
    text-decoration: none;
    outline: none;
}

h3 span {
    display: block;
}

.large-title {
    font-family: 'MuseoSansDisplay-Light';
    font-size: 100px;
    line-height: 1;
    color: #E2231A;
    letter-spacing: -3px;
}

.page-title {
    margin-bottom: 100px;
}

.lead{
    font-size: 18px;
}
.small{
	font-size: 10px;
}
/** Buttons **/

/** Helper classes **/

.nomargin {
    margin: 0 !important;
}

.nopad {
    padding: 0 !important;
}

.nopad-top {
    padding-top: 0px !important;
}

.nopad-bottom {
    padding-bottom: 0px !important;
}

.font-light {
    font-family: 'MuseoSans-100' !important;
}

.font-regular {
    font-family: 'MuseoSans-300' !important;
}

.font-md {
    font-family: 'MuseoSans-500' !important;
}

.font-bold {
    font-family: 'MuseoSans-700' !important;
}

.font-italic {
    font-family: 'MuseoSans-300Italic' !important;
}

.font-italic-bold {
    font-family: 'MuseoSans-700Italic' !important;
}

.grey-bg {
    background: -moz-linear-gradient(45deg, rgba(36, 48, 59, 1) 0%, rgba(51, 61, 71, 1) 100%);
    /* ff3.6+ */
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(36, 48, 59, 1)), color-stop(100%, rgba(51, 61, 71, 1)));
    /* safari4+,chrome */
    background: -webkit-linear-gradient(45deg, rgba(36, 48, 59, 1) 0%, rgba(51, 61, 71, 1) 100%);
    /* safari5.1+,chrome10+ */
    background: -o-linear-gradient(45deg, rgba(36, 48, 59, 1) 0%, rgba(51, 61, 71, 1) 100%);
    /* opera 11.10+ */
    background: -ms-linear-gradient(45deg, rgba(36, 48, 59, 1) 0%, rgba(51, 61, 71, 1) 100%);
    /* ie10+ */
    background: linear-gradient(45deg, rgba(36, 48, 59, 1) 0%, rgba(51, 61, 71, 1) 100%);
    /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333D47', endColorstr='#24303B', GradientType=1);
    /* ie6-9 */
}

.white-bg {
    padding-top: 50px;
    padding-bottom: 50px;
}

.row-spacing {
    margin-bottom: 30px;
}

.content-block p {
    margin-bottom: 20px;
}

.display-block {
    display: block;
}

.text-silent {
    opacity: 0.5;
}

.red {
    color: #E2231A;
}

.white {
    color: #fff;
}

.pos-relative {
    position: relative;
}

.display-table {
    display: table;
    height: 100%;
    width: 100%;
    text-align: center;
}

.display-table-cell {
    display: table-cell;
    vertical-align: middle;
}

/** page-wrapper **/

.page-wrapper {
    padding-top: 125px;
    padding-bottom: 50px;
}

.page-top-clear {
    padding-top: 67px;
}

.homepage-wrapper {
    padding-top: 103px;
    padding-bottom: 0;
}


blockquote {
    border-left: none;
    border-right: none;
    position: relative;
    margin-bottom: 0;
}

.top-blockquote {
    font-size: 22px;
    color: #E2231A;
    letter-spacing: 0;
    line-height: 32px;
    padding: 15px 0;
}

.top-blockquote:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    width: 100%;
    background: -moz-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ff3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(226, 35, 26, 1)), color-stop(100%, rgba(191, 53, 40, 1)));
    /* safari4+,chrome */
    background: -webkit-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* safari5.1+,chrome10+ */
    background: -o-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* opera 11.10+ */
    background: -ms-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ie10+ */
    background: linear-gradient(0deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2231A', endColorstr='#BF3528', GradientType=0);
    /* ie6-9 */
}

/** Form Controls **/

/** Header **/

.navbar-container {
    position: relative;
}

.header .navbar-default {
    background-color: #fff;
    -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.10);
    border: none;
    border-radius: 0;
    padding-top: 17px;
    transition: 0.3s ease all;
}

.navbar {
    min-height: 83px;
    margin-bottom: 0;
}

.navbar.small-header {
    min-height: 49px;
}

.navbar-header {
    position: relative;
}

.navbar-brand {
    height: auto;
    padding: 7px 15px 0;
}

.navbar-brand .logo {
    display: inline-block;
    vertical-align: middle;
    width: 114px;
    overflow: hidden;
    transition: 0.3s ease all;
}

.navbar-brand img {
    display: inline-block;
}

.navbar-brand span {
    font-family: MuseoSans-700;
    font-size: 9px;
    color: #E2231A;
    letter-spacing: 0.99px;
    line-height: 12px;
    display: inline-block;
    padding-left: 16px;
    width: 60px;
    vertical-align: middle;
    text-transform: uppercase;
}

.language-download-block .language-link {
    float: left;
    opacity: 0.5;
    font-family: 'GeezaPro';
    font-size: 15px;
    line-height: 1;
    color: rgba(51, 61, 71, 1);
/*    display: none;*/
}

.language-download-block .download-link {
    float: right;
    font-family: 'MuseoSans-500';
    font-size: 8px;
    color: rgba(51, 61, 71, 0.50);
    letter-spacing: 0.88px;
    text-transform: uppercase;
    /*line-height: 1;*/
    line-height: 15px;
}

.language-download-block .language-link:hover,
.language-download-block .language-link:focus,
.language-download-block .download-link:hover,
.language-download-block .download-link:focus {
    color: rgba(51, 61, 71, 1);
}

.download-menu li a {
    position: relative;
    padding-right: 20px !important;
}

.download-menu li:first-child a span {
    top: 0;
}

.download-menu li a span {
    position: absolute;
    top: 10px;
    right: 0;
}

.navbar-header .mbl-language-link {
    display: none;
}

.navbar-nav > li {
    padding-left: 33px;
}

.navbar-nav > li:first-child {
    padding-left: 0;
}

.navbar-default .navbar-nav > li > a {
    font-family: 'MuseoSans-300';
    font-size: 13px;
    color: #333D47;
    letter-spacing: 0;
    line-height: 16px;
    padding: 16px 0 19px;
    position: relative;
}

.navbar-default .navbar-nav > li > a span.fa {
    display: none;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li.active > a,
.navbar-default .navbar-nav > li.active > a:hover,
.navbar-default .navbar-nav > li.active > a:focus,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
    color: #333D47;
    background-color: transparent;
}

/*.navbar-default .navbar-nav > li > a:hover:before,
.navbar-default .navbar-nav > li > a:focus:before,
.navbar-default .navbar-nav > li.active > a:before,
.navbar-default .navbar-nav > .open > a:before*/

.navbar-default .navbar-nav > li > a:hover:before,
.navbar-default .navbar-nav > li.active > a:before,
.navbar-default .navbar-nav > .open > a:before,
.navbar-default .navbar-nav > li.overwriteActive.open > a:before,
.navbar-default .navbar-nav > li.overwriteActive.open > a:hover:before {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    content: '';
    background: -moz-linear-gradient(left, rgba(191, 53, 40, 1) 0%, rgba(191, 53, 40, 1) 2%, rgba(226, 35, 26, 1) 99%);
    /* FF3.6+ */
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(191, 53, 40, 1)), color-stop(2%, rgba(191, 53, 40, 1)), color-stop(99%, rgba(226, 35, 26, 1)));
    /* Chrome, Safari4+ */
    background: -webkit-linear-gradient(left, rgba(191, 53, 40, 1) 0%, rgba(191, 53, 40, 1) 2%, rgba(226, 35, 26, 1) 99%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(191, 53, 40, 1) 0%, rgba(191, 53, 40, 1) 2%, rgba(226, 35, 26, 1) 99%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(191, 53, 40, 1) 0%, rgba(191, 53, 40, 1) 2%, rgba(226, 35, 26, 1) 99%);
    /* IE 10+ */
    background: linear-gradient(to right, rgba(191, 53, 40, 1) 0%, rgba(191, 53, 40, 1) 2%, rgba(226, 35, 26, 1) 99%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf3528', endColorstr='#e2231a', GradientType=1);
    /* IE6-9 */
}

.navbar-default .navbar-nav > li.overwriteActive > a:before,
.navbar-default .navbar-nav > li.overwriteActive > a:focus:before {
    background: #fff;
}

.dropdown-menu > li {
    display: inline-block;
    padding-left: 22px;
}

.navbar-nav > li > .dropdown-menu {
    border-radius: 0;
    background-color: #24303B;
    border: none;
    padding: 5px 15px;
    text-align: right;
}

.navbar-default .navbar-nav .dropdown-menu > li > a {
    color: rgba(255, 255, 255, 0.5) !important;
    text-transform: uppercase;
    font-size: 11px;
    font-family: 'MuseoSans-300';
    letter-spacing: 0.5px;
    line-height: 1.3;
    padding: 10px 0;
}

.navbar-default .navbar-nav .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .dropdown-menu > li > a:focus,
.navbar-default .navbar-nav .dropdown-menu > li > a.active {
    background-color: transparent;
    color: rgba(255, 255, 255, 1) !important;
}

.navbar-collapse-close {
    text-align: right;
    display: none;
}

.navbar-collapse-close a {
    display: inline-block;
    color: #fff;
    font-size: 23px;
    line-height: 1;
    font-weight: bold;
}

/** Footer **/

.footer {
    background-color: #24303B;
    padding: 20px 0 44px;
}

.footer h3 {
    color: #fff;
    margin-bottom: 20px;
}

.footer h5 {
    color: #fff;
    text-transform: uppercase;
}

.footer a {
    color: rgba(255, 255, 255, 0.5);
    font-size: 28px;
    color: rgba(255, 255, 255, 0.50);
    letter-spacing: 0.22px;
    line-height: 35px;
}

.footer a:hover,
.footer a:focus {
    color: rgba(255, 255, 255, 1);
}

.ribbon {
    position: relative;
}

.ribbon:after {
    position: absolute;
    top: -20px;
    left: 15px;
    display: inline-block;
    height: 54px;
    width: 20px;
    background: -moz-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ff3.6+ */
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(191, 53, 40, 1)), color-stop(100%, rgba(226, 35, 26, 1)));
    /* safari4+,chrome */
    background: -webkit-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* safari5.1+,chrome10+ */
    background: -o-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* opera 11.10+ */
    background: -ms-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ie10+ */
    background: linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2231A', endColorstr='#BF3528', GradientType=1);
    /* ie6-9 */
}


/** download-list **/

.download-list {
    position: fixed;
    width: 390px;
    top: 0;
    bottom: 0;
    right: -390px;
    background-color: #333D47;
    padding: 30px;
    z-index: 9999;
    -webkit-transition: 0.5s ease-in all;
    -moz-transition: 0.5s ease-in all;
    -ms-transition: 0.5s ease-in all;
    -o-transition: 0.5s ease-in all;
    transition: 0.5s ease-in all;
}

.download-list.download-list-slide {
    right: 0;
    -webkit-transition: 0.5s ease-out all;
    -moz-transition: 0.5s ease-out all;
    -ms-transition: 0.5s ease-out all;
    -o-transition: 0.5s ease-out all;
    transition: 0.5s ease-out all;
}

.download-list .download-list-header {
    text-align: right;
    margin-bottom: 105px;
}

.download-list .download-list-close {
    font-size: 30px;
    color: #fff;
}

.download-list .download-list-body h4 {
    text-transform: uppercase;
    color: #fff;
    border-bottom: 1px solid #fff;
    padding: 5px;
    margin-bottom: 30px;
}

.download-list .download-list-body ul {
    padding: 0;
    margin: 0;
}

.download-list .download-list-body ul li {
    margin-bottom: 20px;
}

.download-list .download-list-body ul li a {
    color: rgba(255, 255, 255, 0.5);
    font-size: 20px;
    display: block;
    position: relative;
}

.download-list .download-list-body ul li a:hover,
.download-list .download-list-body ul li a:focus {
    color: rgba(255, 255, 255, 1);
}

.download-list .download-list-body ul li a span {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 5px;
}

/*Modal Window*/

.modal-header {
    border-bottom-width: 0;
    padding: 30px 25px 35px;
}

.modal-body {
    padding-bottom: 90px;
}

.modal-content {
    box-shadow: none;
    background: #333D47;
    border-radius: 0;
}

.modal-content h2,
.modal-content h4,
.modal-content p {
    color: #fff;
}

.modal-backdrop.in {
    background-color: #fff;
    opacity: 0.75;
}

.close {
    opacity: 1;
    color: #fff;
    box-shadow: none;
    font-size: 36px;
}

.close:focus,
.close:hover {
    color: #fff;
    opacity: 0.7;
}


/******************************************************************************
    Pages
******************************************************************************/

/*********************************
    Chairman Message Page Css
*********************************/

.leadership-message .leadership-message-contet {
    position: relative;
}

.leadership-message-contet .leadership-profile-pic {
    padding: 100px 0 0 0;
}

.leadership-message-contet h1 {
    color: #fff;
    position: relative;
    z-index: 999;
    padding-top: 50px;
}

.leadership-message-contet blockquote {
    padding: 40px 0 0 0;
}

.leadership-message-contet blockquote p {
    color: #FFFFFF;
    letter-spacing: 0;
    line-height: 55px;
    margin-bottom: 25px;
    position: relative;
    z-index: 999;
}

.leadership-message.chairman-message blockquote p {
    font-family: 'RedVevet';
    font-size: 35px;
}

.leadership-message.ceo-message blockquote p {
    font-family: 'MisterKOT';
    font-size: 48px;
    text-align: center;
}

.leadership-message.ceo-message blockquote p.signature {
    text-align: right;
    padding-right: 120px;
}

.leadership-message.cfo-message blockquote p {
    font-family: 'Rinstonia-Regular';
    font-size: 28px;
}

.leadership-message.cfo-message blockquote p.signature {
    text-align: right;
    padding-right: 120px;
}

.signature-block img {
    margin-bottom: 35px;
}

.signature-block h3 {
    text-transform: capitalize;
}

.signature-block .designation {
    display: block;
}

.value-represent-block {
    margin: 0 0 30px;
}

/*********************************
    Home Page Css
*********************************/

.bx-wrapper img {
    width: 100%;
}

.home-overlay {
    background: rgba(255, 255, 255, 0.8);
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 100000;
}

.home-overlay .overlay-inner {
    background: #313b45;
    height: 90%;
    width: 100%;
    position: relative;
}

.home-overlay .overlay-inner:before {
    content: '';
    position: absolute;
    left: 0px;
    top: 0;
    background: -moz-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ff3.6+ */
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(191, 53, 40, 1)), color-stop(100%, rgba(226, 35, 26, 1)));
    /*safari4+,chrome */
    background: -webkit-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /*safari5.1+,chrome10+ */
    background: -o-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* opera 11.10+ */
    background: -ms-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ie10+ */
    background: linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2231A', endColorstr='#BF3528', GradientType=1);
    /* ie6-9 */
    width: 15px;
    height: 100%;
}

.overlay-content {
    position: absolute;
    left: 100px;
    bottom: 150px;
    display: inline-block;
}

.overlay-content .large-title {
    color: #fff;
}

.home-service-img a {
    background-size: cover !important;
    width: 100%;
    display: block;
    overflow: hidden;
    margin-bottom: 20px;
    background-position: center center;
    background-repeat: no-repeat;
}

.home-service-img img {
    width: 100%;
}

.center-part {
    margin-top: 30px;
}

.home-service-box {
    margin-bottom: 20px
}

.home-service-box img {
    margin-bottom: 20px;
}

.home-service-box h5 {
    text-transform: uppercase;
    margin-bottom: 0px;
}

.home-service-box h2 {
    margin-bottom: 0px;
}

.home-service-box h2 a {
    color: #333D47;
}

.home-service-box h2 a:hover,
.home-service-box h2 a:focus {
    color: #333D47;
}

.home-slider-wrapper {
    width: 100%;
    margin-bottom: 30px;
}

.slider-inner {
    overflow: hidden;
    display: block;
    background-size: cover !important;
    width: 100%;
}

.slider-desc {
    position: absolute;
    bottom: 60px;
    left: 35px;
    width: 198px;
    background: #fff;
    padding: 12px 14px 8px;
}

.slider-desc h5 {
    margin-bottom: 0px;
    text-transform: uppercase;
}

.slider-desc h5 a {
    text-decoration: none;
    color: #333D47;
}

.slider-desc h5 a:hover,
.slider-desc h5 a:focus {
    text-decoration: none;
}

.slider-desc h2 {
    margin-bottom: 0px;
}

#slide-counter {
    position: absolute;
    bottom: 89px;
    left: 80px;
    padding-top: 6px;
    width: 41px;
    background: rgba(255, 255, 255, 0.75);
    height: 25px;
    font-family: 'MuseoSans-500';
    font-size: 10px;
    color: #333D47;
    letter-spacing: 1.1px;
    text-align: center;
}

#slide-counter strong {
    font-family: 'MuseoSans-500';
    font-size: 10px;
    color: #333D47;
    letter-spacing: 1.1px;
    text-align: center;
}

#slide-counter-mob {
    position: absolute;
    bottom: 119px;
    left: 65px;
    padding-top: 6px;
    width: 41px;
    background: rgba(255, 255, 255, 0.75);
    height: 25px;
    font-family: 'MuseoSans-500';
    font-size: 10px;
    color: #333D47;
    letter-spacing: 1.1px;
    text-align: center;
}

#slide-counter-mob strong {
    font-family: 'MuseoSans-500';
    font-size: 10px;
    color: #333D47;
    letter-spacing: 1.1px;
    text-align: center;
}

#care,
#ambition,
#respect,
#discipline {
    display: none;
}

#mob-care,
#mob-ambition,
#mob-respect,
#mob-discipline {
    display: none;
}

/*********************************
    Work Page Css
*********************************/

.work-img {
    background-position: center right -150px;
    background-size: cover;
}

.work-page-slider {
    background: #333d47;
    position: relative;
    padding: 30px 0;
}

.slider-content {
    color: #fff;
    width: 446px;
    height: 100%;
    position: absolute;
    left: 60%;
    top: 0px;
    background: #333d47;
}

.slider-content h1 {
    color: #fff;
}

.owl-carousel .item h1 {
    color: #fff;
}

#sync1 .owl-item .item {
    position: relative;
}

#sync1 .owl-item .item:after {
    width: 17px;
    background: #333d47;
    content: "";
    right: 0px;
    height: 100%;
    position: absolute;
    top: 0px;
}

#sync2 {
    padding-left: 0px;
    background: #333d47;
}

.slide-popup-content {
    width: 100%;
    margin-top: 20px;
    text-align: left;
    padding: 0 30px 20px;
}

.slide-popup-content h2 {
    color: #fff;
    font-family: 'MuseoSansDisplay-Light';
}

.slide-popup-content h3 {
    color: #fff;
}

.slide-popup-content p {
    color: #fff;
    font-family: 'MuseoSans-300';
    font-size: 12px;
    line-height: 18px;
}

#sync2 .owl-stage-outer {
    height: 100%;
    width: 99%;
}

#sync2 .owl-stage {
    height: 100%;
}

#sync2 .owl-item {
    height: 100%;
}

.work-page-slider .owl-theme .owl-nav {
    margin-top: 0;
}

.work-page-slider .owl-theme .owl-nav button {
    outline: none;
    border: 2px solid #fff !important;
    position: absolute;
    border-radius: 50%;
    height: 29px;
    width: 29px;
    top: 50%;
    margin: -14.5px 0 0;
    padding: 0px;
}

.work-page-slider .owl-theme .owl-nav button span {
    font-size: 20px;
    color: #fff;
    line-height: 23px;
}

.work-page-slider .owl-theme .owl-nav .owl-prev {
    left: 30px;
    display: none;
}

.work-page-slider .owl-theme .owl-nav .owl-next {
    right: 5px;
}

.work-page-slider .owl-theme .owl-nav button:hover {
    border: 2px solid #E2231A !important;
    background: #E2231A;
}

/*********************************
Key Performance Indicator Page Css
*********************************/

.our-key-performance {
    background: #333D47;
    padding: 50px 0 60px;
}

.our-key-performance h1,
.our-key-performance p {
    color: #fff;
}

.key-performance-table {
    margin-top: 80px;
}

.key-performance-table .table thead th {
    color: #fff;
    text-transform: uppercase;
    font-family: 'MuseoSans-500';
    font-size: 10px;
    color: #FFFFFF;
    letter-spacing: 1.1px;
    padding: 0px 15px;
    border-bottom: 1px solid #fff;
}

.key-performance-table .table thead th.th-stragetic {
    width: 21%;
    padding-left: 0px;
}

.key-performance-table .table thead th.th-measure-kpi {
    width: 26%;
}
.key-performance-table .table thead th span{
    text-transform: lowercase;
}
.key-performance-heading h5 span{
    text-transform: lowercase;
}
.key-performance-table .table thead th.th-year-performance {
    width: 8%;
}

.key-performance-table .table thead th {
    color: #fff;
    text-transform: uppercase;
    font-family: 'MuseoSans-500';
    font-size: 10px;
    color: #FFFFFF;
    letter-spacing: 1.1px;
    padding: 0px 15px;
    border-bottom: 1px solid #fff;
}

.key-performance-table .table tbody td {
    border: none;
    padding: 10px 15px;
    vertical-align: top;
}



.key-performance-table .table tbody td.td-stragetic {
    width: 21%;
    padding-left: 0px;
}

.key-performance-table .table tbody td.td-measure-kpi {
    width: 26%;
}

.key-performance-table .table tbody td.td-year-performance {
    width: 8%;
}

.table tbody td.td-stragetic h2 {
    color: #fff;
}

.table tbody td.td-measure-kpi h3 {
    color: #fff;
}

.table tbody td.td-measure-kpi p {
    color: #fff;
}

.table tbody td.td-year-performance h2 {
    color: rgba(255, 255, 255, 0.50);
    margin-bottom: 2px;
}

.table tbody td.td-year-performance h3 {
    color: rgba(255, 255, 255, 0.50);
    margin-bottom: 0px;
}

.table tbody td.year-last h2,
.table tbody td.year-last h3 {
    color: #fff;
}

.new-promoter-score {
    background: #24303b;
    padding: 50px 0 100px;
}

.new-promoter-score h2 {
    color: #fff;
    margin-bottom: 50px;
}

.new-promoter-score p {
    color: #fff;
}

.strategic-table {
    display: inline-block;
    margin: 40px 0;
    width: 100%;
}

.strategic-table .table-responsive {
    border: none;
}

.strategic-table .table thead tr th {
    padding-bottom: 2px;
    color: #fff;
    width: 70%;
    border-bottom: 1px solid #fff;
    font-size: 10px;
    font-family: 'MuseoSans-500';
    text-transform: uppercase;
    text-align: center;
}

.strategic-table .table thead tr th:first-child {
    padding-left: 0px;
    text-align: left;
    width: 30%;
}

.strategic-table .table tbody tr td {
    border: none;
    width: 50%;
    font-family: 'MuseoSans-100';
    font-size: 14px;
    color: #FFF;
    padding: 10px 8px 0;
    text-align: center;
}

.strategic-table .table tbody tr td:first-child {
    padding-left: 0px;
    text-align: left;
}

.customer-experience {
    background: #24303b;
    padding: 0 0 140px;
}

.customer-experience h2 {
    color: #fff;
}

.customer-feedback-box {
    margin-top: 50px;
}

.customer-feedback-box h3 {
    color: rgba(255, 255, 255, 0.50);
}

.customer-feedback-box .counter {
    line-height: 1;
    font-family: 'MuseoSansDisplay-Light';
    font-size: 100px;
    color: #FFFFFF;
    letter-spacing: -3px;
}

.key-performance-box {
    margin-bottom: 140px;
}

.key-performance-listing .key-performance-box:last-child {
    margin-bottom: 0px;
}

.key-performance-heading {
    border-bottom: 1px solid #fff;
    margin-bottom: 10px;
}

.key-performance-heading h5 {
    display: inline-block;
    margin: 0;
    padding: 0;
    color: #fff;
    text-transform: uppercase;
}

.key-performance-body {
    margin-bottom: 15px;
}

.key-performance-body h2,
.key-performance-body h3,
.key-performance-body p {
    color: #fff;
}

.key-performance-heading.year-heading h5 {
    width: 33.33%;
    margin-right: -4px;
}

.key-performance-body.year-body .performance-year {
    width: 33.33%;
    display: inline-block;
    margin-right: -4px;
}

.performance-year h2 {
    color: rgba(255, 255, 255, 0.50);
    margin-bottom: 2px;
}

.performance-year h3 {
    color: rgba(255, 255, 255, 0.50);
    margin-bottom: 0px;
}

.key-performance-body.year-body .performance-year:last-child h2 {
    color: #fff;
}

.key-performance-body.year-body .performance-year:last-child h3 {
    color: #fff;
}

/*********************************
    Board Of Directors Css
*********************************/

.profile-list {
    margin-bottom: 50px;
    cursor: pointer;
    text-align: left;
    display: inline-block;
}

.profile-list figure {
    position: relative;
}

.profile-list figure img {
    position: relative;
    z-index: 11;
}

.profile-list figure:before {
    position: absolute;
    height: 100%;
    background-color: red;
    width: 10px;
    transition: 0.2s all ease-in;
    left: 0px;
    content: ' ';
}

.profile-list:hover figure:before {
    left: -10px;
    transition: 0.2s all ease-in;
}

.profile-list h2 {
    margin-top: 20px;
    margin-bottom: 5px;
}

.profile-list p {
    line-height: 16px;
    opacity: 0.5;
}

.modal-content .profile-list figure:before {
    left: -15px;
}

.modal-content .profile-list img {
    width: 100%;
}

/*********************************
    Strategic pillar Page Css
*********************************/

.sticky-item {
    position: relative;
}

.sticky-item::before {
    content: '';
    position: absolute;
    left: 0px;
    top: 0;
    background: -moz-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ff3.6+ */
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(191, 53, 40, 1)), color-stop(100%, rgba(226, 35, 26, 1)));
    /*safari4+,chrome */
    background: -webkit-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /*safari5.1+,chrome10+ */
    background: -o-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* opera 11.10+ */
    background: -ms-linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ie10+ */
    background: linear-gradient(45deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2231A', endColorstr='#BF3528', GradientType=1);
    /* ie6-9 */
    width: 5px;
    height: 80px;
}

/*********************************
    Board RoundTable Css
*********************************/

.roundtable-profile-list-block .profile-list figure:before {
    width: 0;
}

.chapter-title h2 {
    font-size: 35px;
    letter-spacing: 0.28px;
    line-height: 38px;
    color: #E2231A;
}

.chapter-title h4 {
    font-style: italic;
    color: #E2231A;
}

.banner-block {
    position: relative;
    margin-left: -15px;
    margin-right: -15px;
}

.banner-block .banner-content {
    position: absolute;
    top: 70px;
    right: 0;
    left: 0;
}

.banner-block .banner-content .top-blockquote {
    padding-right: 15px;
}

/*********************************
Sustainability Page Css
*********************************/

.sustain-block {
    padding-top: 37px;
    padding-bottom: 60px;
}

.section-block {
    padding-top: 100px;
}

.icon {
    display: inline-block;
    margin-bottom: 10px;
}

.icon img {
    transform: translate(-52%, 0);
}

.partnership-block .icon img {
    transform: translate(-8%, 0);
}

.partnership-block .large-title small{font-size: 22px; font-family: inherit; letter-spacing: 0; font-family: 'MuseoSans-100';}

.sustain-arrow {
    display: none;
    background: url('../images/icons/arrow-subs.png') no-repeat left top;
    right: 36px;
    top: 120px;
    width: 39px;
    height: 39px;
    z-index: 9999;
    position: fixed
}

.sustain-arrow.active {
    background-position: left bottom;
}

.sustain-menu {
    display: none;
    top: 0px;
    z-index: 999;
    width: 211px;
    position: fixed;
    right: 0px;
    background: #ba1419;
    height: 100%;
    -webkit-transition: 0.3s ease-in all;
    -moz-transition: 0.3s ease-in all;
    -ms-transition: 0.3s ease-in all;
    -o-transition: 0.3s ease-in all;
    transition: 0.3s ease-in all;
}

.sustain-menu.slide-right {
    right: -211px;
}

.sustain-menu ul {
    margin-top: 220px;
    position: relative;
    margin-left: 10px;
    padding-left: 20px;
    padding-right: 50px;
    height: auto;
    max-height: 550px;
}

.sustain-menu ul .mCSB_outside + .mCSB_scrollTools {
    right: 0 !important;
}

.sustain-menu ul:after {
    height: 100%;
    content: "";
    width: 2px;
    background: rgba(195, 52, 39, 1);
    background: -moz-linear-gradient(left, rgba(195, 52, 39, 1) 0%, rgba(241, 111, 92, 1) 0%, rgba(246, 41, 12, 1) 0%, rgba(213, 43, 31, 1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(195, 52, 39, 1)), color-stop(0%, rgba(241, 111, 92, 1)), color-stop(0%, rgba(246, 41, 12, 1)), color-stop(100%, rgba(213, 43, 31, 1)));
    background: -webkit-linear-gradient(left, rgba(195, 52, 39, 1) 0%, rgba(241, 111, 92, 1) 0%, rgba(246, 41, 12, 1) 0%, rgba(213, 43, 31, 1) 100%);
    background: -o-linear-gradient(left, rgba(195, 52, 39, 1) 0%, rgba(241, 111, 92, 1) 0%, rgba(246, 41, 12, 1) 0%, rgba(213, 43, 31, 1) 100%);
    background: -ms-linear-gradient(left, rgba(195, 52, 39, 1) 0%, rgba(241, 111, 92, 1) 0%, rgba(246, 41, 12, 1) 0%, rgba(213, 43, 31, 1) 100%);
    background: linear-gradient(to right, rgba(195, 52, 39, 1) 0%, rgba(241, 111, 92, 1) 0%, rgba(246, 41, 12, 1) 0%, rgba(213, 43, 31, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c33427', endColorstr='#d52b1f', GradientType=1);
    position: absolute;
    left: 0px;
    z-index: 1;
    top: 0px;
}

.sustain-menu ul li {
    margin-bottom: 20px;
}

.sustain-menu ul li:last-child {
    margin-bottom: 0;
}

.sustain-menu ul li a {
    color: rgba(255, 255, 255, 0.6);
    font-size: 14px;
}

.sustain-menu ul li a span {
    display: block;
    line-height: 22px;
}

.sustain-menu ul li a:hover,
.sustain-menu ul li a:focus {
    color: #fff;
}

.sustain-menu ul li a.active {
    color: #fff;
}

.sustain-mob-dropdown {
    background: rgba(222, 33, 26, 1);
    background: -moz-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(222, 33, 26, 1)), color-stop(100%, rgba(191, 22, 25, 1)));
    background: -webkit-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: -o-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: -ms-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: linear-gradient(to right, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#de211a', endColorstr='#bf1619', GradientType=1);
    padding: 10px 0px;
    position: fixed;
    top: 72px;
    left: 0;
    right: 0;
    z-index: 999;

}

.sustain-mob-dropdown .bootstrap-select {
    padding-left: 10px;
    padding-right: 10px;
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.6);
    box-shadow: none;
    width: 100% !important;
}

.sustain-mob-dropdown .btn {
    background: none;
    border: none;
    font-size: 18px;
    color: rgba(255, 255, 255, 0.6);
    box-shadow: none;
    border-radius: 0px;
}

.sustain-mob-dropdown .btn:focus {
    outline: none;
    outline-offset: 0px;
    background: none;
    border: none;
    color: #fff;
    box-shadow: none;
}

.sustain-mob-dropdown .btn.active:focus,
.sustain-mob-dropdown .btn.active:hover {
    outline: none;
    outline-offset: 0px;
    background: none;
    border: none;
    color: #fff;
    box-shadow: none;
}

.sustain-mob-dropdown .btn-group.open .dropdown-toggle {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.6);
    box-shadow: none;
}

.sustain-mob-dropdown .btn-group .dropdown-toggle:active,
.sustain-mob-dropdown .btn-group.open .dropdown-toggle {
    background: none;
    border: none;
    color: #fff;
    box-shadow: none;
}

.sustain-mob-dropdown .bootstrap-select .dropdown-toggle:focus {
    outline: inherit !important;
    outline-offset: inherit;
}

#quality-education,
#health-well-being,
#gender-equality,
#industry-innovation,
#climate-action,
#partnership {
    display: none;
}

.sustain-mob-dropdown .dropdown-menu {
    background: rgba(222, 33, 26, 1);
    background: -moz-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(222, 33, 26, 1)), color-stop(100%, rgba(191, 22, 25, 1)));
    background: -webkit-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: -o-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: -ms-linear-gradient(left, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    background: linear-gradient(to right, rgba(222, 33, 26, 1) 0%, rgba(191, 22, 25, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#de211a', endColorstr='#bf1619', GradientType=1);
    border: none;
    box-shadow: none;
    border-radius: 0px;
}

.sustain-mob-dropdown .dropdown-menu li a {
    background: none !important;
    font-size: 18px;
    color: rgba(255, 255, 255, 0.6);
    padding: 15px 15px 15px 23px;
    white-space: normal;
}

.sustain-mob-dropdown .dropdown-menu li.selected a,
.sustain-mob-dropdown .dropdown-menu li a:focus,
.sustain-mob-dropdown .dropdown-menu li.selected a:focus {
    background: none;
    color: #fff;
}

.sustain-mob-dropdown .bootstrap-select.btn-group .dropdown-toggle .caret {
    border: none;
    top: 7px;
    right: 40px;
    font-family: 'FontAwesome';
    font-size: 26px;
    line-height: 1;
}

.sustain-mob-dropdown .bootstrap-select.btn-group .dropdown-toggle .caret:before {
    content: "\f107";
}

.sustain-mob-dropdown .bootstrap-select.btn-group .dropdown-toggle .filter-option {
    max-width: 230px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*********************************
Risk Management Page Css
*********************************/

.risk-management-principal-risks h2 {
    margin-bottom: 20px;
}

.risk-management-heading-content h2 {
    font-size: 22px;
    line-height: 29px;
    font-family: 'MuseoSans-100';
    letter-spacing: 0px;
}

.counter-list li {
    display: block;
    margin-right: 60px;
}

.chapter-section {
    margin-bottom: 60px;
}

.chapter-section .chapter-section-title {
    position: relative;
    padding-bottom: 6px;
    margin-bottom: 30px;
}

.chapter-section .chapter-section-title:before {
    position: absolute;
    content: '';
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    width: 100%;
    background: -moz-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ff3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(226, 35, 26, 1)), color-stop(100%, rgba(191, 53, 40, 1)));
    /* safari4+,chrome */
    background: -webkit-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* safari5.1+,chrome10+ */
    background: -o-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* opera 11.10+ */
    background: -ms-linear-gradient(90deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* ie10+ */
    background: linear-gradient(0deg, rgba(191, 53, 40, 1) 0%, rgba(226, 35, 26, 1) 100%);
    /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2231A', endColorstr='#BF3528', GradientType=0);
    /* ie6-9 */
}

.chapter-section p {
    margin-bottom: 20px;
}

.page-progressbar-container {
    left: 0;
    width: 100%;
    height: 0.4em;
    margin-bottom: 0px;
    position: fixed;
    top: 67px;
    overflow: hidden;
    content: "";
    display: table;
    table-layout: fixed;
    z-index: 999;
}

.page-progressbar-container.page-progressbar-top {
    background-color: #fff;
}

.page-progressbar {
    width: 0%;
    float: left;
    height: 100%;
    z-index: 99;
    max-width: 100%;
    background: rgb(51, 61, 71);
    background: -webkit-linear-gradient(-157deg, rgba(51, 61, 71, 1) 0%, rgba(34, 48, 59, 0.25) 93%);
    background: -o-linear-gradient(-157deg, rgba(51, 61, 71, 1) 0%, rgba(34, 48, 59, 0.25) 93%);
    background: linear-gradient(-247deg, rgba(51, 61, 71, 1) 0%, rgba(34, 48, 59, 0.25) 93%);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}

#emerging-risks,
#principal-risks {
    display: none;
}

/*********************************
    Business Review Page Css
*********************************/

#consumer-banking-group,
#wholesale-banking-group,
#treasury-investments-group,
#business-support {
    display: none;
}

/*********************************
    awards Page Css
*********************************/

.awards h1,
.awards h2,
.awards p {
    color: #FFFFFF !important;
    opacity: 1;
}

.awards h2 {
    font-size: 18px;
    line-height: 27px;
    letter-spacing: 0px;
}

.awards p {
    font-size: 12px;
    text-transform: uppercase;
    font-family: 'MuseoSans-500';
    letter-spacing: 0.2px;
    line-height: 16px;
    opacity: 0.5;
}

/*********************************
    Corparate Governance Page Css
*********************************/

.agenda-item-list h6 {
    position: relative;
    font-family: 'MuseoSans-300';
    font-size: 12px;
    margin-bottom: 15px;
    letter-spacing: 0px;
    line-height: 18px;
}

.agenda-item-list h6:before {
    content: '';
    position: absolute;
    background-color: #000;
    width: 7px;
    height: 1px;
    left: -11px;
    top: 8px;
}

.agenda-item-head {
    position: relative;
}

.agenda-item-head:after {
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #E2231A;
    top: 16px;
}

.share-holding-table .row > div {
    padding-left: 15px;
    padding-right: 5px;
}

.share-holding-table .row > div h3 {
    margin-bottom: 20px;
}

.management-committee-table .row-spacing {
    margin-bottom: 20px;
}

.management-committee-table h2 {
    font-size: 16px;
    font-family: 'MuseoSans-300';
    text-transform: uppercase;
    border-bottom: 2px solid #E2231A;
}

.management-committee-border-table {
    border-bottom: 1px solid #E2231A;
    margin-bottom: 15px;
}

.fixed-pay,
.variable-pay {
    border-top: 2px solid #E2231A;
    padding-bottom: 50px;
}

.retention-scheme {
    border-top: 2px solid #E2231A;
}

.fixed-pay h2,
.variable-pay h2,
.retention-scheme h2 {
    font-size: 22px;
    color: #E2231A;
    font-family: 'MuseoSans-100';
    margin-bottom: 20px;
}

.directors-share-holding ul {
    list-style: none;
}

.directors-share-holding ul li {
    position: relative;
}

.directors-share-holding ul li:after {
    content: '';
    position: absolute;
    background-color: #000;
    width: 7px;
    height: 1px;
    left: -15px;
    top: 9px;
}

.committee-message ul {
    list-style: none;
}

.committee-message ul li {
    position: relative;
}

.committee-message ul li:after {
    content: '';
    position: absolute;
    background-color: #000;
    width: 7px;
    height: 1px;
    left: -15px;
    top: 9px;
}

.fixed-pay h5,
.variable-pay h5,
.retention-scheme h5 {
    text-transform: uppercase;
}

.fixed-pay ul,
.variable-pay ul,
.retention-scheme ul {
    list-style: none;
    padding-left: 20px;
}

.fixed-pay ul li,
.variable-pay ul li,
.retention-scheme ul li {
    position: relative;
}

.fixed-pay ul li:after,
.variable-pay ul li:after,
.retention-scheme ul li:after {
    content: '';
    position: absolute;
    background-color: #000;
    width: 7px;
    height: 1px;
    left: -15px;
    top: 9px;
}

.variable-pay-framework-table {
    border-top: 2px solid #E2231A;
    border-bottom: 2px solid #E2231A;
    padding-top: 10px;
}

#the-board,
#the-board-agenda,
#other-practices,
#audit-compliance-committee,
#corporate-governance-committee,
#hr-committee,
#risk-credit-committee,
#adcb-director {
    display: none;
}

.committee-message .callouts-list li:after {
    height: 0;
    width: 0;
}

.callouts-list {
    margin: 0;
}

.callouts-list li {
    display: block;
    width: 100%;
    vertical-align: top;
    margin-bottom: 20px;
}

.callouts-list li:last-child {
    margin-bottom: 0;
}

/*********************************
    Financial Overview Page Css
*********************************/

.financial-overview-table .table {
    margin-bottom: 0;
}

.financial-overview-table .table tr th,
.financial-overview-table .table tr td {
    border: none;
}

.financial-overview-table .table tr td,
.financial-overview-table .table tr th {
    background-color: rgba(51, 61, 71, 0.05);
}

.financial-overview-table .table tr:first-child th {
    background-color: transparent;
}

.financial-overview-table .table tr th:first-child,
.financial-overview-table .table tr td:first-child {
    background-color: transparent;
    text-align: left;
    padding-left: 0;
}


.financial-overview-table .table tr th {
    color: #E2231A;
    
    padding: 15px 15px 5px;
    font-family: 'MuseoSans-500';
    font-size: 10px;
    letter-spacing: 1.1px;
    text-align: center;
}

.financial-overview-table .table tr th.text-right {
    text-align: right;
}

.financial-overview-table .table tr td {
    text-align: center;
    padding: 10px;
}

.financial-overview-table .table tr td:nth-child(5),
.financial-overview-table .table tr th:nth-child(5) {
    background-color: transparent;
}

.background-none {
    background-color: transparent !important;
}

.red-border-bottom {
    border-bottom: 1px solid #E2231A !important;
}

.financial-overview-mbl-table {
    position: relative;
    cursor: pointer;
}

.financial-overview-mbl-table-overlay {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    width: 100%;
}

.financial-overview-mbl-table-overlay p {
    color: #fff;
    text-align: center;
    top: 50%;
    position: relative;
    margin-top: -11px;
    margin-bottom: 0;
}

.enlarge-image-modal .modal-dialog {
    margin: 0;
}

.enlarge-image-modal .modal-body {
    padding-bottom: 50px;
}

.enlarge-image-container {
    width: 100%;
    overflow-x: auto;
    padding: 10px;
}

/*********************************
    Key Financial Highlights Page Css
*********************************/

.chart-container {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
}

.embed-responsive-16by9 {
    padding-bottom: 38%;
}