@media screen {

/*=RESET STYLES
---------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0;padding:0;border:0;font-size:100%;font:inherit;}

/*=HTML5 DISPLAY-ROLE RESET
---------------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content: none;}
table {/*border-collapse:collapse;*/border-spacing:0;}
table td{ line-height:1.3}
/*=FONTS
--------*/
@font-face {
    font-family: '../frutigerlight';
    src: url('../frutiger_45_light-webfont.eot');
    src: url('../frutiger_45_light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../frutiger_45_light-webfont.woff2') format('woff2'),
         url('../frutiger_45_light-webfont.woff') format('woff'),
         url('../frutiger_45_light-webfont.ttf') format('truetype'),
         url('../frutiger_45_light-webfont.svg#frutigerlight') format('svg');
    font-weight: normal;
    font-style: normal;

}


/*=PAGE STRUCTURE
-----------------*/
body {font-family: 'Lato', sans-serif,'frutigerlight', Arial, Helvetica, sans-serif;color:#636363;font-size:100%;}
#wrap {margin:0 auto;max-width:1280px;position:relative; min-width: 1280px;/*box-shadow: 0px 0px 8px 3px rgba(30, 30, 30, 0.5)*/}
#utility {padding:0; margin:0;}
#logo-print {display:none}
header[role="banner"] {width:1280px;background:#fff;position:relative;margin:0 auto;height: 144px;}
header[role="banner"] .toplinks {height:40px; background:#EAEBEF; color:#25325A; border-bottom:1px solid #24AAD9}
header[role="banner"] .toplinks p {color:#25325A; font-weight:600; padding:12px 20px 12px 20px; float:left;}
header[role="banner"] .toplinks span{float:left;margin:0 .5em;padding: 12px 0px 12px 0px;}
header[role="banner"] .toplinks ul li i:after {content:'\e602';font-family:'Linearicons';position: relative;left: 0;bottom: 0px;font-size: 15px;}
header[role="banner"] .toplinks ul li {float:left;padding: 12px 7px 12px 7px;}
header[role="banner"] .toplinks a:link, header[role="banner"] .toplinks a:visited {color: #25325A;text-decoration:none;padding: .5em;}
header[role="banner"] .toplinks a:hover {color: #fff;text-decoration:none;padding: .7em 8px;background: -moz-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* ff3.6+ */
background: -webkit-gradient(linear, left bottom, right top, color-stop(21%, #1A1661), color-stop(85%, #046C7A), color-stop(95%, #017A7E), color-stop(99%, #008080)); /* safari4+,chrome */
background: -webkit-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* safari5.1+,chrome10+ */
background: -o-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* opera 11.10+ */
background: -ms-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* ie10+ */
background: linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* w3c */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008080', endColorstr='#1A1661',GradientType=1 ); /* ie6-9 */transition:all 0.3s ease;}
header[role="banner"] .toplinks ul li.active {background: -moz-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* ff3.6+ */
background: -webkit-gradient(linear, left bottom, right top, color-stop(21%, #1A1661), color-stop(85%, #046C7A), color-stop(95%, #017A7E), color-stop(99%, #008080)); /* safari4+,chrome */
background: -webkit-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* safari5.1+,chrome10+ */
background: -o-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* opera 11.10+ */
background: -ms-linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* ie10+ */
background: linear-gradient(45deg, #1A1661 21%, #046C7A 85%, #017A7E 95%, #008080 99%); /* w3c */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008080', endColorstr='#1A1661',GradientType=1 ); color:#fff !important}
header[role="banner"] .toplinks ul li.active a { color:#fff;}
.reports-select{     
width: 163px;
background: #182750;
display: none;
position: absolute;
right: 269px;
top: 144px;
z-index: 999999;
border-top: 2px solid #fff; }


.reports-select li{ font-size:14px; padding:10px; color:#fff; position:relative;}
.reports-select li:after{ content:''; width:0%; border-bottom:1px solid #fff; position:absolute; bottom:0; left:0; }
.reports-select li:hover:after{  content:''; width:100%; border-bottom:1px solid #fff; position:absolute; bottom:0; left:0; transition:width 0.5s linear }
.reports-select li:hover{ color:#24AAD9;}
.reports-select a{ text-decoration:none;}




h3 i.icon-book2{ float:right; font-size:70px}
.report-select{ margin-top:40px;}
.report-select li{width:calc(50% - 64px); padding:15px; margin-left:15px; margin-right:15px; float:left; border:2px solid #182750; margin-bottom:10px; color:#172751; position:relative }

.report-select a{ float:right; text-decoration:none; font-size:25px; padding-right:10px; position:relative;    line-height: 1; z-index:999999;}
.report-select a:hover{ color:#fff; transition:color linear 0.3s}

h2.closed:after{ position:absolute; content:''; width:8px; height:8px; border-left:1px solid #fff; border-top:1px solid #fff;transform: rotate(225deg);     left: 179px;  top: 28px;}
h2.open:after{ position:absolute; content:''; width:8px; height:8px; border-right:1px solid #fff; border-bottom:1px solid #fff;transform: rotate(225deg);     left: 179px;  top: 34px;}
h2{ position:relative;}
h2:before{ position:absolute; content:'Reports';left: 103px;  top: 21px; font-family: 'Lato', sans-serif,'frutigerlight', Arial, Helvetica, sans-serif; font-size:18px; color:#fff;}
h2{ position:relative;}


.report-select li:after{ border-bottom:1px solid #fff; width:0px; height:0px; border-left:1px solid #fff; content:''; position:absolute; bottom:-2px; left:-2px;}

.report-select li:before{ border-top:1px solid #fff; width:0px; height:0px; border-right:1px solid #fff; content:''; position:absolute; top:-2px; right:-2px;}

.report-select li:hover:after{ border-bottom:2px solid #fff; width:321.19px; height:59px; border-left:2px solid #fff; content:''; position:absolute; bottom:-2px; left:-2px; transition:width linear 0.7s, height linear 0.7s}

.report-select li:hover:before{ border-top:2px solid #fff; width:321.19px; height:59px; border-right:2px solid #fff; content:''; position:absolute; top:-2px; right:-2px; transition:width linear 0.7s, height linear 0.7s}

header[role="banner"] .header-logo {width:100%; color:#fff; float:none; clear:both;}

#container {width:100%;}
main#container #gutter-frame {background:#fff;padding:1.25em; /*min-width: 1280px;*/}
main#container #gutter-frames {background:transparent;padding:1.25em;}
main#container #gutter-frame-home {background:#fff;padding:0; margin-top: -10px;}
footer[role="contentinfo"] {clear:both;}
.group:after {visibility:hidden;display:block;content:"";clear:both;height:0;}
* html .group {zoom:1;} /* IE6 */
*:first-child+html .group {zoom:1;} /* IE7 */
.clear {clear:both;overflow:hidden;width:0;height:0;}
.move {position:absolute;left:-9999px;}
.clear-lft {clear:left}
.rgt {float:right; padding-left:10px; padding-bottom:15px;}
.lft {float:left;padding-right:10px; padding-bottom:15px;}
.obj-c {margin-left:auto;margin-right:auto;display:block;text-align:center}
i { font-style: italic; }	
header i {
     font-style: normal; 
}

/*=TYPOGRAPHY
-------------*/
h1,h2,h3,h4,h5,h6 {font-family: 'Lato', sans-serif,'frutigerlight', Arial, Helvetica, sans-serif;font-weight:normal; line-height:25px;}
h3 {font-size:1.8em;margin-bottom:.5em;}
h4 {font-size:1.125em;font-weight:bold; color:#172751; }
h5 {font-size: 1em;}
h6 {font-size:.925em;color: #005596;margin-bottom:.5em;/* background:#005596; */display: block;padding: .5em 0 .0em 0em;text-transform: uppercase;}
sup {vertical-align: super;font-size:80%}
b, strong {font-weight:600;}
em {font-style:italic;}
.no-marginB {margin-bottom:0px !important;}

/*.tsc_c3b_large.tsc_button { font-size: 14px;padding: 8px 19px 9px; background-image: url(../images/large-button-overlay.png);}
.tsc_c3b_white.tsc_button { background-color: #91C54A; border: 1px solid #CCCCCC; color: #fff !important; font-weight: normal; text-shadow: 0 1px 1px #FFFFFF;}*/



/*=NAVIGATION
------------*/

/*.menu a.one:before {content: '\e602';font-family: 'Linearicons'; speak: none;font-size: 20px;position: absolute;top: 15px;left:30px;right: 0;}*/
.menu a.one {width:84px;  position:relative;    height: 38px;}
a.menu-link {display:none;text-decoration:none;float:left;padding:1em 0 .75em 1em;}
a.menu-link i, a.menu-link b {color:#000;font-size:1.5em;}
a.menu-link b {padding-left:.5em;font-weight:normal;}
.menu {width:100%;background:#25335A;float: left; height:57px;} /*Menu bar background colour*/
.menu ul {padding:0;margin:0;list-style:none;position:relative;display:inline-table;z-index:99}
.menu > li > ul.sub-menu {min-width:10em;padding:0;}
.menu ul li {padding:0;}
.menu > ul > li {display:inline-block;}
.menu ul li a {display:block;text-decoration:none;color:#fff;font-size:.8em;line-height: 1.2;padding-left:8px;padding-right:8px;font-weight:300;} /*Menu font colour, size*/
.menu ul li:hover {background:#299FCD;color:#fff} /*Menu tab hover colour same as drop-down*/
.menu ul li > a {height: 38px;    padding: 1.5em .5em 0em;position: relative;/* bottom: 6px; */} /*Menu bar height, tab label padding*/
.menu ul ul {display:none;position:absolute;top:100%;background:#24AAD9;font-weight: 100;text-transform: none;width: 1280px;left:0px;padding: 0.5em 0 1em 0;list-style-type: disc;}
.menu ul li:hover > ul {display:block;}
.menu ul ul > div > li {position:relative; list-style:none;}
.menu ul ul > div > li:before { content:''; border-radius:50%; width:8px; height:8px; background:#fff; position:absolute;left: -18px; top: 8px; }
.menu ul ul > div > li:hover:before { content:''; border-radius:50%; width:8px; height:8px; background:#25335A; position:absolute;left: -18px; top: 8px; }
.menu ul ul > div > li:hover:after {     content: ''; border-radius: 50%;  width: 16px; height: 16px; background: transparent;  position: absolute; left: -22px; top: 3.3px; border-top: 1px solid #25335A; border-right: 1px solid #25335A; animation: rotate 1s infinite alternate;}
.menu ul ul > div > li a {padding:.25em;height:auto;background-color:#24AAD9;;} /*Sub menu background colour, padding*/
.menu ul ul > div > li a:hover {color:#000;} /*Sub menu background hover colour, font hover colour, border*/
.menu ul ul ul {position:absolute;left:100%;top:0;}
.menu ul.sub-menu {/*padding:.5em;*/} /*Target padding around sub menu*/
/*.menu a.main {border-right:1px dotted #999} Target menu bar tab labels e.g. font, uppercase*/
.menu a.main:hover {background:#33B2DB;color:#fff;text-decoration:none;} /*Menu tab hover background colour, font colour*/
body#home .menu a.one, body#two .menu a.two, body#three .menu a.three, body#four .menu a.four, body#five .menu a.five, body#six .menu a.six, body#seven .menu a.seven, body#eight .menu a.eight{background:#E2E1E1;color:#fff;font-weight:bold; text-decoration:none;} /*Menu tabs selected state depending on page or section*/
.menu a.one span:after {content:'\e602'; font-family:'Linearicons'; position:absolute;    left: 37px;
    bottom: 24px; font-size:25px;}

li.has-submenu a.main:after {content:'\f107';font-family:'fontawesome';speak: none;padding-left:5px}
 .menu-heading-block{width:calc(30% - 30px); padding:15px; float:left; margin-top:30px; text-align:center}
         .menu-block{ width:auto; padding:25px; float:left; margin-top:30px;}


}

@keyframes rotate { from {transform:rotate(0);} to {transform:rotate(360deg);} }



/*=BREADCRUMB*/
#breadcrumb {background-color:#EAEBEF;padding:.5em 0;color:#8B8D8D;clear: both;}
#breadcrumb p {font-size:.7em;padding-left:1em}
#breadcrumb a:link {color:#25335A ;}
#breadcrumb a:visited {color:#25335A ;}
#breadcrumb a:hover {color:#009ED1;}

/*=HEADER CONTENT
-----------------*/
header[role="banner"] #logo-print {display:none}
header[role="banner"] h1 {text-indent:-9999px;background:transparent url(../images/Barloworld-logo-black.png) left top no-repeat;width:280px;height: 59px;margin:1em;margin-top: 2.2em;float:left;}
header[role="banner"] h1 a {display:block;width:238px;height:56px;overflow:hidden;}
header[role="banner"] #headings h2 {font-size: 1.3em;color:#003168;text-align:center;display: inline-block;float: right;line-height:1.5;margin-top: 0em; background-image:url(../images/reporting-tool.png); background-repeat:no-repeat; height:110px;width:487px;}
header[role="banner"] #headings h3 {font-size: 1em;color:#6B6B6B;text-align:right !important;line-height:1.2;/*padding: .5em .8em 0em .8em;*/float: left;display: inline-block;/*text-transform: uppercase;*/margin-top: 3em;margin-left: 0.5em;}
header[role="banner"] #headings h3 span {font-size:15px;}

header[role="banner"] #headings h4 {font-size:.875em; color:#0067a4; text-align:center; font-weight:500; margin-bottom:10px; margin-top:-4px}


ul.tool-icons {list-style-type:none; color:#fff; right:0px; position:absolute; bottom:0px;}
ul.tool-icons  li {float:left; width:50px; position:relative; top:0px;}
ul.tool-icons a {color:#fff;}
ul.tool-icons a:hover {color:#000;}


header[role="banner"] #headings h3 {font-size: 1em;color:#6B6B6B;text-align:right !important;line-height:1.2;/*padding: .5em .8em 0em .8em;*/float: left;display: inline-block;/*text-transform: uppercase;*/margin-top: 3em;margin-left: 0.5em;}
header[role="banner"] #headings h3 span {font-size:15px;}

header[role="banner"] #headings h4 {font-size:.875em; color:#0067a4; text-align:center; font-weight:500; margin-bottom:10px; margin-top:-4px}
	
/*=TOOLBAR
----------*/
#toolbar{position:absolute;top: 67px;right:-45px;width:45px;border-left:none;background: #41B7E0;z-index: 1;}
#toolbar ul {margin-bottom:0;padding-top: 2px;padding-bottom: 2px;/*background: rgba(255, 255, 255, 0.6); border:1px solid #CA2C17; border-radius:0 10px 10px 0; border-left:none*/}
#toolbar a {display:block;padding:.25em;text-align:center;vertical-align:middle;font-size:1.5em;}
#toolbar li a:link, #toolbar li a:visited {background-color:transparent;color:#fff;text-decoration:none;}
#toolbar li a:hover {background:#8E8F92;color:#fff;}

/*=LIST
-----------*/
ul.list-dash {list-style-type:none;}
ul.list-dash li {list-style-image:url(../images/dash.png);margin-left:1.3em;}
ul.list-alpha li {list-style-type:lower-alpha;margin-left:13px; font-weight: 600;}
ul.list-alpha li ul li {list-style-type:disc; margin-left:18px;  font-weight: 400;}	

ol.number {list-style: decimal;
   margin-left: 1em;
}
/*=HOMEPAGE
-----------*/

.home-btn{ width:200px; border:1px solid #606986; color:#005298!important; padding:15px; padding-left:40px; margin:60px 0; text-decoration:none; float:left; position: relative; padding-right:40px;}
.home-btn:before{ content:''; border-radius:100%; border: 7px solid #0A5794; width:0; height:0;  position:absolute; left:10px; top:40%}
.home-btn:hover{ width:200px; border:1px solid transparent; color:#fff!important; padding:15px; padding-left:40px; margin:60px 0; text-decoration:none; float:left; position: relative; padding-right:40px; background:#0A5794;}
.home-btn:hover:before{ content:''; border-radius:100%; border: 7px solid #fff; width:0; height:0;  position:absolute; left:10px;animation: example 5s linear 1;}

@keyframes example {0%   {left:10px; top:40%;} 10%  {left:-5px; top:40%;} 20%  {left:-5px; top:0%;} 30%  {left:98%; top:0%;} 40%  {left:98%; top:80%;} 50%  {left:-5px; top:80%;} 60% {left:-5px; top:40%;} 70% {left:10px; top:40%;}}

@keyframes map {  0%   { opacity:1} 10%  { opacity:0.9} 20%  { opacity:0.8} 30%  { opacity:0.7} 40%  { opacity:0.6} 50%  { opacity:0.7} 60% { opacity:0.8} 70% { opacity:0.9} 100% { opacity:1}}

.map-hover1{display:none; position:absolute; bottom:0; left:238px }
.map-hover2{display:none; position:absolute; bottom:65px;; left:258px; }
.map-hover3{display:none; position:absolute; top:60px; right:0 }
.map-block{float:left; width:50%; background:url(images/map-under.png); position:relative; cursor:pointer; z-index:998}
.map-block1{ position: absolute;  width: 54px; height: 38px; left: 173px; bottom: 14px; z-index:999999}
.map-block2{position: absolute; width: 140px; height: 100px; left: 113px; bottom: 52px;}
.map-block3{ position: absolute; width: 300px; height: 200px; right: 0; top: 20px;}
.map-block1:hover ~ .map-hover1, .map-block2:hover ~ .map-hover2, .map-block3:hover ~ .map-hover3{display:block; }
.li-green:before{ content:''; border-radius:100%; border: 7px solid #46B57E; width:0; height:0;  position:absolute; left: 6px; top: 5px; }
.li-brown:before{ content:''; border-radius:100%; border: 7px solid #9D5A2D; width:0; height:0;  position:absolute; left: 6px; top: 5px;}
.li-orange:before{ content:''; border-radius:100%; border: 7px solid #F36F30; width:0; height:0;  position:absolute; left: 6px; top: 5px;}
.map-block ul li{position:relative; padding-left:25px;}


/*OUR YEAR IN NUMBERS*/
.grey-block-home{background:#E2E1E1; padding:15px;}
.home-lightblue{ color:#069ED3!important;}
main[role="main"] .intro-medium2{ font-size:1.9em; line-height:1; margin-bottom:16px;}
main[role="main"] .intro-medium3{ font-size:2.9em; line-height:1; margin-bottom:16px;}
main[role="main"] .intro-medium4{ font-size:3.9em; line-height:1; margin-bottom:16px;}
.year-blocks-4{ width:calc(25% - 20px); padding-right:20px; float:left;}
.bg-darkblue{background:#172752}

 .natural-half{width:37.5%; float:left;}




/*GOVERNANCE REVIEW
-------------------*/
.gov-review-blocks {background-color:#F0F0F0; padding:0 15px 15px 15px; position:relative; margin-bottom:20px;}
.gov-review-blocks:after {content:''; border-bottom:1px dotted #58585A; padding:1px; position:absolute; left:0px; bottom:-10px; width:100%; }
.gov-review-blocks table tr td {padding:10px;}
.gov-darkblue {background-color:#172752; color:#fff; border-right:1px solid #fff;}
.gov-blue {background-color:#005596; color:#fff; border-right:1px solid #fff;}
.gov-lightblue {background-color:#0D9ED3; color:#fff; }
.gov-turqoise {background-color:#00B8CC; color:#fff; border-left:1px solid #fff; }
.rem-tbl-head {background-color:#00779D; color:#fff;}
.rem-tbl {width:100%;}
.rem-tbl tr td {padding:10px;}
.rem-tbl-bg {background-color:#E7ECF5;}

/*=CREATING VALUE
------------*/
.creating-drak-blue-header {background-color:#172752; padding:10px;color:#fff}
.creating-blue-header {background-color:#00779D; padding:10px;color:#fff}
.creating-grey-block {background-color:#E2E1E1; padding:10px;}

.creating-darkgrey-customer-block {background-color:#CACAD6; padding:10px; color:#172752}
.creating-darkgrey-customer-block-nopad {background-color:#CACAD6;color:#172752}
.creating-lightgrey-customer-block {background-color:#E4E4EA; padding:10px;}

.creating-darkorange-customer-block {background-color:#FDE4D2; padding:10px; color:#F46522}
.creating-darkorange-customer-block-nopad {background-color:#FDE4D2;color:#F46522}
.creating-lightorange-customer-block {background-color:#FEF2E9; padding:10px;}

.creating-lightorange-customer-block-botrgt {background-color:#FEF2E9; padding:10px; border-bottom:1px solid #fff; border-right:1px solid #fff;}
.creating-lightorange-customer-block-bot {background-color:#FEF2E9; padding:10px; border-bottom:1px solid #fff;}

.orange-block-img {position:absolute; top:2696px; right:18px;}
.green-block-img {position:absolute; top:2791px; right:20px;}
.grey-block-img {position:absolute; bottom:-20px; right:0px;}

.creating-darkblue-customer-block {background-color:#D4E1EB; padding:10px; color:#00779D}
.creating-darkblue-customer-block-nopad {background-color:#D4E1EB;color:#00779D}
.creating-lightblue-customer-block {background-color:#E9F1F5; padding:10px;}
.creating-lightblue-customer-block-bot {background-color:#E9F1F5; padding:10px;border-bottom:2px solid #fff;}

.creating-darkgreen-customer-block {background-color:#E0EFE4; padding:10px; color:#43B175}
.creating-darkgreen-customer-block-normal {background-color:#E0EFE4; padding:10px;}
.creating-darkgreen-customer-block-nopad {background-color:#E0EFE4;color:#43B175}
.creating-lightgreen-customer-block {background-color:#F1F8F3; padding:10px;}

.creating-darkyellow-customer-block {background-color:#FCF2D9; padding:10px; color:#F4B510}
.creating-darkyellow-customer-block-nopad {background-color:#FCF2D9;color:#F4B510}
.creating-darkyellow-customer-block-bottom {background-color:#FCF2D9;padding:10px; border-bottom:2px solid #CBC9C9}
.creating-lightyellow-customer-block {background-color:#FEF9EC; padding:10px;}

.annexure-blue-text {background-color:#E7ECF5; padding:10px; color:#005596}
.annexure-blue-normal {background-color:#E7ECF5; padding:10px;}
.annexure-blue-bottom {background-color:#E7ECF5; padding:10px; border:1px solid #fff;}

.division-grey-block{ background:#E2E1E1; padding:10px; border-bottom:1px solid #CBC9C9}
.division-blue-block {background-color:#DDE3F1; padding:10px;}

/*=BLOCKS
------------*/
.block-blu {display:block; border: 1px solid #172752; padding:10px;}
.about-banner { background:url(../images/about-banner.png) no-repeat; width:100%; min-height:910px; }
.gov-banner { background:url(../images/governance-banner.png) no-repeat; width:100%; min-height:700px; }
.light-grey {background:#DDE3F1; padding:5px;}
.abt-1 { background:url(../images/abt-1.png) no-repeat; width:348px; height:90px; font-size: 1.2em;font-weight: 300}
.abt-2 {  font-size: 1.2em;font-weight: 300}
.perf { font-size: 40px !important; color:#172752; line-height:1.1 !important;}
.perf span{ font-size: 60px !important;; color:#172752; font-weight:800}
.perf i{ font-style:normal; line-height:0}
footer[role="contentinfo"] a{ color:#fff; text-decoration:none; padding-right:10px;}
.border-brown-top {border-top: 10px solid #9A5107;font-size:1.8em}
.border-green-top {border-top: 10px solid #41B076;font-size:1.8em}
.border-orange-top {border-top: 10px solid #F26522;font-size:1.8em}
.line-bottom { border-bottom:1px solid #8C8E8E; line-height:1.5}
.grey-blocks {background:url(../images/grey-blocks.png) repeat-x; padding:10px;}
.no-padding-tbl {padding:0!important;}
.block-material { background:#EEF5F9; padding:10px;}

/*RESETS*/
.no-margin{margin: 0!important;}
.no-marginT{margin-top: 0!important;}
.no-marginB{margin-bottom: 0!important;}
.no-marginL{margin-left: 0!important;}
.no-marginR{margin-right: 0!important;}

.no-padding{padding: 0!important;}
.no-paddingT{padding-top: 0!important;}
.no-paddingB{padding-bottom: 0!important;}
.no-paddingL{padding-left: 0!important;}
.no-paddingR{padding-right: 0!important;}
.no-paddingB5{padding-bottom: 5px!important;}
.no-paddingT5{padding-top: 5px!important;}

.padding-30{padding: 30px;}
.padding-40{padding: 40px 20px;}
.padding-50{padding: 50px 0px;}
.padding-30L{padding-left: 30px!important;}
.padding-30R{padding-right: 30px!important;}
.padding-30T{padding-top: 30px!important;}
.padding-30B{padding-bottom: 30px!important;}

.padding-20{padding: 20px!important;}
.padding-20L{padding-left: 20px!important;}
.padding-20R{padding-right: 20px!important;}
.padding-20T{padding-top: 20px!important;}
.padding-20B{padding-bottom: 20px!important;}

.padding-15{padding: 15px!important;}
.padding-15L{padding-left: 15px!important;}
.padding-15R{padding-right: 15px!important;}
.padding-15T{padding-top: 15px!important;}
.padding-15B{padding-bottom: 15px!important;}

.margin-30{margin: 30px!important;}
.margin-30L{margin-left: 30px!important;}
.margin-30R{margin-right: 30px!important;}
.margin-30T{margin-top: 30px!important;}
.margin-30B{margin-bottom: 30px!important;}

.margin-20{margin: 20px!important;}
.margin-20L{margin-left: 20px!important;}
.margin-20R{margin-right: 20px!important;}
.margin-20T{margin-top: 20px!important;}
.margin-20B{margin-bottom: 20px!important;}

.margin-25{margin: 25px!important;}
.margin-25L{margin-left: 25px!important;}
.margin-25R{margin-right: 25px!important;}
.margin-25T{margin-top: 25px!important;}
.margin-25B{margin-bottom: 25px!important;}

.margin-15{margin: 15px!important;}
.margin-15L{margin-left: 15px!important;}
.margin-15R{margin-right: 15px!important;}
.margin-15T{margin-top: 15px!important;}
.margin-15B{margin-bottom: 15px!important;}


.margin-5{margin: 5px!important;}
.margin-5L{margin-left: 5px!important;}
.margin-5R{margin-right: 5px!important;}
.margin-5T{margin-top: 5px!important;}
.margin-5B{margin-bottom: 5px!important;}


/*SWITCH-COLORS
-----------*/
.switch-grey { color:#8B8D8D;}
.switch-darkblue { color:#172751}


/*=BODY CONTENT
---------------*/

main[role="main"] p {font-size:.925em;margin-bottom:1em;line-height:1.4}
main[role="main"] ul, main[role="main"] ol {margin-bottom:.5em;}
main[role="main"] li {font-size:.925em;line-height:1.5;}
main[role="main"] li li, main[role="main"] li p {font-size:100%}
#container figure img {display:block;max-width:100%;height:auto !important}
main[role="main"] table ul li {font-size:100%;line-height:1.4;}
ul.list li,ol.list li {padding-bottom:.5em;line-height:1.4;margin-left: 5px;}
ul.list {margin-left:1.0em;list-style:disc;}
ul.list ul.list-circle {margin-left:1.0em;list-style:circle ; margin-bottom:-9px; margin-top:6px;}



ol.list {list-style:decimal;margin-left:2.5em}
ul.list-icons li {line-height:1.6; margin-left:.75em;}
ul.list-icons i {font-size:120%;padding-right:.5em;margin-left:-.5em}
.caption {font-size:0.875em}


/*=ICONS
--------*/
.fa-volume-up {color:#000;text-shadow: 2px 2px 2px rgba(111,111,111, 0.5)}
.fa-file-pdf-o {color:#c11e07;text-shadow: 2px 2px 2px rgba(111,111,111, 0.5)}
.fa-file-excel-o {color:#549f3a;text-shadow: 1px 1px 1px rgba(255,255,255, 0.5)}

p.bullet-icon {position:relative;vertical-align:bottom;padding-left:40px;padding-bottom:.5em}
p.bullet-icon i {}
p.bullet-icon.gri i {position:absolute;left: -7px;top: -7px;display:block;width: 41px;height: 40px;background-image:url(../images/icon-gri.gif);background-repeat:no-repeat;}
p.bullet-icon.web i {position:absolute;left: -7px;top: -12px;display:block;width: 41px;height: 40px;background-image:url(../images/icon-web.gif);background-repeat:no-repeat;}
p.bullet-icon a {font-size:120%;}
p.bullet-icon.gri a + a {padding:0 .2em;}
.gri-icon {position:relative; top: 8px;}



/*=FOOTER
---------*/
footer[role="contentinfo"] {color:#fff;margin-top: 1em;background-color: #222E5A;}
footer[role="contentinfo"] p {float:right;width:auto;font-size:.75em;padding:1.5em;margin-bottom:0}
footer[role="contentinfo"] ul.social-media {float:left;width:auto;font-size:.75em;padding:.5em;}
footer[role="contentinfo"] ul.social-media li#connect {padding-top:1em}
footer[role="contentinfo"] ul.social-media ul {float:right;width:auto}
footer[role="contentinfo"] ul.social-media ul li {float:left;text-align:center;margin:.5em;margin-top:-.5em}
footer[role="contentinfo"] ul.social-media ul li a {/*background:#3b3b3b;*/font-size:2em;padding:.1em;margin:0 auto;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;}
footer[role="contentinfo"] ul.social-media ul li.youtube a {/*background:#bb0000*/}
footer[role="contentinfo"] ul.social-media ul li.rss a {/*background:#ff7900*/}
footer[role="contentinfo"] ul.social-media ul li.twitter a {/*background:#00aced*/}
footer[role="contentinfo"] ul.social-media ul li.linkedin a {/*background:#007bb6*/}
footer[role="contentinfo"] ul.social-media ul li a:link, ul.social-media ul li a:visited {color:#fff !important}
footer[role="contentinfo"] ul.social-media ul li a:hover {/*color:#fff;background:#fff;background:-webkit-linear-gradient(#a6c8e1,#0067a6);background: -moz-linear-gradient(#a6c8e1,#0067a6);background: -ms-linear-gradient(#a6c8e1,#0067a6);background: -o-linear-gradient(#a6c8e1,#0067a6);background: linear-gradient(#a6c8e1,#0067a6);*/}
.footer-content {max-width:1280px;margin:0 auto;padding: .3em 0;font-size:14px;}
ul.footer-list {list-style-type:none; max-width:1280px; width:100%;}
ul.footer-list li:nth-child(1) {width:33.33333333333333%; float:left; color:#fff;}
ul.footer-list li:nth-child(2) {width:33.33333333333333%; float:left; color:#fff; text-align:center;margin-top: 15px;}
ul.footer-list li:nth-child(3) {width:33.33333333333333%; float:left; color:#fff; text-align:right;margin-top: 15px;}

ul.footer-icons {list-style-type:none; max-width:1200px; width:100%; margin:0 auto; text-align:center; color:#222E5A; margin-top:10px; }
ul.footer-icons li{float:left; width:190px; margin-right:10px; font-size:12px; padding:5px; margin-bottom:10px;}
ul.footer-icons li:last-child {margin-right:0px;}

/*=LINKS
--------*/
a {outline:none}
a:link {color: #25335A;}
a:visited {color: #25335A;}
a:hover {color:#009ED1;text-decoration:none;}
.fin-highlight {color:#fff;}

body#home ul.highlights a:link {color:#fff;font-size: 1em;line-height: 1.7;}
body#home ul.highlights a:visited {color:#fff;}
body#home ul.highlights a:hover {color:#000;text-decoration:none;}

/*=PAGINATION
-------------*/
main[role="main"] .pagination p {margin-bottom:0}
.pagination {background-color:#4A4D4E; border-top:1px solid #0c4689;}
.pagination-links {margin:0 auto;background-color: #009ED1;}
.pagination-links .lft, .pagination-links .rgt {position:relative;}
.pagination-links .lft {width:40%;}
.pagination-links .lft div#arrow-left, .pagination-links .rgt div#arrow-right {/*position:absolute;font-size:4em;margin-top: -14px;height: 74px;*/color:#fff; padding:15px;}
.pagination-links .lft div#arrow-left {float:left;left: 0.2em; /*padding-top: 10px;*/}

.pagination-links .rgt div#arrow-right {float:right;right:0.2em; /*padding-top: 10px;*/}
.pagination-links .lft div#arrow-left:before {content:'\e960';font-family:'Linearicons';speak: none; font-size:40px;right:-10px}
.pagination-links .rgt div#arrow-right:after {content:'\e961';font-family:'Linearicons';speak: none; font-size:40px; position:relative; top:-4px;left:-10px}
.pagination-links .rgt {text-align:right}
.pagination-links .lft:hover div#arrow-left, .pagination-links .rgt:hover div#arrow-right {-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-ms-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;}
.pagination-links .lft:hover div#arrow-left {left:-0.1em;color:#8e8f92; bottom:0px;}
.pagination-links .rgt:hover div#arrow-right {right:-0.1em;color:#8e8f92; bottom:0px;}
.pagination-links .lft p {float:left;margin-left:0em;position:relative; top:7px}
.pagination-links .rgt p {float:right;margin-right:0em;position:relative; top:7px}
.pagination-links i {font-style:normal;padding-bottom:.5em;display:block;color:#fff;border-bottom:1px solid #fff;width: 420px;}
.pagination-links b {color:#fff;font-weight: 500;font-size:1em;font-family:'Lato', sans-serif,'frutigerlight', Arial, Helvetica, sans-serif;margin-top: 0.3em;display: block;text-transform: uppercase;}
.pagination-links em {display:none}

/*back to top arrow*/
#back-to-top {position:fixed;bottom:2em;right:10%;text-decoration:none;font-size:2.4em;width:44px;height:44px;display:block;text-align:center;vertical-align:middle;border-radius:999px;color:#fff;background-color:#363636;-webkit-transition:all 0.6s ease;-moz-transition:all 0.6s ease;-ms-transition:all 0.6s ease;-o-transition:all 0.6s ease;transition:all 0.6s ease}
#back-to-top:after {content:'\f106';font-family:'fontawesome';speak: none;}
#back-to-top:hover {background:#ccc;}


/*back to top arrow*/
#back-to-top {position:fixed;bottom:2em;right:10%;text-decoration:none;font-size:2.4em;width:44px;height:44px;display:block;text-align:center;vertical-align:middle;border-radius:999px;color:#fff;background-color:#363636;-webkit-transition:all 0.6s ease;-moz-transition:all 0.6s ease;-ms-transition:all 0.6s ease;-o-transition:all 0.6s ease;transition:all 0.6s ease}
#back-to-top:after {content:'\f106';font-family:'fontawesome';speak: none;}
#back-to-top:hover {background:#ccc;}


/*=NIVI
-------------*/
main[role="main"] .intro { font-size:3.75em}
main[role="main"] .intro-large-division { font-size:4em; font-weight:900; line-height:1;}
main[role="main"] .intro-large { font-size:1.875em; font-weight:300;}
main[role="main"] .intro-medium { font-size:1.5em}
main[role="main"] .intro-small { font-size:1.25em}
main[role="main"] .intro-smaller { font-size:1.10em}
main[role="main"] .intro-large-value { font-size:1.875em;}
main[role="main"] .intro-medium-orange-line-bottom { font-size:1.5em; border-bottom:1px solid #F26522; color:#F26522;}
main[role="main"] .intro-medium-green-line-bottom { font-size:1.5em; border-bottom:1px solid #43B175; color:#43B175;}
main[role="main"] .intro-medium-blue-line-bottom { font-size:1.5em; border-bottom:1px solid #005596; color:#005596;}

/*SWITCH-COLORS
-----------*/
.switch-grey { color:#8B8D8D;}
.switch-darkblue {color:#172751}
.switch-brown {color:#9A5107}
.switch-orange {color:#F26522}
.switch-green {color:#41B076}
.switch-lighterblue {color:#009ED2}
.switch-purple { color:#573379}
.switch-blue { color:#005596}
.switch-lightblue {color:#0D9ED3}
.switch-yellow {color:#F4B510}
.switch-white {color:#fff}
.switch-darkblue-medium {color:#172751; font-size:1.125em;}




/*HOME PAGE*/
small{font-size:70%;}
.about-blocks{ width: calc(16.667% - 46px); border-right:2px solid #CBC9C9; padding: 22px; float:left; }
.text-center{ text-align:center;}
.no-border{ border:none}
.text-12 {  font-size:17px !important  }
.line-height li {  line-height:1.9 !important  }



/*=PEREFORMANCE
-----------*/
.brownblock {float:left; width:30%;  padding:10px; margin-right:5px; border-top:10px solid #9A5107;}
.greenblock {float:left; width:30%;  padding:10px;border-top:10px solid #41B076}
.orangeblock {float:left; width:30%;  padding:10px; margin-left:5px; border-top:10px solid #F26522}
.perbluetext {width:45%; margin-right:10px;padding:10px; float:left; text-align:center;}
.perbluetexts{width:45%; padding:10px; float:left; text-align:center;}



/*=CHIEF
-----------*/
.chiefblock{ background:#E1E0DF; width:20%; margin-right:20px; padding:10px; float:left}
.chiefbox {width:60%; padding:10px; float:left; border-bottom:1px solid #666666; border-top:1px solid #666666;}

/*=RISK MANAGEMENT
-----------*/
.riskblueheader { background:#172752; padding:5px; color:#FFFFFF}
.risklightblueheader { background:#00779D; padding:10px; color:#FFFFFF}
.riskgreybg { background:#E2E1E1; padding:10px; overflow: hidden;}
.risklighterbluebg { background:#EFF6FB; padding:10px; overflow: hidden;}
.riskgreybg-two { background:#E2E1E1; padding:5px; }

/*=TABLES
-----------*/
.fin-tbl tr:hover {background:#E1E0DF; color:#000;} /*TABLE ON HOVER BACKGROUND COLOUR AND TEXT COLOUR*/
 tr.no-hover:hover {color:#E1E0DF!important;} /*TABLE ON HOVER HIGHLIGHTED COLOUMN TEXT COLOUR TO REMAIN STAT*/
.fin-tbl {width:100%; margin:0 0 0 0; padding:0 0px;} /*THE COMPLETE TABLE TO BE GIVEN 100% WIDTH; O MARGINS AND O PADDING*/
.fin-tbl tr td {padding:3px 3px 3px 3px; line-height:1.3} /*EACH CELL IN TABLE TO HAVE A PADDING OF 3 AROUND CONTENT*/
.fin-tbl th {background-color:#fff; color:#005596!important; padding:3px 3px 3px 3px;  font-weight:bold; line-height:1.3;} /*THE HIGHLIGHTED COLUMN BACKGROUND COLOUR; TEXT COLOUR; PADDING AND A FONT WEIGHT IF NEEDED*/


.finthickerblue {border-bottom:5px solid #172752;}
.finthineline {border-bottom:1px solid #8B8D8D;}
.finthickline {border-bottom:2px solid #8B8D8D;}
.fintop {border-top:1px solid #8B8D8D;}
.fintopleft {border-top:1px solid #8B8D8D; border-left:1px solid #8B8D8D;}
.fintopright {border-top:1px solid #8B8D8D; border-right:1px solid #8B8D8D;}
.finbotleft {border-bottom:1px solid #8B8D8D; border-left:1px solid #8B8D8D;}
.finbotright {border-bottom:1px solid #8B8D8D; border-right:1px solid #8B8D8D;}
.finleft {border-left:1px solid #8B8D8D;}
.finright {border-right:1px solid #8B8D8D;}
.fincaption { font-size:12px;}
.leadcaption { font-size:12px;}
.finnrow { border-top:1px solid #8B8D8D; border-bottom:1px solid #8B8D8D; }
.finrowright {border-top:1px solid #8B8D8D; border-right:1px solid #8B8D8D; border-bottom:1px solid #8B8D8D; }
.finrowleft { border-bottom:1px solid #8B8D8D; border-left:1px solid #8B8D8D;border-top:1px solid #8B8D8D;}
.finheaderblue{ background:#E1E0DF; color:#005596}
.finheadergrey{ background:#E1E0DF; color:#57585B}
.noteheader {font-size: 1.1em;color: #005596;/*text-transform:uppercase*/font-weight: 600;}

.finthinwhite {border-bottom:1px solid #fff;}
.finthickleftwhite {border-left:2px solid #fff;}
.finheaderdarkblue{ background:#172752; color:#fff;}
.finheaderlightblue{ background:#00779D; color:#fff;}
.finheaderblue{ background:#2E74B5; color:#fff;}

/*GRI TABLE STYLES*/

.finheaddarkblue {background-color:#1F497D; color:#fff;}
.finheaddarkblueright {background-color:#1F497D; color:#fff; border-right:1px solid #FFFFFF;}
.finheaddarkbluebot {background-color:#1F497D; color:#fff; border-bottom:1px solid #FFFFFF;}
.finthinlineblk {border-bottom:1px solid #000;}
.finthicklineblk {border-bottom:2px solid #000;}
.fintopblk{border-top:1px solid #000;}
.fintopleftblk {border-top:1px solid #000; border-left:1px solid #000;}
.fintoprightblk {border-top:1px solid #000; border-right:1px solid #000;}
.finbotleftblk {border-bottom:1px solid #000; border-left:1px solid #000;}
.finbotrightblk {border-bottom:1px solid #000; border-right:1px solid #000;}
.finbotleftrightblk {border-bottom:1px solid #000; border-left:1px solid #000; border-right:1px solid #000;}
.finleftblk {border-left:1px solid #000;}
.finrightblk {border-right:1px solid #000;}
.finrowleftblk {border-left:1px solid #000; border-bottom:1px solid #000; border-top:1px solid #000;}
.finrowrightblk {border-right:1px solid #000; border-bottom:1px solid #000; border-top:1px solid #000;}
.finrowblk {border-bottom:1px solid #000; border-top:1px solid #000;}
.finrowbotblk {border-bottom:1px solid #000; border-left:1px solid #000; border-right:1px solid #000;}

.finheaddarkbluebotleft {background-color:#1F497D; color:#fff; border-bottom:1px solid #fff; border-left:1px solid #fff;}
.finheaddarkbluerowleft {background-color:#1F497D; color:#fff; border-bottom:1px solid #fff; border-top:1px solid #fff; border-left:1px solid #fff;}

.finlightbluerowleft {background-color:#DEEAF6; border-bottom:1px solid #000; border-top:1px solid #000; border-left:1px solid #000;}
.finlightbluebotleft {background-color:#DEEAF6; border-bottom:1px solid #000; border-left:1px solid #000;}
.fingreybotleft {background-color:#D9D9D9; border-bottom:1px solid #000; border-left:1px solid #000;}
.finbotleftrightblk {border-left:1px solid #000; border-right:1px solid #000; border-bottom:1px solid #000;}






/*GRI LIST*/
ol.alpha li{list-style-type:lower-alpha; margin-left:1em;color:#005596; font-weight:600; }

ol.alpha li ul li {list-style-type:disc; margin-left:0em; font-weight:400;}

.blueback-border {background:#DBE5F1; border:1px solid #000; padding:10px}