@font-face {
	font-family: 'Telkom123 Regular';
	src: url("../fonts/Telkom123-Regular.eot");
	src: url("../fonts/Telkom123-Regular.eot") format("embedded-opentype"), url("../fonts/Telkom123-Regular.woff") format("woff"), url("../fonts/Telkom123-Regular.ttf") format("opentype"), url("../fonts/Telkom123-Regular.svg") format("svg");
}




.intro {
	font-family: 'Telkom123 Light', 'Calibri', Arial, Helvetica, sans-serif;
	color: #005892;
	font-size: 21px;
	margin: 0;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 20px;
	text-align: left
}

.intro-med {
	font-family: 'Telkom123 Light', 'Calibri', Arial, Helvetica, sans-serif;
	color: #48C7EC;
	font-size: 19px;
	margin: 0;
	font-weight: 600;
	line-height: 1.4;
	margin-bottom: 20px;
}

.intro-sml {
	font-family: 'Telkom123 Light', sans-serif;
	color: #007ABD;
	font-size: 18px;
	margin: 0;
	font-weight: 500;
	line-height: 1.4;
	margin-bottom: 20px;
}

.intro-med-light-grey {
	font-family: 'Telkom123 Light', 'Calibri', Arial, Helvetica, sans-serif;
	color: #58585A;
	font-size: 20px;
	margin: 0;
	font-weight: 600;
	line-height: 1.4;
	margin-bottom: 20px;
}

.regular-bold {
	font-family: 'Telkom123 Regular', 'Calibri', Arial, Helvetica, sans-serif;
	font-weight: 600;
}

.telkom-light {
	font-family: 'Telkom123 Light', 'Calibri', Arial, Helvetica, sans-serif !important;
}

.telkom-regular {
	font-family: "Telkom123 Regular Italic ", Arial, Helvetica, sans-serif !important;
}


.king-iconlft {
	position: relative
}

.king-iconlft img {
	position: absolute;
	left: -32px;
}


.capital-bkr {
	background: linear-gradient(0deg, rgba(144, 182, 208, 1) 21%, rgba(2, 89, 147, 1) 73%);
	padding: 20px;
	padding-right: 60px;
	position: relative
}

.capital-block {
	position: relative;
}

.capital-block:before {
	content: '';
	position: absolute;
	height: 100%;
	width: 30px;
	background: rgba(159, 201, 227, 0.5);
	right: 0;
	top: 0
}

.capital-bkr:before {
	content: '';
	position: absolute;
	height: 100%;
	width: 30px;
	background: rgba(159, 201, 227, 0.3);
	right: 0;
	top: 0
}

.capital-h1 {
	color: #fff;
	border-top: 5px solid #fff;
	border-bottom: 5px solid #fff;
	margin-bottom: 20px;
	padding: 30px 0;
	padding-bottom: 55px;
}

.capital-h1 h1 {
	line-height: 1
}

.bkr-lrblue {
	background: #D9EFFC;
	padding: 20px;
}

.human-grey-gradient {
	background: linear-gradient(97deg, rgba(201, 206, 210, 1) 30%, rgba(253, 254, 254, 1) 84%);
	padding: 40px 0;
	background-position: bottom left;
	background-repeat: no-repeat
}

.supporting-bkr {
	background: url("../images/pg81-img.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	padding-top: 40px
}

.leadership-talent-block {
	background: url("../images/pg78-bkr.jpg");
	background-repeat: no-repeat;
	background-size: cover
}

.white-bkr-opacity {
	background: rgba(239, 241, 242, 0.9);
	padding: 60px 30px
}

.blue-bkr-opacity {
	background: rgba(146, 195, 229, 0.9);
	padding: 40px 30px
}

.blue-bkr-opacity2 {
	background: rgba(155, 203, 236, 1);
	padding: 40px 30px
}

.blue-bkr-opacity3 {
	background: rgba(203, 233, 250, 1);
	padding: 40px 30px
}

.switch-bg-l-blue-2 {
	background: #B3DFEE
}

.switch-bg-l-blue-3 {
	background: #C7D7DD
}

.switch-bg-l-blue-4 {
	background: #DCE6EA
}

.switch-dblue {
	color: #005892 !important
}

.switch-bg-l-blue-5 {
	background: #D1DEE3
}

.switch-bg-l-blue-6 {
	background: #EAF0F3
}

.switch-bg-l-blue-7 {
	background: #BDE3F8
}

.coloum-dir {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.ips-huge-num {
	font-size: 50px;
	margin-bottom: 10px;
	font-family: 'Telkom123 bold', 'Calibri', Arial, Helvetica, sans-serif;
}

.ips-huge-num sup {
	font-size: 50%;
	top: -1.5rem;
}

.ips-huge-num sup img {
	margin-top: -8px;
	width: 24px;
}


.ips-inner-holder {
	display: flex;
	justify-content: space-between;
	height: 100%;
}

.ips-inner-left {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 60%;
}

.ips-inner-left p {
	text-align: left;
	color: #575656;
}

.growth-arrow {
	position: relative;
	    margin-right: 100px;
}

.growth-arrow span {
	text-align: center;
	display: block;
}

.growth-arrow img {
	height: 90px;
}

.down-arr {
	-webkit-animation: slide-in-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-in-top 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.up-arr {
	-webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}



.list ul {
	margin: 0 !important;
	padding: 0 !important;
	margin-top: 4px !important
}

.list ul.arrow-list li {
	list-style-type: none !important
}

.list ul.arrow-list li:before {
	border-bottom: none !important;
	content: "\e93c" !important;
	font-family: 'icomoon' !important;
	top: 7px !important;
	font-size: 12px !important;
	font-weight: bold !important;
	color: #818285 !important
}

.border-box {
	border: 1px solid #000;
}

.col-tbl-img-block {
	position: relative;
}

.col-tbl-img {
	position: absolute;
	max-width: 97%;
	left: 50%;
	transform: translate(-50%, -47%);
}

.color-table {
	padding-left: 10px;
	margin-bottom: 30px
}

.color-table .row.no-gutters div div {
	padding: 10px 20px
}

.color-table .row .col-lg-6 div {
	border-bottom: 1px solid #004F9E;
	height: 100%
}

.color-table .row:nth-child(2) .col-lg-6 div {
	border-bottom: 1px solid #0083C3
}

.color-table .row .col-lg-6:nth-child(odd) div {
	border-right: 1px solid #0083C3
}

.col-tbl-hd {
	flex: 1;
}

.borderrgt {
	border-right: 2px solid #0083C2
}

.navy-bkr {
	background: #121740;
}

.bordertop-dblue {
	border-top: 1px solid #121740;
}

.bordertop-green {
	border-top: 1px solid #0DB14B;
}

.finthingrey {
	border-bottom: 1px solid #939598
}

.finthinwhite {
	border-bottom: 1px solid #fff
}



.finthick {
	border-bottom: 2px solid #0083C2
}

.finthickright {
	border-right: 3px solid #0083C2
}

.lft {
	text-align: left;
}

.bordertopblock {
	background: #EAF0F3;
	padding: 20px 10px;
	border-top: 2px solid #007BBD;
	margin: 20px 0
}

.ceo-block {
	background: linear-gradient(0deg, rgba(247, 247, 247, 1) 16%, rgba(0, 127, 188, 1) 100%);
	padding: 50px;
	height: 100%;
	padding-left: 80px
}

.ceo-img {
	background: -webkit-linear-gradient(180deg, #fff0 25%, #EDEDED 60%), url(../images/gceo-img.jpg);
	background-repeat: no-repeat;
	background-position: right;
	height: 100%;
	background-size: cover;
	position: relative
}

.chair-img {
	background: -webkit-linear-gradient(180deg, #fff0 25%, #EDEDED 60%), url("../images/chair-img.jpg");
	background-repeat: no-repeat;
	background-position: right;
	height: 100%;
	background-size: cover;
	position: relative
}

.ceo-img img {
	position: absolute;
	bottom: 0;
	left: -130px
}

.stakeholdersvalue-block {
	background-image: linear-gradient(#fff, #52CAEE);
	padding: 15px;
	min-height: 145px;
}

.stakeholdersvalue-box {
	background: #DFE8EA;
	padding: 20px;
	height: 100%
}

.b-border {
	border-right: 4px solid #0083C2
}

.lb-border {
	border-right: 4px solid #00B5EF
}

.llb-border {
	border-right: 4px solid #49C7ED
}

.grey-border {
	border-right: 4px solid #A9C4CB
}

.stakeholdersvalue-box p {
	transform: translate(0, -50%) !important;
	top: 50%;
	font-weight: 600;
	color: #0083C1;
	position: absolute;
	font-family: 'Telkom123 Bold', 'Calibri', Arial, Helvetica, sans-serif;
	text-align: left;
}

.stakeholdersvalue-block p {
	transform: translate(-50%, -50%) !important;
	top: 50%;
	left: 50%;
	color: #404042;
	position: absolute;
	font-size: 22px;
	font-weight: 700;
	text-align: center
}

.valueintro-block {
	border-bottom: 1px solid #939598;
	position: relative
}

.valueintro-block:before {
	content: '';
	border-bottom: 1px solid #939598;
	width: 80px;
	left: -80px;
	bottom: -1px;
	position: absolute
}

.valueintro-block:after {
	content: '';
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #939598;
	left: -82px;
	bottom: -3px;
	position: absolute;
}

.finright-blue {
	border-right: 1px solid #0083C2
}

.finright-grey {
	border-right: 1px solid #A1ABB2
}

.finright-white {
	border-right: 1px solid #fff
}

.risk-grey {
	background: #DFE8EA;
	padding-left: 30px
}

.capitalblueblock {
	background: linear-gradient(90deg, rgba(255, 255, 255, 1) 3%, rgba(4, 133, 195, 1) 100%);
	padding-top: 42px
}

.capital-box {
	background: linear-gradient(90deg, rgba(169, 195, 203, 1) 3%, rgba(5, 102, 156, 1) 100%);
	padding: 30px;
	padding-left: 15px
}

.capital-box h1 {
	color: #fff;
	margin: 0
}

.capital-greybg {
	background: #DFE8EA;
	padding: 35px 30px;
	height: 100%;
	padding-left: 80px
}

.capital-greybg h3 {}

.capital-wrapper {
	width: calc(100% - 154px);
	margin: 0 auto;
}

.capital-greybg p {
	text-align: left;
}

.capitals-circle span {
	text-align: center
}

.capitals-circle {
	width: 40% !important;
	margin: 0 auto;
	margin-bottom: 30px;
}

.capitals-circle:before {
	content: '';
	position: absolute;
	width: 1px;
	border-bottom: 1px solid #007BBE;
	right: 50%;
	height: 43px;
	top: auto;
	bottom: -32px;
	background: #007BBE;
}

.capitals-circle:after {
	content: '';
	position: absolute;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	right: 20px;
	top: 49%;
	background: #007BBE;
	top: auto;
	bottom: 9px;
	right: 48.7%;
}

.capitals-textborder p {
	color: #626366;
	font-weight: 600;
	font-family: 'Telkom123 Regular', 'Calibri', Arial, Helvetica, sans-serif;
}

.left-page-icons {
	position: relative;
	width: 0px;
	height: 30px;
	margin: 1px;
	left: -40px;
	bottom: 0;
	float: left
}

ul.list {
	padding: 0;
	margin: 0;
	list-style-type: none;
	margin-bottom: 20px
}

ul.list li {
	padding-left: 20px;
	position: relative;
	font-size: 15px;
	padding-bottom: 4px;
}

ul.list li:before {
	left: 0;
	position: absolute;
	content: '';
	top: 13px;
	width: 8px;
	border-bottom: 3px solid #939598
}

ul.list-number-notes {
	list-style-type: decimal;
	margin: 0px;
	padding: 0px;
}

ul.list-number-notes li {
	margin-left: 18px;
	font-size: 15px;
	line-height: 1.8;
}

ul.list-blue {
	padding: 0;
	margin: 0;
	list-style-type: none;
	margin-bottom: 20px
}

ul.list-blue li {
	padding-left: 20px;
	position: relative;
	font-size: 15px;
	padding-bottom: 4px;
}

ul.list-blue li:before {
	left: 0;
	position: absolute;
	content: '';
	top: 13px;
	width: 8px;
	border-bottom: 2px solid #0083C2
}


ul.list-white {
	padding: 0;
	margin: 0;
	list-style-type: none;
	margin-bottom: 20px
}

ul.list-white li {
	padding-left: 20px;
	position: relative;
	font-size: 15px;
	padding-bottom: 4px;
}

ul.list-white li:before {
	left: 0;
	position: absolute;
	content: '';
	top: 13px;
	width: 8px;
	border-bottom: 2px solid #fff
}

.text-left {
	text-align: left;
}

ul.dash-list {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

ul.dash-list li {
	position: relative;
	line-height: 1.4;
	padding-left: 20px;
}

ul.dash-list li:before {
	content: '';
	position: absolute;
	width: 8px;
	height: 1px;
	border-bottom: 2px solid #000000;
	left: 4px;
	top: 10px;
}

.txt-heading-med {
	font-size: 20px;
	color: #58595A;
}

.bg-greyish {
	background: #DFE8EA;
}

.intro li {
	font-size: 21px !important
}

/* FINANCIAL TABLE STYLES*/

.fin-tbl tr:hover {
	background: #DCE6EA !important;
	color: #000;
}

/*TABLE ON HOVER BACKGROUND COLOUR AND TEXT COLOUR*/
tr.no-hover:hover {
	color: #DFE8EA !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 {
	line-height: 1.4;
	padding: 3px 8px 3px 3px;
}

/*EACH CELL IN TABLE TO HAVE A PADDING OF 3 AROUND CONTENT*/
.fin-tbl th {
	color: #575756;
	text-align: right;
	padding: 3px 8px 3px 3px;
	background: #DCE6EA;
	font-weight: normal;
	font-family: 'Telkom123 Light', 'Calibri', Arial, Helvetica, sans-serif;
}

/*THE HIGHLIGHTED COLUMN BACKGROUND COLOUR; TEXT COLOUR; PADDING AND A FONT WEIGHT IF NEEDED*/
strong,
b {
	font-family: Telkom123 Bold
}

/*.fin-tbl tr:first-child th{background:#005B94; font-weight:600; color:#fff}
.fin-tbl tr td:first-child{padding-left:10px}*/

.switch-dblue {
	color: #005B93 !important
}

.switch-blue {
	color: #007BBE !important
}

.switch-black {
	color: #000 !important
}

.switch-grey {
	color: #57585b !important
}

.fin-tbl tr:nth-child(1) td.switch-blue {
	font-family: 'Telkom123 Regular', sans-serif;
}

.fin-tbl tr:nth-child(2) td.switch-blue {
	font-family: 'Telkom123 Regular', sans-serif;
}

.finheader {
	background: #B9CED4;
	color: #007BBE;
	font-weight: bold;
	font-family: Telkom123 Bold;
}

.finheaderbod {
	background: #B9CED4;
	color: #007BBE;
	font-weight: bold;
	font-family: Telkom123 Bold;
	border-bottom: 1px solid #0083C2;
}

.finheadergrey {
	background: #DFE8EA;
	color: #005B93 !important;
	font-weight: 300;
	font-family: Telkom123 Regular;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #939598
}

.finheadergreynb {
	background: #DFE8EA;
	color: #005B93 !important;
	font-weight: 300;
	font-family: Telkom123 Regular;
	border-bottom: 1px solid #939598
}

.finheader2 {
	color: #005B93 !important;
	font-weight: bold !important;
	font-family: Telkom123 Bold;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #939598
}

.finheader3 {
	color: #005B93 !important;
	font-weight: bold !important;
	font-family: Telkom123 Bold;
	border-bottom: 1px solid #939598
}

.finheader4 {
	color: #005B93 !important;
	font-weight: bold !important;
	font-family: Telkom123 Bold;
	border-bottom: 1px solid #fff;
	text-align: center !important
}

.finheader-nb {
	background: #0083C2;
	color: #fff;
	font-weight: bold !important;
	font-family: Telkom123 Bold;
	border-bottom: 1px solid #939598
}


/*blue lines*/
.finthin {
	border-bottom: 1px solid #0083C2
}

.fintop {
	border-top: 1px solid #0083C2
}

.finleft {
	border-left: 1px solid #0083C2;
}

.finright {
	border-right: 1px solid #0083C2;
}

.fintopleft {
	border-top: 1px solid #0083C2;
	border-left: 1px solid #0083C2;
}

.fintopright {
	border-top: 1px solid #0083C2;
	border-right: 1px solid #0083C2;
}

.finbotleft {
	border-bottom: 1px solid #0083C2;
	border-left: 1px solid #0083C2;
}

.finbotright {
	border-bottom: 1px solid #0083C2;
	border-right: 1px solid #0083C2;
}


.finthick {
	border-bottom: 3px solid #0083C2
}

.finthicktop {
	border-top: 3px solid #0083C2
}

.finthicker {
	border-bottom: 5px solid #0083C2;
}

.finthickertop {
	border-bottom: 5px solid #0083C2;
}


.finrow {
	border-top: 1px solid #0083C2;
	border-bottom: 1px solid #0083C2;
}

.finthickrow {
	border-top: 3px solid #0083C2;
	border-bottom: 3px solid #0083C2;
}

.finrowleft {
	border-left: 1px solid #0083C2;
	border-top: 1px solid #0083C2;
	border-bottom: 1px solid #0083C2;
}

.finrowright {
	border-right: 1px solid #0083C2;
	border-top: 1px solid #0083C2;
	border-bottom: 1px solid #0083C2;
}

/*blue lines end*/



/*grey lines*/
.finthingrey {
	border-bottom: 1px solid #939598
}

.fintopgrey {
	border-top: 1px solid #939598
}

.finleftgrey {
	border-left: 1px solid #939598;
}

.finrightgrey {
	border-right: 1px solid #939598;
}

.fintopleftgrey {
	border-top: 1px solid #939598;
	border-left: 1px solid #939598;
}

.fintoprightgrey {
	border-top: 1px solid #939598;
	border-right: 1px solid #939598;
}

.finbotleftgrey {
	border-bottom: 1px solid #939598;
	border-left: 1px solid #939598;
}

.finbotrightgrey {
	border-bottom: 1px solid #939598;
	border-right: 1px solid #939598;
}

.finrowgrey {
	border-top: 1px solid #939598;
	border-bottom: 1px solid #939598;
}

.finthickrowgrey {
	border-top: 3px solid #939598;
	border-bottom: 3px solid #939598;
}

/*grey lines end*/





.finthickerred {
	border-bottom: 4px solid #E41E2C;
}

.finthickertop {
	border-top: 4px solid #0083C2;
}

.finthintopbot {
	border-bottom: 1px solid #0083C2;
	border-top: 1px solid #0083C2
}

.finthickergrey {
	border-bottom: 3px solid #939598;
}

.finthindargrey {
	border-bottom: 1px solid #636466
}

.finthinwhite {
	border-bottom: 1px solid #fff
}

.finrightwhite {
	border-right: 1px solid #fff
}


.fingreytext {
	color: #6D6E71
}

.fingreytextthin {
	color: #6D6E71;
	border-bottom: 1px solid #939598
}

.fingreytextthick {
	color: #6D6E71;
	border-bottom: 2px solid #939598
}

.fincaption {
	font-size: 11px;
	font-style: italic
}

.contentfin {
	background-color: #FFF;
	padding: 20px 20px 20px 20px;
	border: 1px solid #184069;
}

.captionfin {
	font-size: 11px;
}

.caption {
	font-size: 11px !important;
	font-style: italic;
	padding-bottom: 0
}



.focusrow {
	border-top: 1px solid #0083C2
}

.focus1 {
	background: #DFE8EA;
	padding: 10px;
	height: 100%;
	color: #0083C1;
	font-weight: bold;
	border-bottom: 1px solid #939598
}

.focus2 {
	padding: 10px;
	height: 100%;
	border-bottom: 1px solid #939598
}


/*---RESET STYLES----*/

.no-borderB {
	border-bottom-width: 0 !important
}

.no-borderR {
	border-right-width: 0 !important
}

.no-borderT {
	border-top-width: 0 !important
}

.no-borderL {
	border-left-width: 0 !important
}

.obj-c {
	margin-left: auto;
	margin-right: auto;
	display: block;
	text-align: center !important;
}

.rgt {
	float: right;
	text-align: right
}


.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;
}

.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-5T {
	padding-top: 5px !important;
}

.padding-20B {
	padding-bottom: 20px !important;
}

.padding-10 {
	padding: 10px !important;
}

.padding-10T {
	padding-top: 10px !important;
}

.padding-10L {
	padding-left: 10px !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;
}

.padding-10B {
	padding-bottom: 10px !important;
}

.padding-40T {
	padding-top: 40px !important;
}

.padding-40B {
	padding-bottom: 40px !important;
}

.padding-50R {
	padding-right: 50px !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-40T {
	margin-top: 40px !important;
}

.margin-50T {
	margin-top: 50px !important;
}

.margin-60T {
	margin-top: 60px !important;
}

.margin-70T {
	margin-top: 70px !important;
}

.margin-80T {
	margin-top: 80px !important;
}

.margin-90T {
	margin-top: 90px !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-10TB {
	margin: 7px 0px !important;
}

.margin-20T {
	margin-top: 20px !important;
}

.margin-20B {
	margin-bottom: 20px !important;
}

.margin-40B {
	margin-bottom: 40px !important;
}

.margin-50B {
	margin-bottom: 50px !important;
}

.margin-60B {
	margin-bottom: 60px !important;
}

.margin-70B {
	margin-bottom: 70px !important;
}

.margin-75B {
	margin-bottom: 75px !important;
}

.margin-75T {
	margin-top: 75px !important;
}

.margin-75R {
	margin-right: 75px !important;
}

.margin-80B {
	margin-bottom: 80px !important;
}

.margin-10 {
	margin: 10px !important;
}

.margin-10L {
	margin-left: 10px !important;
}

.margin-10R {
	margin-right: 10px !important;
}

.margin-10T {
	margin-top: 10px !important;
}

.margin-10B {
	margin-bottom: 10px !important;
}

.margin-15B {
	margin-bottom: 15px !important;
}

.margin-15T {
	margin-top: 15px !important;
}

.margin-5 {
	margin-top: 5px !important;
}

.margin-5B {
	margin-bottom: 5px !important;
}

.margin-80T {
	margin-top: 80px !important;
}


.margin-75L {
	padding-left: 75px !important;
}

/*=SWITCH COLORS
---------------*/
.color-block {
	height: 200px;
	width: 100%;
	position: relative
}

.color-block span {
	width: 100%;
	position: absolute;
	top: 50%;
	text-align: center;
	transform: translateY(-50%);
	display: block;
}

.switch-bg-l-blue {
	background: #00B6F0 !important
}

.switch-bg-l-blue-1 {
	background: #44C7EE !important
}

.switch-bg-d-blue {
	background: #004F9E !important
}

.switch-bg-p-blue {
	background: #E1F4FD !important
}

.switch-bg-aq-blue {
	background: #95D3F3 !important
}

.switch-bg-p-blue-1 {
	background: #C7DADF !important
}

.switch-bg-navy {
	background: #0E2C6D !important
}

.switch-bg-l-grey {
	background: #E9EBEB !important
}

.switch-bg-d-grey {
	background: #485966 !important
}

.switch-bg-d-grey-1 {
	background: #9FAAB2 !important
}

.switch-bg-grey {
	background: #9FAAB2 !important
}

.switch-bg-grey {
	background: #D9DFDE !important
}

.switch-bg-blue {
	background: #0083c2 !important
}

.switch-bg-blue-1 {
	background: #005B94 !important
}

.switch-bg-aq-grey {
	background: #CFDDE0 !important
}

.switch-bg-aq {
	background: #28C0DA !important
}

.switch-bg-green {
	background: #22B24C !important
}

.switch-bg-yellow {
	background: #FDBA29 !important
}

.switch-bg-red {
	background: #E41E2C !important
}

.switch-bg-orange {
	background: #F36F21 !important
}

.switch-bg-white {
	background: #FFF !important
}

.switch-bg-graph-grey {
	background: #E2E6E6 !important
}

.switch-d-grey-1 {
	color: #9FAAB2 !important
}

.switch-l-blue-2 {
	color: #0083C2 !important
}

.switch-l-blue {
	color: #00B6F0 !important
}

.switch-l-blue-1 {
	color: #44C7EE !important
}

.switch-d-blue {
	color: #004F9E !important
}

.switch-navy {
	color: #0E2C6D !important
}

.switch-l-grey {
	color: #E9EBEB !important
}

.switch-d-grey {
	color: #3C3C3B !important
}

.switch-d-grey-1 {
	color: #9FAAB2 !important
}

.switch-grey {
	color: #939597 !important
}

.switch-aq-blue {
	color: #95D3F3 !important
}

.switch-aq-grey {
	color: #A8C5CD !important
}

.switch-aq {
	color: #28C0DA !important
}

.switch-green {
	color: #22B24C !important
}

.switch-yellow {
	color: #FDBA29 !important
}

.switch-red {
	color: #E41E2C !important
}

.switch-orange {
	color: #F36F21 !important
}

.switch-white {
	color: #FFF !important
}

.switch-black {
	color: #000 !important
}

.scrollable {
	position: relative;
	clear: both;
}

.download-section-Telkom>img {
	margin-top: 20px;
	cursor: pointer;
}

.button-download {
	color: #007BBE;
	font-size: 16px;
	text-align: center;
	position: relative;
	display: inline-block;
	font-weight: 500;
	transition: all 0.3s ease-out;
	cursor: pointer;
	margin-right: -8px;
	margin-top:25px;
}

.button-download img {}

.button-download strong {
	display: block;
	margin: 22px 0;
}

.download-section-Telkom:hover .button-download img {
	cursor: pointer;
	animation: bounce 3s ease-in-out;
}

.download-section-Telkom:hover .button-download {
	color: #004f9e;
	transition: all 0.3s ease-out;
}

.download-section-Telkom:hover .button-download span {
	font-weight: bold
}

/*Telkom Snaphot*/

.snapshot-purpose-circle {
	width: 25%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	position: relative;
	left: 13%;
	margin-bottom: 15px;
	text-align: center;
}

.snapshot-purpose-circle-two {
	width: 25%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	position: relative;
	left: 28%;
	margin-bottom: 15px;
	text-align: center;
}

.snapshot-purpose-circle {
	width: 35%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	position: relative;
	left: 18%;
	margin-bottom: 15px;
	text-align: center;
}

.snapshot-purpose-circle-two {
	width: 35%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	position: relative;
	left: 23%;
	margin-bottom: 15px;
	text-align: center;
}

.snapshot-purpose-circle-line:before {
	content: '';
	width: 11px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	background: #0E2C6D;
	position: absolute;
	left: 50%;
	bottom: -46%;
	z-index: 1;
	transform: translateX(-50%);
}

.snapshot-purpose-circle-line:after {
	content: '';
	position: absolute;
	width: 1px;
	height: 82px;
	background: #0E2C6D;
	left: 50%;
	top: 80%;
	z-index: 1;
	transform: translateX(-50%)
}

.snapshot-purpose-circ-line:after {
	content: '';
	width: 11px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	background: #0E2C6D;
	position: absolute;
	left: 50%;
	bottom: -69vh;
	z-index: 1;
	transform: translateX(-50%);
}

.snapshot-purpose-circ-line:before {
	content: '';
	position: absolute;
	width: 1px;
	height: 680px;
	background: #0E2C6D;
	left: 50%;
	top: 80%;
	z-index: 1;
	transform: translateX(-50%);
}

.our-vision-content:after {
	content: '';
	position: absolute;
	width: 1px;
	height: 60px;
	background: #0E2C6D;
	left: 41%;
	top: -22%;
	z-index: 1;
	transform: translateX(-50%);
}

.our-vision-content:before {
	content: '';
	width: 11px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	background: #0E2C6D;
	position: absolute;
	left: 40.8%;
	top: -6%;
	z-index: 1;
	transform: translateX(-50%);
}

.snapshot-purpose-circle-two span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	margin: 0 auto;
	width: 80%;
}

.snapshot-purpose-circle span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	margin: 0 auto;
	width: 80%;
}

.snapshot-seam-circle span {
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	color: #fff;
	transform: translate(-50%, -50%);
	width: 80%;
}

.snapshot-seam-circle-two span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	color: #fff;
	width: 70%;
}

.snapshot-seam-circle {
	width: 69%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	text-align: center;
	position: relative;
}

.snapshot-seam-circle-two {
	width: 80%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	text-align: center;
	position: relative;
	margin-bottom: 25px;
}

.border-bottom-ov {
	border-bottom: 1px solid #49C7ED;
	text-align: center;
	padding-bottom: 5px;
	padding-top: -13px;
}

.our-vision-content {
	margin-top: 35px;
	position: relative
}

.our-values-and-culture-circ {
	width: 84%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	position: relative;
	left: 18%;
	margin-bottom: 15px;
	text-align: center;
}

.our-values-and-culture-circ span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	color: #fff;
}


.dot-our-values-and-culture {
	width: 10px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	background: #0E2C6D;
	position: absolute;
	left: 68.7%;
	bottom: -13%;
}

.alphabet-border-snapshot {
	border-bottom: 2px solid #49C7ED;
	margin-bottom: 10px;
}

.alphabet-one {
	font-size: 55px;
	color: #004F9D;
	left: -88px;
}

/*End of Telkom Snaphot*/




/*telkoms-business-units*/

.t-business-units section {
	border-bottom: 1px solid #0DB14B;
	border-right: 1px solid #0DB14B;
	height: 100%
}

.t-business-units .heading {
	color: #0DB14B;
	padding: 5px 15px 5px 15px;
	border-bottom: 1px solid #0DB14B;
	display: block;
	width: 100%;
	min-height: auto;
}

.t-business-units .content {
	padding: 0 15px 10px 15px;
}

.t-business-units .content ul li span {
	color: #0DB14B;
	font-weight: 500;
}

.t-business-units {
	background-image: linear-gradient(to bottom, #AAC4CB, #F6F9F9);
	margin-top: 45px;
}

.t-business-units .header .img-section {
	width: 215px;
	margin: 0 auto;
}

.t-business-units .header .img-section p {
	margin-left: 13px;
	margin-bottom: 4px;
	margin-top: 7px;
}

.t-business-units .header .img-section p strong {
	color: #0DB14B;
	font-weight: 500;
}

.t-business-units .header {
	position: relative;
}

.t-business-units .header::before {
	content: "";
	position: absolute;
	height: 335px;
	width: 100%;
	right: -40px;
	top: -45px;
	background-image: linear-gradient(to right, rgba(170, 195, 203, 0) 20%, rgba(170, 195, 203, 1));
}

.t-business-units .header .description {
	padding: 75px;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 20px;
}

.t-business-units .header .description p {
	color: #fff;
	font-weight: 600;
	margin-bottom: 25px;
	background-image: linear-gradient(to right, rgba(13, 177, 75, 1), rgba(13, 177, 75, 0) 90%);
	padding: 40px 10px 40px 30px;
	position: relative;
	z-index: 999;
}

.switch-linear-blue {
	background-image: linear-gradient(to right, #0083C2, rgba(13, 177, 75, 0) 90%) !important;
}

.description p a:link {
	color: fff !important;
	text-decoration: underline;
}

.description p a:link:hover {
	color: #0571C6 !important;
}

.t-business-units .description .link {
	margin-left: 30px;
}

.t-business-units .img-section-cont {
	position: relative;
}

.t-business-units .img-section-cont::before {
	content: "";
	position: absolute;
	height: 331px;
	width: 110%;
	left: -40px;
	top: -45px;
	background-image: linear-gradient(to right, rgba(13, 177, 75, 1), rgba(13, 177, 75, 0));
	z-index: 1;
}

.t-business-units .header .img-section img {
	position: relative;
	z-index: 1;
}

.bg-switch-grey {
	background: #EBEBEC;
	padding-top: 30px
}

.tel-ban-block1 {
	min-height: 200px;
	border-right: solid 10px #A8C5CD;
	position: relative
}

.tel-ban-block1 span {
	font-size: 80px;
	color: #0083C3;
	font-weight: bold;
	text-align: right;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%)
}

.t-business-units {
	position: relative;
	padding-bottom: 40px;
}

.t-business-units::before {
	content: "";
	position: absolute;
	height: 100%;
	width: 100%;
	left: -40px;
	bottom: 0;
	background-image: linear-gradient(to bottom, #AAC4CB, #F6F9F9);
}

.t-business-units::after {
	content: "";
	position: absolute;
	height: 100%;
	width: 100%;
	right: -40px;
	bottom: 0;
	background-image: linear-gradient(to bottom, #AAC4CB, #F6F9F9);
	z-index: -1;
}

.units-wrapper {
	width: calc(100% - 237px);
	margin: 0 auto;
}

.capital-wrapper {
	width: calc(100% - 154px);
	margin: 0 auto;
}

.product-cap-heading {
	padding: 30px 0 30px 85px;
}

.product-cap-heading h1 {
	color: #FFF;
	margin: 0;
	position: relative;
	font-size: 2em;
}

.product-cap-heading h1:before {
	position: absolute;
	content: "";
	background: url("../images/icons/prod-cap-icon.png");
	width: 55px;
	height: 55px;
	left: -70px;
	top: 8px
}

.product-cap-heading h1:after {
	position: absolute;
	content: "";
	background: url("../images/textures/openserve-texture.png") no-repeat center;
	width: 250px;
	height: 150px;
	right: -48px;
	top: 0;
	z-index: 1;
	background-size: contain;
}

.capital-snapshot-gradient-bg {
	background: linear-gradient(to right, #FFF 12%, #CFDDE0 25%);
	padding: 30px 30px 30px 0;
}

.switch-green-intro {
	background: linear-gradient(to bottom, #037E19 80%, #FBFDFA);
	padding: 50px;
	border-top: 30px solid #2AB44F;
}

.switch-blue-intro {
	background: linear-gradient(to bottom, #006A9E 80%, #FBFCFD);
	padding: 50px;
	border-top: 30px solid #0087C4;
}

.switch-red-intro {
	background: linear-gradient(to bottom, #CC0809 80%, #FFFFFF);
	padding: 50px;
	border-top: 30px solid #E43030;
}

.switch-purple-intro {
	background: linear-gradient(to bottom, #020313 80%, #FFFFFF);
	padding: 50px;
	border-top: 30px solid #181C43;
}

.switch-orange-intro {
	background: linear-gradient(to bottom, #E93606 80%, #FFFFFF);
	padding: 50px;
	border-top: 30px solid #F17325;
}

.capital-intro {
	font-size: 18px;
	color: #FFF;
	font-weight: 600;
	text-align: left;
}

.key-focus-block {
	margin-left: 45px;
	position: relative;
	padding-top: 42px;
}

.focus-text {
	text-align: right;
	font-size: 16px;
}

ul.line-list-green {
	padding-left: 0;
	margin-top: 56px;
}

ul.line-list-lgreen {
	padding-left: 5px;
	margin-top: 50px;
	position: relative;
}

ul.line-list-lgreen:before {
	position: absolute;
	content: "";
	height: 100%;
	width: 1px;
	background: #0DB14B;
	right: -18px;
	top: 0
}

ul.line-list-lgreen li {
	border-bottom: 1px solid #82B441;
	list-style: none;
	color: #636466;
	padding-bottom: 5px;
	font-size: 15px;
}

ul.line-list-lgreen li span,
ul.line-list-green li span {
	font-weight: 600;
}

ul.line-list-green li {
	border-bottom: 1px solid #0DB14B;
	list-style: none;
	color: #636466;
	padding-bottom: 5px;
	font-size: 15px;
}

.switch-bg-lime {
	background: #82B441
}

.performance-snapshot-circle {
	width: 90%;
	aspect-ratio: 1/1;
	position: relative;
	border-radius: 50%;
}

.performance-snapshot-circle span {
	text-align: center;
	font-weight: 600;
	color: #FFF;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: block;
	font-size: 14px;
}

.performance-snapshot-circle-inv {
	background: none;
	border: 1px solid #82B441;
	float: right;
	clear: both;
	position: relative;
}

.performance-snapshot-circle-inv:before {
	position: absolute;
	content: "";
	height: 50px;
	width: 1px;
	background: #485865;
	left: 50%;
	bottom: -25px;
	transform: translateX(-50%);
}

.performance-snapshot-circle-inv:after {
	position: absolute;
	content: "";
	height: 5px;
	width: 5px;
	background: #485865;
	left: 50%;
	bottom: -25px;
	transform: translateX(-50%);
	border-radius: 50%;
}

.border-dgreen {
	border: 1px solid #0DB14B;
}

.switch-lgreen {
	color: #82B441 !important
}

h3 img {
	padding-right: 15px;
}

.key-focus-block:before {
	position: absolute;
	content: "";
	background: #22B24C;
	height: 80%;
	width: 1px;
	bottom: 0;
	left: -61px;
}

.new-w {
	width: 79%
}



h1.indent {
	margin-left: -40px
}

.t-business-units {
	margin-bottom: 55px;
}

.units-wrapper h3 {
	margin-left: -40px;
	padding-bottom: .5rem !important
}

.t-business-units .content .list-blue {
	margin-bottom: 0 !important;
}

.t-business-units .column1 .heading {
	padding-left: 0 !important
}

.t-business-units .column1 .content {
	padding-left: 0 !important
}

.units-consumer .header .description p {
	background-image: linear-gradient(to right, #0083C3, rgba(13, 177, 75, 0) 90%) !important;
}

.units-consumer .img-section-cont::before {
	background-image: linear-gradient(to right, #0083C3, rgba(13, 177, 75, 0)) !important;
}

.units-consumer section {
	border-bottom: 1px solid #0083C3 !important;
	border-right: 1px solid #0083C3 !important;
}

.units-consumer .heading {
	border-bottom: 1px solid #0083C3 !important;
}

.units-bcx .header .description p {
	background-image: linear-gradient(to right, #E41E2C, rgba(13, 177, 75, 0) 90%) !important;
}

.units-bcx .img-section-cont::before {
	background-image: linear-gradient(to right, #E41E2C, rgba(13, 177, 75, 0)) !important;
}

.units-bcx section {
	border-bottom: 1px solid #E41E2C !important;
	border-right: 1px solid #E41E2C !important;
}

.units-bcx .heading {
	border-bottom: 1px solid #E41E2C !important;
}


.units-swiftnet .header .description p {
	background-image: linear-gradient(to right, #0E2C6D, rgba(13, 177, 75, 0) 90%) !important;
}

.units-swiftnet .img-section-cont::before {
	background-image: linear-gradient(to right, #0E2C6D, rgba(13, 177, 75, 0)) !important;
}

.units-swiftnet section {
	border-bottom: 1px solid #0E2C6D !important;
	border-right: 1px solid #0E2C6D !important;
}

.units-swiftnet .heading {
	border-bottom: 1px solid #0E2C6D !important;
}


.units-gyro .header .description p {
	background-image: linear-gradient(to right, #F36F21, rgba(13, 177, 75, 0) 90%) !important;
}

.units-gyro .img-section-cont::before {
	background-image: linear-gradient(to right, #F36F21, rgba(13, 177, 75, 0)) !important;
}

.units-gyro section {
	border-bottom: 1px solid #F36F21 !important;
	border-right: 1px solid #F36F21 !important;
}

.units-gyro .heading {
	border-bottom: 1px solid #F36F21 !important;
}






/*end telkoms-business-units*/


/*Celebrating 30 years*/
.timeline-bg {
	min-height: 100vh;
	background-image: url('../images/timeline/timeline-background.jpg');
	padding: 50px 0;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}

.year-block {
	background: rgb(169, 195, 203);
	background: -moz-linear-gradient(90deg, rgba(169, 195, 203, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
	background: -webkit-linear-gradient(90deg, rgba(169, 195, 203, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
	background: linear-gradient(90deg, rgba(169, 195, 203, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#a9c3cb", endColorstr="#ffffff", GradientType=1);
	aspect-ratio: 1/.2;
	position: relative;
}

.year-block p,
.year-info p {
	width: 70%;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	font-weight: 700;
	color: #FFF;
	margin-bottom: 0px;
}

.year-info {
	aspect-ratio: 1/1;
	border-radius: 50%;
	width: 95%;
	position: relative;
	margin: 20px 0 60px 0px;
}


/** fixing circles on firefox*/

@-moz-document url-prefix() {
	.year-info {
		padding-top: 95%;
	}

	.year-block {
		padding-top: 20%
	}

	.snapshot-purpose-circle-two,
	.snapshot-purpose-circle {
		padding-top: 35%
	}

	.snapshot-purpose-circle-two span,
	.snapshot-purpose-circle span,
	.our-values-and-culture-circ span,
	.snapshot-seam-circle span,
	.snapshot-seam-circle-two span,
	.snapshot-performance-circlebg span,
	.snapshot-performance-circlesml span,
	ul.tabs li span,
	a.material-aspects-circle span,
	.eng-top-circle-stakeholder span,
	.eng-circle-stakeholder span,
	.proactive-activities-circle-risk span,
	.proactive-activities-circle-risk1 span {
		position: absolute !important;
		top: 50% !important;
		left: 50% !important;
		transform: translate(-50%, -50%) !important;
		width: 80% !important;
	}

	.our-values-and-culture-circ {
		padding-top: 84%
	}

	.snapshot-seam-circle {
		padding-top: 69%
	}

	.snapshot-seam-circle-two {
		padding-top: 84%
	}

	.snapshot-performance-circlebg {
		padding-top: 60%
	}

	.snapshot-performance-circlesml {
		padding-top: 85%
	}

	a.material-aspects-circle,
	.chair-crc,
	.performance-snapshot-circle.switch-bg-white.w-100 {
		padding-top: 100% !important
	}

	ul.tabs li {
		padding-top: 16% !important
	}

	.number2,
	.number3,
	.number4,
	.number5,
	.number-one1,
	.number1,
	.number-one {
		height: 40px
	}

	.eng-circle-stakeholder,
	.eng-top-circle-stakeholder {
		height: 170px
	}

	.proactive-activities-circle-risk {
		height: 150px
	}

	.proactive-activities-circle-risk2 {
		height: 95px
	}

	.performance-snapshot-circle {
		padding-top: 90%
	}

	ul.gyro-num-circle li {
		padding-top: 9% !important
	}

	.performance-snapshot-circle.switch-bg-white,
	.tab-switch {
		padding-top: 40%
	}

	.caption .legend-number-key {
		height: 20px
	}

	.legend-number-key {
		height: 25px
	}

	.committee-darkblue-circle,
	.committee-blue-circle,
	.committee-taques-circle,
	.committee-lightblue-circle,
	.committee-grey-circle {
		height: 130px;
	}

	.capitals-circle {
		padding-top: 40%
	}
}

/* end circles on firefox */


.year-block+.year-info {
	margin: 60px 0 20px 0;
}

#year-1991 .year-info {
	background-color: #96D1F2;
}

#year-1991 .year-block {
	background: rgb(150, 209, 242);
	background: -moz-linear-gradient(90deg, rgba(150, 209, 242, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
	background: -webkit-linear-gradient(90deg, rgba(150, 209, 242, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
	background: linear-gradient(90deg, rgba(150, 209, 242, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#96d1f2", endColorstr="#ffffff", GradientType=1);
}

#year-2001 .year-info {
	background-color: #49C7ED;
}

#year-2001 .year-block {
	background: rgb(73, 199, 237);
	background: linear-gradient(90deg, rgba(73, 199, 237, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}


#year-2002 .year-info {
	background-color: #1FC0DB;
}

#year-2002 .year-block {
	background: rgb(31, 192, 219);
	background: linear-gradient(90deg, rgba(31, 192, 219, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2003 .year-info {
	background-color: #00B5EF;
}

#year-2003 .year-block {
	background: rgb(0, 181, 239);
	background: linear-gradient(90deg, rgba(0, 181, 239, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2009 .year-info {
	background-color: #008BC6;
}

#year-2009 .year-block {
	background: rgb(0, 139, 198);
	background: linear-gradient(90deg, rgba(0, 139, 198, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2010 .year-info {
	background-color: #0083C2;
}

#year-2010 .year-block {
	background: rgb(0, 131, 194);
	background: linear-gradient(90deg, rgba(0, 131, 194, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2012 .year-info {
	background-color: #004F9D;
}

#year-2012 .year-block {
	background: #004F9D;
}

#year-2013 .year-info {
	background-color: #004F9D;
}

#year-2013 .year-block {
	background: #004F9D;
}

#year-2015 .year-info {
	background-color: #003E6A;
}

#year-2015 .year-block {
	background: rgb(0, 62, 106);
	background: linear-gradient(90deg, rgba(0, 62, 106, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2016 .year-info {
	background-color: #0D2C6C;
}

#year-2016 .year-block {
	background: rgb(13, 44, 108);
	background: linear-gradient(90deg, rgba(13, 44, 108, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2017 .year-info {
	background-color: #485865;
}

#year-2017 .year-block {
	background: rgb(72, 88, 101);
	background: linear-gradient(90deg, rgba(72, 88, 101, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2020 .year-info {
	background-color: #0083C2;
}

#year-2020 .year-block {
	background: rgb(0, 131, 194);
	background: linear-gradient(90deg, rgba(0, 131, 194, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

#year-2022 .year-info {
	background-color: #49C7ED;
}

#year-2022 .year-block {
	background: rgb(73, 199, 237);
	background: linear-gradient(90deg, rgba(73, 199, 237, 1) 49%, rgba(255, 255, 255, 0.053658963585434205) 118%);
}

.year-info.w-0 {
	background-color: transparent !important;
}



.year-info.w-0 {
	opacity: 0;
}


.year-block+.year-info::before {
	bottom: calc(100% + -15px);
}


.year-block+.year-info::after {
	bottom: calc(100% + 63px);
}

.margin-center {
	position: relative;
	left: 6%;
}


/*End Celebrating 30 years*/


/*BOD*/
.member-container .row,
.member-container .row .col-lg-4,
.member-container .row .col-lg-8 {
	height: 100%
}

.member-container {
	padding-left: 10px;
	border: solid 2px;
	border-width: 0px 0px 0px 7px;
	margin-top: 20px;
	height: calc(100% - 20px);
}

.non-exec-container,
.new-non-exec-container {
	border-color: #004F9D;
}

.group-exec-container {
	border-color: #1FC0DB;
}

.member-name {
	margin: 20px 0px 0px 0px;
	font-weight: 800;
}

.member-name .member-age {
	display: block;
}

.non-exec-container .member-name,
.non-exec-container .member-info p i,
.new-non-exec-container .member-name,
.new-non-exec-container .member-info p i {
	color: #004F9D;
	font-style: normal;
}

.group-exec-container .member-name,
.group-exec-container .member-info p i {
	color: #1FC0DB;
	font-style: normal;
}

.member-info p {
	text-align: left;
	color: #6D6E70;
	margin-bottom: 10px
}

.member-info {
	height: 100%;
	margin-left: 10px;
	padding-left: 10px;
	border-left: 1px solid grey;
}

.max-width-block-member {
	max-width: 165px;
}

.tab-switch {
	aspect-ratio: 1/.5;
	position: relative;
	cursor: pointer;
	transition: 0.6s ease-in-out;
}

.tab-switch p {
	font-size: 20px;
	color: #FFF;
	text-align: center;
	width: 90%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-weight: 800;
	margin-bottom: 0px;
}

.section-member-heading {
	margin-top: 40px;
	margin-bottom: 0px
}

#all-button.active {
	background-color: #005B94 !important
}

#non-exec-button.active {
	background-color: #004F9D !important;
}

#new-non-exec-button.active {
	background-color: #A9C4CB !important;
}

#group-exec-button.active {
	background-color: #1FC0DB !important;
}

/*end BOD*/


/* start form of proxy styles */
.desk {
	perspective: 1000;
	margin: 100px auto;
}

/*this is it!*/
.device {
	position: relative;
	width: 43%;
	aspect-ratio: 1/1.5;
	padding: 10px;
	border-radius: 15px;
	margin: 0 auto;
	background-color: #0a0a0a;
	box-shadow: -3px 3px 0 -1px #505050, -6px 7px 0 -2px #313131, 50px 80px 90px -12px rgba(0, 0, 0, 0.6), -50px 80px 200px -6px rgba(0, 0, 0, 0.3);
	transform-style: preserve-3d;
	transform: translateX(0px) translateY(-105px) translateZ(-13px) rotateX(45deg) rotateY(-2deg) rotateZ(-38deg);
	transform-origin-x: 50%;
	transform-origin-y: 50%;
	transition: all 0.3s ease-in-out;
}

.device:hover {
	transform: translateX(0px) translateY(50px) translateZ(-13px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
	cursor: pointer;
}

.device:before,
.device:after {
	position: absolute;
	content: '';
	border-radius: inherit;
	top: 0;
	left: 0;
}



/*
This should be used to add the reflection gradient.
*/


.screen {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	overflow: hidden;
}

.screen a {
	display: block;
}

.screen img {
	opacity: 0.6;
	transition: 0.6s ease-in-out;
}

.device:hover .screen img {
	opacity: 1;
}

/* end form of proxy styles */


/*swiftnet*/
.top-bg {
	background-image: url('../images/swiftnet-image.jpg');
	background-size: cover;
	background-repeat: no-repeat;
}

.consumer-white-gradient {
	background: linear-gradient(180deg, rgb(255 255 255 / 0) -3%, #fff 67%);
}


.consumer-dblue-gradient {
	background: linear-gradient(180deg, rgb(255 255 255 / 0) -3%, #E94F35 67%);
}

.blue-thick-lines {
	border-top: 4px solid #1D1E3F;
	border-bottom: 4px solid #1D1E3F;
	display: flex;
	justify-content: space-between;
	padding: 5px 35px;
	margin-top: 76px
}

.blue-thick-lines p {
	font-size: 20px;
	margin-bottom: 0;
	margin-top: 15px;
}

.blue-thick-lines img {
	
	margin-left: 5px;
}

@media screen and (max-width: 1230px) {
	.blue-thick-lines {
		padding: 5px 11px;
	}

}


.logo-telkom {
	padding: 90px 40px 90px 35px;
}

.consumer-dblue-gradient-content {
	border-bottom: 4px solid #fff;
	padding: 30px 38px 37px 38px;
}

.consumer-dblue-gradient-content-2 {
	padding: 30px 38px 217px 38px;
}

.consumer-dblue-gradient-content-2 p {
	text-align: left !important;
}

.consumer-dblue-gradient-content p {
	text-align: left !important;
}

.lblue-grad {
	background: linear-gradient(0deg, rgb(255 255 255 / 0) -3%, #fff 67%);
	width: 90%;
}

.lblue-grad-content {
	padding: 25px 40px 0px 40px;
}

.mobile-subscribers {
	display: flex;
	flex-direction: column;
	background-color: #4B9EC4;
}

.mobile-subscribers-huge-num {
	font-size: 30px;
	color: #84CFF5;
	margin-bottom: 18px;
	margin-left: 38px;
	font-family: 'Telkom123 bold', 'Calibri', Arial, Helvetica, sans-serif;
}


.open-serve-white-circle-holder {
    position: absolute;
    top: calc(50% - 60px);
}

.open-serve-white-circle-head {
	font-size: 37px;
	color: #fff;
	font-weight: 700;
}

.open-serve-white-circle-text {
	font-weight: bold;
	color: #fff;
	width: 200px;
    padding: 10px;
}

.open-serve-white-circle {
	width: 200px;
	height: 200px;
	border: 1px solid #fff;
	padding: 5px;
	border-radius: 50%;
	text-align: center;
	margin: auto;
	position: relative;
}

.open-serve-white-circle-none {
	border: 0px solid #000;
}

.open-serve-white-circle-holder-spacer {
	padding-top: 20px;
}

.accelerated-mobile-g {
	display: flex;
	justify-content: space-between;
}

.accelerated-mobile-img img {
	width: 17%;
}

.accelerated-mobile-img {
	text-align: end;
}


.coloum-bcx {
	display: flex;
	flex-direction: column;
	background-color: #FBD1C0;
	margin-top: 24px;
	padding: 25px;
	min-height: 230px;
}

.coloum-bcx-2 {
	display: flex;
	flex-direction: column;
	background-color: #FBD1C0;
	margin-top: 45px;
}

.bcx-huge-num {
	font-size: 30px;
	margin-bottom: 0;
	font-family: 'Telkom123 bold', 'Calibri', Arial, Helvetica, sans-serif;
}

.bcx-inner-holder {
	display: flex;
	justify-content: space-between;
}

.bcx-inner-left {
	display: flex;
	flex-direction: column;
}

.bcx-inner-left p {
	text-align: left !important;
}

.bg-lred-content-line {
	border-right: 1px solid #fff;
	padding: 10px 23px 18px 23px;
}

.bg-lred-content-line-white {
	border-right: 1px solid #fff;
}

.bcx-growth-arrow {
	position: relative;
}

.right-sec {
	padding-top: 5px;
}

.right-sec-2 {
	margin-top: 17px;
}

.right-sec p {
	margin-left: 6px;
}

.bg-lred-content-2 .big-brown-num-2 {
	font-size: 26px;
	font-weight: bold;
	font-family: 'Telkom123 Bold';
}

p.big-brown-num-2 {
	font-size: 26px;
	font-weight: bold;
	font-family: 'Telkom123 Bold';
}

.split-content {
	display: flex;
	justify-content: space-around;
	height: 67px;
	padding-top: 10px;
}

.bcx-growth-arrow span {
	position: absolute;
	top: -30px;
	left: 12px;
}

.bcx-growth-arrow img {
	margin-right: 36px;
	margin-left: -9px;
}

.orange-bg-img {
	background-image: url('../images/masters-and-towers-image.jpg');
	background-repeat: no-repeat;
	height: 95vh;
	background-size: cover;
	background-position: bottom;
	margin-top: 37px;
	padding-top: 50px;
	height: 96%;
}

.bg-orange-content {
	font-size: 40px;
	font-weight: bold;
	font-family: 'Telkom123 Bold';
}

.bg-gradient-content p {
	text-align: left !important;
}

.bg-gradient-orange {
	padding: 35px 80px;
	background: linear-gradient(0deg, rgb(255 255 255 / 0) -3%, #E94F35 67%);
	height: 100%;
	width: 70%;
	margin: 0 auto;
}

/*//swiftnet*/












/*************/
.blue-intro {
	background: linear-gradient(to bottom, #00699E 80%, #FBFDFA);
	border-top: 30px solid #0086C4;
}

.telkom-head h1:after {
	background: url("../images/textures/telkom-texture.png") no-repeat center;
	background-size: contain;
}

.telkom-focus:before {
	background: #00699E;
}

.telkom-dblue-border {
	border: 1px solid #0083C2;
}

.telkom-lblue-border {
	border: 1px solid #00B5EF;
}

ul.line-list-blue li {
	border-bottom: 1px solid #0083C2;
}

ul.line-list-blue:before {
	background: #00699E;
}

ul.line-list-lblue li {
	border-bottom: 1px solid #00B5EF;
}

.red-intro {
	background: linear-gradient(to bottom, #CC0809 80%, #FBFDFA);
	border-top: 30px solid #E3262D;
}

.bcx-head h1:after {
	background: url(../images/textures/bcx-texture.png) no-repeat center;
	background-size: contain;
}

.bcx-red-border {
	border: 1px solid #CC0809;
}

.bcx-lred-border {
	border: 1px solid #E1525C;
}

.switch-lred {
	color: #E1525C !important;
}

ul.line-list-red li {
	border-bottom: 1px solid #E1525C
}

ul.list-red:before {
	background: #CC0809
}

.bcx-focus:before {
	background: #CC0809;
}

.swift-head h1:after {
	background: url("../images/textures/swiftnet-texture.png") no-repeat center;
	background-size: contain;
}

.swiftnet-focus:before {
	background: #F15B40;
	height: 76%;
}

/*.swiftnet-focus p{border-right: 1px solid #F15B40;}*/
ul.line-list-orange li {
	border-bottom: 1px solid #F15B40
}

ul.line-list-orange:before {
	background: #F15B40
}

.swiftnet-border {
	border: 1px solid #F15B40;
}

.swift-p-border {
	border: 1px solid #121740;
}

.purple-intro {
	background: linear-gradient(to bottom, #020313 80%, #FBFDFA);
	border-top: 30px solid #151942;
}

.graph-list {
	padding-left: 0;
	margin-top: 10px;
}

.graph-list li {
	list-style: none;
	float: left;
	width: 20.7%;
	border-right: 1px solid #FFF;
}

.show-par {
	display: none;
}

.bcx-focus div {
	padding-right: 10px
}

.pull-tbl {
	margin-left: -110px
}

.switch-brown {
	color: #692C21 !important
}

.border-brown {
	border: 1px solid #692C21
}

.gyro-head h1:after {
	background: url("../images/textures/gyro-texture.png") no-repeat center;
	background-size: contain;
}

ul.line-list-brown li {
	border-bottom: 1px solid #692C21
}

.orange-intro {
	background: linear-gradient(to bottom, #ED4A0F 80%, #FBFDFA);
	border-top: 30px solid #F37324;
}

ul.gyro-num-circle {
	margin-top: 100px;
}

ul.gyro-num-circle li {
	float: left;
	list-style-type: none;
	cursor: pointer;
	margin: 0 0 0 1px;
	padding: 12px 15px;
	text-decoration: none;
	color: #003068;
	width: 9%;
	margin-right: 50px;
	border-radius: 50%;
	aspect-ratio: 1/1;
	margin-bottom: 50px;
	text-align: center;
	font-weight: bold;
	position: relative;
}

ul.gyro-num-circle li:before {
	position: absolute;
	content: '';
	top: -23px;
	left: 50%;
	transform: translateX(-50%);
	border-right: 2px solid #5F757F;
	height: 32px;
}

.number-circle-gyro {
	border-radius: 50%;
	color: #fff;
	padding: 5px;
	position: absolute;
	top: -80px;
	left: 50%;
	transform: translateX(-50%);
	width: 65px;
	height: 65px;
	aspect-ratio: 1/1;
	font-size: 14px;
	padding: 17px;
}

.gyro-circle1 {
	border: 2px solid #692C21;
	color: #692C21;
}

.gyro-circle2 {
	border: 2px solid #F36F21;
	padding: 10px;
	color: #F36F21;
}

.gyro-circle3 {
	border: 2px solid #E49C83;
	color: #E49C83;
}

.gyro-circle4 {
	border: 2px solid #97AFB6;
	color: #97AFB6;
}

.switch-bg-brown {
	background: #692C21;
}

.switch-bg-lgrey {
	background: #97AFB6;
}

.switch-bg-lorange {
	background: #E49C83;
}

ul.gyro-num-circle li span {
	top: 50%;
	position: absolute;
	left: 50%;
	font-size: 14px;
	transform: translate(-50%, -50%);
}

.hide-br {
	display: none;
}

.principle-contain {
	position: relative;
	min-height: 50px;
}

.principle-contain p {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.border-greyL {
	border-left: 1px solid #939598
}

.border-blueL {
	border-left: 1px solid #0083C2
}

.show-res {
	display: none
}

.key-focus-block div {
	position: absolute;
	bottom: 0;
	padding-right: 15px;
	text-align: right;
	border-right: 1px solid;
}

.list-no-style {
	padding-left: 0;
}

.list-no-style li {
	list-style: none;
	font-weight: 600;
	margin-bottom: 10px;
	line-height: 1;
	font-size: 16px;
}

.show-br {
	display: none
}

.swiftnet-focus .list-no-style li {
	line-height: 1.2
}

/*************/




/*natural-capital*/


.climate-tbl section {

	border-bottom: 1px solid #939598;
	border-right: 1px solid #0083C2;
	height: 100%
}

.climate-tbl .remove-borderR {
	border-right: 0
}


.climate-tbl .content {
	padding: 15px 15px 0 15px;
}

.climate-tbl .heading {
	padding: 5px 15px 5px 15px;
	border-top: 1px solid #0083C2;
	border-bottom: 1px solid #0083C2;
	background: #DFE8EA;
	display: block;
	width: 100%;
	min-height: auto;
}

.img-links {
	float: left;
	width: auto;
	margin-right: 10px;
	margin-bottom: 5px;
}


.foot-print {
	float: right;
}


.margin-60T {
	margin-top: 60px;
}

.key-definitions-height {
	height: 100%
}

/**/




.emissions-img1 {
	display: block;
	width: 75%;
	margin: 0 auto;
	border: 1px solid #fff;
}

.emissions-img2 {
	display: block;
	width: 75%;
	margin: 0 auto;
	border: 1px solid #fff;
}

.water-consumption-cont img.water-img {
	float: unset;
	width: unset;
	margin: 0 0 15px 0 !important;
}

.waste-cont img.waste-img {
	float: right;
	margin: 0 0 0px 15px;
}

.enviro-goals {
	background: #fff;
}

.enviro-goals .heading {
	min-height: 60px;
}

.enviro-goals .disappear {
	display: none
}

.enviro-goals .content {
	padding: 15px 15px 15px 15px;
}

.emissions-projections {
	background: #CFDEE1;
	display: inline-block;
}

.task-force-bg {
	background: #DBF1FC;
	padding: 30px;
	padding-top: 20px;
}



.telkoms-impactImg {
	float: right
}












/*end natural-capital*/





/** key gov styles start*/

.legend-number-key {
	width: 25px;
	aspect-ratio: 1/1;
	background: #A9C4CB;
	position: relative;
	display: inline-block;
	margin: 0px 5px;
	border-radius: 50%;
	position: relative;
	bottom: -3px
}

.legend-number-key span {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	font-weight: bold
}

.caption .legend-number-key {
	width: 20px;
	margin: 0px 0px;
}

.caption .legend-number-key span {
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.bg-td-blue {
	background: #E1F4FD
}

.bg-h-blue {
	background: #DFE8EA
}

.committee-container {
	position: relative;
	cursor: pointer;
	margin-top: 40px;
}

.committee-container::after {
	content: "";
	display: block;
	position: absolute;
	height: 90%;
	bottom: 0px;
	width: 60%;
	z-index: 0;
	left: 0px;
	transition: 0.6s ease-in-out;
}

.committee-container:hover::after {
	width: 100%
}

.activeMember::after {
	width: 100%
}

.audit-committee:after {
	background: rgb(151, 209, 242);
	background: linear-gradient(180deg, rgba(151, 209, 242, 1) 22%, rgba(255, 255, 255, 0.053658963585434205) 56%);
}

.risk-committee:after {
	background: rgb(161, 171, 178);
	background: linear-gradient(180deg, rgba(161, 171, 178, 1) 22%, rgba(255, 255, 255, 0.053658963585434205) 56%);
}

.remuneration-committee:after {
	background: rgb(73, 89, 101);
	background: linear-gradient(180deg, rgba(73, 89, 101, 1) 22%, rgba(255, 255, 255, 0.053658963585434205) 56%);
}

.nominations-committee:after {
	background: rgb(0, 91, 148);
	background: linear-gradient(180deg, rgba(0, 91, 148, 1) 22%, rgba(255, 255, 255, 0.053658963585434205) 56%);
}

.investment-and-transactions-committee:after {
	background: rgb(0, 131, 194);
	background: linear-gradient(180deg, rgba(0, 131, 194, 1) 22%, rgba(255, 255, 255, 0.053658963585434205) 56%);
}


.social-and-ethics-committee:after {
	background: rgb(169, 195, 203);
	background: linear-gradient(180deg, rgba(169, 195, 203, 1) 22%, rgba(255, 255, 255, 0.053658963585434205) 56%);
}

.committee-container img {
	position: relative;
	z-index: 1;
}

.committee-member-name {
	position: relative;
	height: 100%;
}

.committee-member-name::after {
	content: "";
	display: block;
	height: 100%;
	width: 100%;
	background: #A9C3CB;
	position: absolute;
	top: 0px;
	left: 0px;
	opacity: 0.5;
	z-index: 2;
}

.committee-member-name-content {
	position: relative;
	z-index: 3;
	height: 100%;
}

.committee-member-name-content .intro {
	position: absolute;
	top: 14%;
	left: 0;
	padding-left: 10px;
}

.committee-member-name-content .member-name {
	color: #FFF;
	font-weight: 800;
	position: absolute;
	bottom: 0%;
	display: block;
	left: 0;
	height: auto;
	background: rgba(143, 176, 188, 0.5);
	margin-bottom: 0px;
	width: 100%;
	padding: 5% 0px 0px 10px;
}



.committee-member-name-content .member-name::after {
	font-family: 'icomoon';
	content: "\e93a";
	color: #000;
	position: absolute;
	top: 50%;
	right: 10%;
	transform: translateY(-50%);
	transition: 0.6s ease-in-out;
}

.activeMember .committee-member-name-content .member-name::after {
	transform: translateY(-50%) rotate(-180deg);
	color: #FFF;
}

.list-blue li .list li::before {
	border-bottom-color: #000;
}

.committee-member-name-content .member-name .member-position {
	color: #000;
	font-weight: 500;
	display: block;
	margin-bottom: 10px;
}

.committee-information-block {
	display: none;
	background-color: rgba(143, 176, 188, 0.5);
	padding: 20px
}



/*end key gov styles */


/* Mr H */
.opacity-50 {
	opacity: .9 !important;
}

.floatLeftBlock {
	position: relative;
	left: -50px
}

.floatLeftBlock-list {
	list-style: none;
}

.floatLeftBlock-list li {
	font-family: 'Telkom123 Bold', 'Calibri', Arial, Helvetica, sans-serif;
	text-align: center;
	position: relative;
}

.floatLeftBlock-list li img {
	position: absolute;
	left: 50%;
	display: block;
}

.social-bg {
	background-image: url(../images/page-bacgrounds/social-and-ethics-committee-report.jpg);
	background-size: cover;
	background-position: center;
}

.report-boundary-and-approval {
	background-image: url(../images/page-bacgrounds/side-view-man-home-using-tablet.jpg);
	background-size: cover;
	background-position: center;
}

.developing-skills {
	background-image: url(../images/page-bacgrounds/pg16.png);
	background-size: cover;
	background-position: center;
}



/*Managing our business with integrity */

.ethicsTbl {
	font-size: 15px
}

.border-blue-thin {
	border-top: 1px solid #0083C2
}

.ethicsTbl .title,
ethicsTbl .content {
	border-bottom: 1px solid #939598;
}

.ethicsTbl .title {
	color: #0083C2;
	background: #DFE8EA;
	padding: 10px;
	height: 100%;
}

.ethicsTbl .content {
	padding: 10px;
	height: 100%;
}

.ethicsTbl .border-1 {
	border-left: 7px solid #0083C2;
}

.ethicsTbl .border-2 {
	border-left: 7px solid #49C7ED;
}

.ethicsTbl .border-3 {
	border-left: 7px solid #00B5EF;
}

.ethicsTbl .border-4 {
	border-left: 7px solid #004F9D;
}

.ethicsTbl .border-5 {
	border-left: 7px solid #0D2C6C;
}

.ethicsTbl .border-6 {
	border-left: 7px solid #485865;
}

.ethicsTbl .border-7 {
	border-left: 7px solid #A1ABB2;
}


/*surveyTbl*/
.surveyTbl strong.header {
	padding: 20px;
	padding-left: 15px;
	border-top: 1px solid #0083C2;
	border-bottom: 1px solid #0083C2;
	color: #0083C2;
	display: block;
}

.surveyTbl .bglightblue {
	background: #DFE8EA;
}

.surveyTbl .body-header {
	display: none !important
}

.surveyTbl .content {
	height: 100%;
	padding: 20px;
	padding-left: 15px;
	padding-top: 10px;
}

.surveyTbl .column1 {
	border-bottom: 1px solid #939598;
	color: #0083C2;
	font-family: 'Telkom123 Bold';
}

.surveyTbl .column2 {
	border-left: 1px solid #0083C2;
	border-bottom: 1px solid #939598;
}

.surveyTbl .column3 {
	border-left: 1px solid #0083C2;
	border-bottom: 1px solid #939598;
	color: #939598;
	font-family: 'Telkom123 Bold';
}

.surveyTbl .column3 strong {
	display: block;
	margin-bottom: 26px;
}

.surveyTbl .column3 strong.add-mrg {
	margin-bottom: 51px;
}

/*surveyTbl*/
.ketSurveyTbl strong.header {
	color: #004F9D
}

.ketSurveyTbl .column1 {
	color: #004F9D
}

.ethical-culture {
	float: right;
	padding: 0 20px;
	height: 550px;
}

@media screen and (max-width: 991px) {
	.surveyTbl .top-header {
		display: none !important
	}

	.surveyTbl .body-header {
		display: block !important
	}

	.surveyTbl .header-white {
		background: #fff
	}

}

@media screen and (max-width: 1575px) {
	.surveyTbl strong.header {
		min-height: 90px;
	}

	.blue-thick-lines p {
		font-size: 16px;
		margin-bottom: 0;
		margin-top: 15px;
	}
	.blue-thick-lines {
		border-top: 4px solid #1D1E3F;
		border-bottom: 4px solid #1D1E3F;
		display: flex;
		justify-content: space-between;
		padding: 5px 10px;
		margin-top: 76px;
	}
}

@media screen and (max-width: 500px) {

	.ethical-culture {
		display: block;
		margin: 0 auto;
		height: unset;
		float: unset;
	}
}

/*end Managing our business with integrity */







/*from style guide*/
.chair-crc {
	width: 100%;
	border-radius: 50%;
	aspect-ratio: 1/1;
	background: #96D1F2;
	position: relative;
}

.chair-crc:before {
	content: "";
	width: 2px;
	height: 55px;
	position: absolute;
	bottom: -35px;
	background: #004F9D;
	left: 50%;
	transform: translateX(-50%);
}

.chair-crc:after {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #004F9D;
	position: absolute;
	bottom: -35px;
	left: 50%;
	transform: translateX(-50%);
}

.chair-crc-txt {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	color: #004F9C;
	text-align: center;
	width: 75%;
}

.chair-crc-txt p {
	text-align: center;
	font-family: 'Telkom123 Bold';
	font-size: 16px;
	color: #004F9C;
	margin-bottom: 20px;
	margin-top: 0;
}



.snapshot-purpose-circle-two {
	width: 35%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	position: relative;
	left: 23%;
	margin-bottom: 15px;
	text-align: center;
}

.snapshot-seam-circle-two {
	width: 80%;
	aspect-ratio: 1/1;
	border-radius: 50%;
	text-align: center;
	position: relative;
	margin-bottom: 25px;
}

.snapshot-seam-circle-two span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	color: #fff;
	width: 70%;
}

.our-vision-content {
	margin-top: 35px;
	position: relative;
}

.lrg-num {
	font-family: 'Telkom123 Bold', 'Calibri', Arial, Helvetica, sans-serif;
	font-size: 45px;
	color: #004F9D;
	font-weight: 600;
	line-height: 1.2;
	text-align: left;
}

.highlghts {
	padding: 10px 10px 20px 30px;
}




.switch-blue {
	color: #005B94
}

.switch-Lblue {
	color: #0083C2
}

.switch-skyblue {
	color: #00B5EF
}

.switch-brown {
	color: #6D6E71
}

.switch-Dblue {
	color: #003E6A
}

.border-Lblue {
	border: 2px solid #0083C2 !important
}

.border-skyblue {
	border: 2px solid #00B5EF !important
}

.border-brown {
	border: 2px solid #6D6E71 !important
}

.border-Dblue {
	border: 2px solid #003E6A !important
}

.analysis-grey-bg {
	background: linear-gradient(to bottom, #D7E2E5 0%, #B8CDD3 40%) !important;
	padding: 15px
}

.tbl-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: #13A538;
}

.ceo-block2 {
	background: linear-gradient(0deg, rgba(247, 247, 247, 1) 16%, rgba(0, 127, 188, 1) 100%);
	padding: 50px;
	height: 100%;
}

.ceo-img2 {
	background: -webkit-linear-gradient(180deg, #fff0 10%, #EDEDED 50%), url(images/gceo-img.jpg);
	background-repeat: no-repeat;
	background-position: right;
	height: 100%;
	background-size: cover;
	position: relative
}

.cfo-img {
	background: -webkit-linear-gradient(180deg, #fff0 10%, #EDEDED 63%), url("images/cfo-img.jpg");
	background-repeat: no-repeat;
	background-position: right;
	height: 100%;
	background-size: cover;
	position: relative
}

.ceo-img2 img {
	position: absolute;
	bottom: 0;
	left: -130px
}


.number-one {
	background: #005B94;
	border-radius: 50%;
	color: #fff;
	position: absolute;
	top: -33px;
	left: -4%;
	width: 35px;
	z-index: 9;
	display: block;
	aspect-ratio: 1/1;
}

.number-one1 {
	background: #005B94;
	border-radius: 50%;
	color: #fff;
	position: absolute;
	top: -33px;
	left: -4%;
	width: 35px;
	z-index: 9;
	display: block;
	aspect-ratio: 1/1;
}

.number-three {
	background: #005B94;
	border-radius: 50%;
	color: #fff;
	position: absolute;
	top: -33px;
	left: -2%;
	width: 35px;
	z-index: 9;
	display: block;
	aspect-ratio: 1/1;
}

.number-two {
	background: #005B94;
	border-radius: 50%;
	color: #fff;
	position: absolute;
	top: -17px;
	left: -2%;
	width: 35px;
	z-index: 9;
	display: block;
	aspect-ratio: 1/1;
}

.number-two span,
.number-one span,
.number-three span {
	font-size: 18px;
	padding: 12px;
}

.number-one1 span {
	font-size: 18px;
	padding: 4px;
}

.bg-Lblue {
	background: #0083C2 !important
}

.bg-skyblue {
	background: #00B5EF !important
}

.bg-brown {
	background: #6D6E71 !important
}

.bg-Dblue {
	background: #003E6A !important
}



/*consumer*/
.group-kpi-blocks .coloum-bcx-2 {height: 100%; position: relative;padding-top: 20px;}
.group-kpi-blocks .coloum-bcx-2 .bcx-huge-num {font-size: 24px;}
.coloum-bcx-2-altered{margin-top: 0!important;}
.group-kpi-blocks .coloum-bcx-2::before {
content: "";
position: absolute;	
height: 90%;
width: 1px;
right: 0;
top: 5%;
border-right: 1px solid #fff;	
}	


.group-kpi-blocks .column-bcx-new {height: 100%; position: relative;padding-top: 20px;}
.group-kpi-blocks .column-bcx-new .bcx-huge-num {font-size: 24px;}
.group-kpi-blocks .column-bcx-new::after {
content: "";
position: absolute;	
height: 90%;
width: 1px;
right: 0;
top: 5%;
border-right: 1px solid #fff;	
}	


.group-kpi-blocks .column-bcx-open {height: 100%; position: relative; padding-top: 20px; margin-top: 0!important}
.group-kpi-blocks .column-bcx-open .bcx-huge-num {font-size: 24px;}
.group-kpi-blocks .column-bcx-open::before {
content: "";
position: absolute;	
height: 90%;
width: 1px;
right: 0;
top: 5%;
border-right: 1px solid #fff;	
}	






.monetisation-grouped-arrow .bcx-inner-left{margin-left: 22px!important;
margin-top: 30px!important;}

.group-kpi-blocks .monetisation-grouped-arrow .bcx-huge-num{margin-left: 0;
text-align: center!important;}	


/*consumer*/
	

@media screen and (max-width: 1560px) {
	ul.tabs li {
		width: 14%;
	}

}

@media screen and (max-width: 1440px) {
	ul.tabs {
		max-width: 100%;
	}

	ul.tabs li {
		width: 15%;
	}

}

@media screen and (max-width: 1366px) {
	ul.tabs li {
		margin-right: 40px;
	}

	/*ul.tabs li span { top: 22%;}*/
}

@media screen and (max-width: 1080px) {
	.tabs {
		display: none;
	}

	.tab-drawer-heading {
		background: #0083C2;
		color: #fff;
		border-top: 1px solid #fff;
		margin: 0;
		padding: .5em;
		display: block;
		cursor: pointer;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}

	.d-active {
		background-color: #005B94;
		color: #fff;
	}

	.tab-drawer-heading:before {
		float: right;
		content: '+';
		speak: none;
		padding-right: .25em
	}

	.d-active:before {
		float: right;
		content: '-';
		speak: none;
		padding-right: .25em
	}

	.ceo-img2 img {
		position: relative;
		left: auto;
		margin: 0 auto;
		display: block;
		text-align: center;
		margin-top: 25px
	}


	.number-one {
		top: -8px;
		left: -10%;
	}

	.number-one1 {
		display: none;
	}

	.number-three {
		display: none;
	}

	.number-one {
		display: none;
	}
}


@media screen and (max-width: 991px) {}


/*from style guide end*/













@media screen and (max-width: 2561px) {
	.snapshot-purpose-circle-line:before {
		bottom: -45%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -69vh;
	}

	.our-values-and-culture-circ {
		left: 0%;
	}
}



@media screen and (max-width: 2560px) {
	.snapshot-purpose-circ-line:after {
		bottom: -69vh;
	}

	.our-values-and-culture-circ {
		left: 0%;
	}
}

@media screen and (max-width: 1917px) {
	.snapshot-purpose-circ-line:after {
		bottom: -73vh;
	}
}

@media screen and (max-width: 1720px) {
	.snapshot-purpose-circle-line:after {
		top: 74%;
		height: 75px;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -50%;
	}

	.snapshot-purpose-circle-two span {
		top: 31%;
		font-size: 15px;
	}

	.snapshot-purpose-circle span span {
		top: 31%;
		font-size: 15px;
	}

	.snapshot-purpose-circ-line:before {
		top: 75%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -73vh;
	}
}

@media screen and (max-width: 1699px) {
	.snapshot-purpose-circle-line:before {
		bottom: -50%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -72vh;
	}

	.alphabet-one {
		font-size: 45px;
	}

	.our-values-and-culture-circ span {
		font-size: 16px;
	}

	.our-vision-content:after {
		top: -17%;
		height: 47px;
	}
}


@media screen and (max-width: 1650px) {
	.show-par {
		display: block;
	}

	.adjust-par {
		display: none
	}
}


@media screen and (max-width: 1607px) {
	.swiftnet-focus div {
		padding-right: 10px;
	}
}

@media screen and (max-width:1560px) {
	.stakeholdersvalue-block {
		min-height: 205px;
	}
}




@media screen and (max-width: 1510px) {
	.t-business-units .heading {
		min-height: 60px;
		height: auto;
	}

	.h2-extend {
		height: 50px
	}

}


@media screen and (max-width: 1500px) {
	.performance-snapshot-circle {
		width: 100%;
	}

	.new-w {
		width: 86%
	}

	ul.gyro-num-circle li {
		width: 11%
	}
}

@media screen and (max-width: 1590px) {

	.emissions-img1,
	.emissions-img2 {
		width: 90%;
	}
}



@media screen and (max-width: 1460px) {
	.t-business-units .header .img-section {
		padding-left: 0
	}
}

@media screen and (max-width: 1448px) {

	.emissions-img1,
	.emissions-img2 {
		width: 100%;
	}
}



@media screen and (max-width:1440px) {

	.year-block p,
	.year-info p {
		font-size: 12px;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -44%;
	}

	.snapshot-seam-circle-two {
		width: 98%;
	}

	.snapshot-purpose-circle-two {
		left: 30%;
	}

	.our-vision-content:after {
		left: 49%;
		top: -19%;
	}

	.snapshot-purpose-circle-line:after {
		height: 61px;
	}

	.our-vision-content:before {
		left: 48.8%;
		top: -8%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -84vh;
	}

	.key-focus-block div {
		padding-right: 10px;
	}

	ul.line-list-lgreen {
		padding-left: 10px;
	}
}


@media screen and (max-width: 1300px) {

	.committee-member-name-content .intro {
		font-size: 18px
	}

	.waste-cont img.waste-img {
		width: 70%;
	}

	.h2-extend {
		height: 50px
	}

}


@media screen and (max-width: 1350px) {
	.our-vision-content:before {
		top: -2%
	}

	.our-vision-content:after {
		height: 34px;
		top: -9%;
	}

	.our-values-and-culture-circ {
		width: 100%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -73vh;
	}

	.key-focus-block {
		margin-left: 33px;
	}

	.key-focus-block:before {
		left: -38px;
	}

	.performance-snapshot-circle {
		width: 130%;
	}

	.new-w {
		width: 112%
	}
}

@media screen and (max-width: 1376px) {
	.key-focus-block {
		margin-left: 34px;
	}

	.focus-text {
		font-size: 16px;
	}

	.capitals-circle:after {
		content: '';
		position: absolute;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		right: 20px;
		top: 49%;
		background: #007BBE;
		top: auto;
		bottom: -7px;
		right: 48.7%;
	}

	.capitals-circle:before {
		content: '';
		position: absolute;
		width: 1px;
		border-bottom: 1px solid #007BBE;
		right: 50%;
		height: 27px;
		top: auto;
		bottom: -33px;
		background: #007BBE;
	}
}

@media screen and (max-width:1280px) {
	.stakeholdersvalue-block {
		min-height: 235px;
	}

}

@media screen and (max-width: 1260px) {
	.bcx-focus div {
		padding-right: 10px;
	}

	.bcx-focus {
		margin-left: 22px;
	}
}

@media screen and (max-width: 1250px) {
	.pull-tbl {
		margin-left: -110px;
	}

	ul.gyro-num-circle li {
		width: 15%
	}

	.change-focus {
		margin-left: 13px;
	}

	.change-focus p {
		padding-right: 13px;
	}
}

@media screen and (max-width: 1200px) {
	.key-focus-block {
		margin-left: 0px;
	}

	.key-focus-block:before {
		display: none;
	}

	/*.capital-wrapper{width:1164px}*/
	.capital-greybg {
		padding: 35px 70px;
	}

	

}

@media screen and (max-width: 1199px) {
	.performance-snapshot-circle {
		width: 142%;
	}

	.new-w {
		width: 121%
	}

	.product-cap-heading h1:after {
		right: -50px;
		top: 52px;
	}


	.hide-br {
		display: block
	}
	
	
	.col-display{display:none}
	
	
	
}

@media screen and (max-width: 1150px) {
	.performance-snapshot-circle span {
		font-size: 14px;
	}

	.stakeholdersvalue-box {
		padding: 33px
	}
}

@media screen and (max-width: 1110px) {
	.pull-tbl {
		margin-left: -50px;
	}
}

@media screen and (max-width: 1100px) {
	.t-business-units .header .description {
		padding-left: 30px;
	}
}


@media screen and (max-width: 1079px) {
	.change-focus {
		margin-left: 0;
	}
}

@media screen and (max-width: 1050px) {
	.left-page-icons {
		float: none;
		left: 0
	}

	.scrollable {
		overflow: auto;
	}

	.scrollable:before {
		content: '';
		position: absolute;
		bottom: 10px;
		right: 10px;
		height: 50px;
		width: 50px;
		background-size: contain;
		z-index: 2;
	}

	.scrollable.scrolledR:before {
		display: none;
	}

	.intro-med {
		font-size: 18px;
	}

	.performance-snapshot-circle {
		width: 150%;
	}

	.new-w {
		width: 127%
	}

	.performance-snapshot-circle span {
		font-size: 13px;
	}
}

@media screen and (max-width:1024px) {
	.our-vision-content:before {
		left: 30.8%;
		top: -6%;
	}

	.snapshot-purpose-circle-two {
		left: 17%;
	}

	.snapshot-seam-circle-two {
		width: 60%;
	}

	.col-run-over {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.col-run-over-two {
		flex: 0 0 100%;
		max-width: 50%;
	}

	.snapshot-purpose-circ-line:before {
		height: 492px;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -303%;
	}

	.snapshot-purpose-circle {
		width: 27%;
	}

	.snapshot-seam-circle {
		width: 60%;
	}

	.snapshot-purpose-circle-two {
		width: 29%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -28%;
	}

	.our-vision-content:after {
		left: 31%;
		top: -19%;
	}

}

@media screen and (max-width:969px) {
	.snapshot-purpose-circ-line:after {
		bottom: 0%;
	}

	.our-vision-content:before {
		top: -5%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -25%;
	}

	.responsive-space {
		margin-top: 5%;
	}
}

@media screen and (max-width: 991px) {
	.tab-switch {
		aspect-ratio: 1/.2;
		margin-bottom: 10px;
	}

	.tab-switch p {
		font-size: 12px;
	}

	.member-info {
		margin-left: 0px;
		padding-left: 0px;
		border: none
	}

	.max-width-block-member {
		max-width: none
	}

	.margin-center {
		left: 0%;
	}

	.year-info::before,
	.year-info::after {
		display: none;
	}

	.timeline-bg .row .col {
		min-width: 25% !important;
		max-width: 25%;
	}

	.year-info,
	.year-block+.year-info {
		margin: 0px;
		border-radius: 0;
		width: 67% !important;
		text-align: center;
		transform: translateX(70%);
	}

	.ceo-img img {
		position: relative;
		margin: 0 auto;
		display: block;
		text-align: center;
		margin-top: 25px;
		margin-top: 0px;
	}

	.color-table .row .col-lg-6:nth-child(even) div {
		border-right: 1px solid #0083C3
	}

	.color-table .row .col-lg-6:nth-child(even) div {
		border-right: 1px solid #0083C3
	}

	.t-business-units .heading {
		min-height: auto;
	}

	.key-focus-block div {
		right: 0;
		bottom: 16px;
	}

	.key-focus-block {
		margin-left: 0;
		margin-bottom: 30px;
	}

	.capital-snapshot-gradient-bg {
		background: linear-gradient(to bottom, #FFF 12%, #CFDDE0 25%);
		padding-left: 30px;
	}

	.performance-snapshot-circle {
		width: 65%;
	}

	ul.line-list-lgreen:before {
		display: none;
	}

	.product-cap-heading h1:after {
		display: none;
	}

	.remove-br {
		display: none
	}

	.pull-tbl {
		margin-left: 0px;
	}

	ul.gyro-num-circle li {
		width: 21%;
		margin-right: 20px;
	}

	.member-container .row,
	.member-container .row .col-lg-4,
	.member-container .row .col-lg-8 {
		height: auto;
	}

	.show-br {
		display: block
	}

	.enviro-goals .disappear {
		display: block
	}

	.t-business-units .header .description {
		padding-left: 0px;
	}

	.waste-cont img.waste-img {
		width: unset;
	}
}

@media screen and (max-width:990px) {
	.size-big-circ span {
		font-size: 15px
	}

	.our-values-and-culture-circ {
		width: 50%;
		margin-bottom: 20%;
		margin: 0 auto;
		left: 0;
	}

	.snapshot-purpose-circle {
		width: 35%;
		margin: 0 auto;
		left: 0;
	}

	.snapshot-purpose-circle-two {
		width: 35%;
		margin: 0 auto;
		left: 0;
	}

	.snapshot-seam-circle-two {
		width: 60%;
		margin: 0 auto;
		left: 0;
	}

	.snapshot-seam-circle {
		width: 60%;
		margin: 0 auto;
		left: 0;
	}

	.snapshot-purpose-circle-line:after {
		height: 80px;
		left: 49%;
		top: 70%;
	}

	.snapshot-purpose-circle-line:before {
		/*left:46%;*/
		bottom: -28%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -36%;
	}

	.snapshot-purpose-circ-line:before {
		height: 115px;
		bottom: -25%;
	}

	.our-vision-content:after {
		left: 50%;
	}

	.our-vision-content:before {
		left: 50%;
	}

	.responsive-space {
		margin-top: 25%;
	}

	p {
		text-align: left !important
	}

	.capital-greybg {
		padding: 35px 15px;
	}

	.borderrgt {
		border-right: 0px solid #0083c2;
		margin-bottom: 30px
	}
}

@media screen and (max-width:900px) {


	.valueintro-block:before {
		content: none
	}

	.valueintro-block:after {
		content: none
	}

}

@media screen and (max-width: 767px) {
	.capital-wrapper {
		width: calc(100% - 25px);
	}

	.ceo-block {
		padding-left: 22px;
	}
}

@media screen and (max-width:768px) {
	.col-run-over-two {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.snapshot-purpose-circle {
		width: 15%
	}

	.snapshot-seam-circle {
		width: 25%
	}

	.snapshot-seam-circle-two {
		width: 35%;
	}

	.snapshot-purpose-circle-two {
		width: 15%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -33%;
		left: 49%;
	}

	.snapshot-purpose-circ-line:before {
		height: 78px;
		bottom: -17%;
	}

	.snapshot-purpose-circle-line:after {
		height: 68px;
	}

	.our-vision-content:before {
		left: 49%;
		top: -2%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -17%;
	}

	.our-vision-content:before {
		left: 50.2%;
		top: -4%;
	}

	.our-vision-content:after {
		height: 47px;
	}

	.snapshot-seam-circle-two {
		width: 44%;
	}

	.snapshot-sm-circle-two {
		width: 34%;
	}

	.our-values-and-culture-circ {
		width: 28%;
	}

	.responsive-space {
		margin-top: 8%;
	}

	.respond-lead-space {
		margin-top: 8%;
	}

	.t-business-units .header::before {
		height: 392px
	}

	.t-business-units .header::before {
		right: 0;
	}

	.t-business-units .img-section-cont::before {
		left: 0;
		width: 100%;
	}

	.units-wrapper {
		width: calc(100% - 25px);
	}

	.t-business-units::before {
		content: unset
	}

	.t-business-units::after {
		content: unset
	}

	.graph-list li {
		width: 35.2%;
	}

	ul.gyro-num-circle li {
		width: 24%;
		margin-right: 3px;
	}

	.remove-res {
		display: none
	}

	.show-res {
		display: block
	}

	.remove-fr {
		border-right: none !important
	}

	.border-greyL {
		border-left: none !important
	}

	.units-wrapper h3 {
		margin-left: 0
	}

	h1.indent {
		margin-left: 0
	}

	.waste-cont img.waste-img {
		float: unset;
		margin-bottom: 15px;
		margin-left: 0
	}
}


@media screen and (max-width:700px) {
	.col-run-over-two {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.snapshot-purpose-circle {
		width: 35%
	}

	.snapshot-seam-circle {
		width: 50%
	}

	.snapshot-seam-circle-two {
		width: 60%;
	}

	.snapshot-purpose-circle-two {
		width: 35%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -19%;
		left: 49%;
	}

	.snapshot-purpose-circ-line:before {
		height: 53px;
		bottom: -17%;
	}

	.snapshot-purpose-circle-line:after {
		height: 68px;
	}

	.our-vision-content:before {
		left: 49%;
		top: -2%;
	}

	.our-vision-content:before {
		left: 50%;
		top: -6%;
	}

	.our-vision-content:after {
		height: 47px;
	}

	.size-big-circ span {
		font-size: 17px;
	}

	.snapshot-seam-circle-two {
		width: 44%;
	}

	.snapshot-sm-circle-two {
		width: 60%;
	}

	.our-values-and-culture-circ {
		width: 50%;
	}

	.responsive-space {
		margin-top: 8%;
	}

	.respond-lead-space {
		margin-top: 8%;
	}
}

@media screen and (max-width: 576px) {
	.ceo-img img {
		left: initial;
	}

	ul.gyro-num-circle li {
		width: 35%;
		margin-right: 50px;
	}

	.push-dwn50 {
		margin-top: 50px !important;
	}
}

@media screen and (max-width: 575px) {

	.committee-container img {
		margin: 0 auto;
		display: block
	}

	.committee-member-name-content {
		padding: 10px 0px;
	}

	.committee-member-name-content .intro {
		position: relative;
		top: 0px;
		margin-bottom: 10px;
		padding-left: 20px
	}

	.committee-member-name-content .member-name {
		background: transparent;
		position: relative;
		padding: 0% 20px;
		height: auto;
	}

	.committee-container:after {
		width: 100%
	}

	.tab-switch {
		aspect-ratio: 1/.1;
	}

	.timeline-bg .row .col {
		min-width: 100% !important;
		max-width: 100%;
		margin-bottom: 10px;
	}

	.year-block {
		background: #0083C2 !important;
	}

	.year-info {
		aspect-ratio: 1/0.4;
	}

	#year-2010 .year-info {
		background-color: #49C7ED;
	}

	#year-2020 .year-info {
		background-color: #49C7ED;
	}


	.year-info.w-0 {
		display: none;
	}

	.t-business-units .header .description {
		padding-top: 0;
	}

	.size-big-circ span {
		font-size: 15px
	}

	.performance-snapshot-circle {
		width: 35%;
		margin: 0 auto;
		margin-bottom: 43px;
	}

	.performance-snapshot-circle-inv {
		float: none;
		margin-top: 20px
	}
}









@media screen and (max-width: 1440px)
{
	.S1440-50 {flex: 0 0 auto; max-width: 50%;}
	.S1440-100 {flex: 0 0 auto;max-width: 100%;}
	.chair-green-bord .bigger-txt { font-size: 18px !important;}
	.chair-crc-txt p {font-size: 14px;}
	.chair-blue-bord .bigger-txt { font-size: 18px !important;}
	
	.capital-h1 h1{font-size:25px}
	
	
	
	
	
}




@media screen and (max-width: 1380px)
{
	.S1350-25 {    flex: 0 0 auto;     max-width: 25%;}
	.S1350-75 {    flex: 0 0 auto;     max-width: 75%;}
	
	.S1350-30 {    flex: 0 0 auto;     max-width:30%;}
	
	.S1350-100 {    flex: 0 0 auto;     max-width:100%;}
	
}






@media screen and (max-width: 1330px)
{
	.S1330-50 {    flex: 0 0 auto;     max-width: 50%;}
	.S1330-100 {    flex: 0 0 auto;     max-width: 100%;}
	
}

@media screen and (max-width: 1280px)
{

	.S1280-50 {    flex: 0 0 auto;     max-width: 50%;}
	.S1280-100 {   flex: 0 0 auto;     max-width: 100%;}
}



@media screen and (max-width: 1200px)
{

	.S1200-58 {    flex: 0 0 auto;     max-width: 58%;}
	.S1200-41 {   flex: 0 0 auto;     max-width: 41%;}
	
	.S1350-25 {    flex: 0 0 auto;     max-width: 100%;}
	.S1350-75 {    flex: 0 0 auto;     max-width: 100%;}
	
	.S1350-30 {    flex: 0 0 auto;     max-width:100%;}
	
	
	.swift-block-bottom .coloum-bcx {min-height: 220px !important;}
	
}







@media screen and (max-width: 1000px)
{
	.S1000-100 {    flex: 0 0 auto;     max-width: 100%;}
	/*.S1000-75 {    flex: 0 0 auto;     max-width: 100%;}*/
	
}






@media screen and (max-width: 680px)
{
	
.S680-50 {    flex: 0 0 auto;     max-width: 50%;}
.S680-100 {    flex: 0 0 auto;     max-width: 100%;}


}


@media screen and (max-width: 480px)
{
	
.S680-50 {    flex: 0 0 auto;     max-width: 100%;}	
.S480-50 {    flex: 0 0 auto;     max-width: 50%;}
.S480-100 {    flex: 0 0 auto;     max-width: 100%;}

}






@media screen and (max-width: 991px)
{

	.S1200-58 {    flex: 0 0 auto;     max-width: 100%;}
	.S1200-41 {   flex: 0 0 auto;     max-width: 100%;}
	
	.security-bg-white { margin-top: 20px !important;}
}
















@media screen and (max-width: 530px) {
	.telkoms-impactImg {
		float: unset;
		display: block;
		margin: 0 auto;
		width: 70%;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	.add-mrg-t {
		margin-top: 20px;
	}



}


@media screen and (max-width:500px) {
	.col-run-over-two {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.snapshot-purpose-circle {
		width: 35%
	}

	.snapshot-seam-circle {
		width: 50%
	}

	.snapshot-seam-circle-two {
		width: 60%;
	}

	.snapshot-purpose-circle-two {
		width: 35%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -19%;
		left: 49%;
	}

	.snapshot-purpose-circ-line:before {
		height: 53px;
		bottom: -17%;
	}

	.snapshot-purpose-circle-line:after {
		height: 68px;
	}

	.our-vision-content:before {
		left: 49%;
		top: -2%;
	}

	.our-vision-content:before {
		left: 50%;
		top: -6%;
	}

	.our-vision-content:after {
		height: 47px;
	}

	.snapshot-seam-circle-two {
		width: 44%;
	}

	.snapshot-sm-circle-two {
		width: 60%;
	}

	/*.our-values-and-culture-circ{width: 28%;}*/
	.responsive-space {
		margin-top: 8%;
	}

	.respond-lead-space {
		margin-top: 8%;
	}
}

@media screen and (max-width: 497px) {
	.key-focus-block {
		text-align: center;
		padding-top: 0;
	}

	.key-focus-block div {
		position: unset;
		text-align: center;
		margin-top: 30px;
		padding-right: 0;
		border: none;
	}

	.key-focus-block div p {
		text-align: center;
	}
}

@media screen and (max-width: 473px) {
	.foot-print {
		float: unset;
		display: block;
		margin: 0 auto;
		margin-left: auto !important;
		margin-right: auto !important;
		margin-bottom: 20px;
	}
}


@media screen and (max-width: 425px) {
	.switch-green-intro {
		padding: 30px 20px;
	}

	.our-vision-content:before {
		left: 50.2%;
	}

	.snapshot-purpose-circle {
		width: 35%;
	}

	.snapshot-purpose-circle-two {
		width: 40%;
	}

	.snapshot-seam-circle {
		width: 47%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -11%;
		left: 49%;
	}

	.snapshot-purpose-circ-line:before {
		height: 78px;
		bottom: -17%;
	}

	.snapshot-purpose-circle-line:after {
		height: 54px;
	}

	.our-vision-content:before {
		left: 50%;
		top: -7%;
	}

	.snapshot-seam-circle-two {
		width: 68%;
	}


	.graph-list li {
		width: 100%;
		margin-bottom: 10px;
		text-align: center;
	}
}

@media screen and (max-width: 402px) {
	ul.gyro-num-circle li {
		width: 45%;
		margin-right: 12px;
	}
}

@media screen and (max-width: 375px) {
	.product-cap-heading h1:after {
		display: none;
	}

	.snapshot-seam-circle-two {
		width: 80%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -17%;
	}

	.telkoms-impactImg {
		width: 100%
	}

	.h2-extend {
		height: 60px;
	}

}



@media screen and (max-width:320px) {
	.snapshot-purpose-circle {
		width: 40%;
	}

	.snapshot-purpose-circ-line:before {
		height: 57px;
	}

	.snapshot-purpose-circle-line:after {
		height: 54px;
	}

	.our-vision-content:before {
		top: -7%;
	}

	.snapshot-seam-circle-two {
		width: 95%;
	}

	.our-values-and-culture-circ {
		width: 58%;
	}

	.snapshot-seam-circle {
		width: 64%;
	}

	.snapshot-purpose-circle-line:before {
		bottom: -20%;
	}

	.snapshot-purpose-circ-line:after {
		bottom: -17%;
	}
}

/* =======NEW STYLES ADDED============ */
.home-banner-holder {
	width: 100%;
	min-height: 100%;
	background: url("../images/telkom-snapshot-banner.png");
	background-size: cover;
	/* padding-left: 85px; */
	overflow: hidden;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: 0px 48px;
	margin-bottom: 50px;
}

.index-banner-block {
	width: 100%;
	min-height: 90vh;
	background: url("../images/integrated-report-home.jpg");
	background-size: cover;
	padding-left: 85px;
	overflow: hidden;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: 0px 48px;
}

.section-banner-box {
	margin-top: 45px;
	width: 100%;
	line-height: 1;
	padding-top: 30px;
	margin-left: 85px;
	min-height: 100%;
	position: relative;
	padding: 15px;
	/* text-align: center; */
	background: linear-gradient(0deg, rgb(255 255 255 / 0) -45%, #0065a7 32%);
	padding-bottom: 30px;
	margin-right: 50px;
}

.section-banner-box::before {
	content: "";
	position: absolute;
	width: 100%;
	border-top: 2px solid #fff;
	left: 0;

}

.section-banner-box::after {
	content: "";
	position: absolute;
	width: 100%;
	border-bottom: 2px solid #fff;
	left: 0;

}

.report-type {
	padding: 0 0;
	font-size: 35px;
	color: #fff;
	position: relative;
	padding-top: 24px;
	font-weight: 700 !important;
	padding-left: 120px;
}

.line-left-white {
	border-left: 2px solid #fff;
}

.the-year {
	padding: 0 0;
	font-size: 16px;
	color: #fff;
	position: relative;
	/* padding-top: 24px; */
	font-weight: 500 !important;
	padding-left: 120px;
}

.banner-top-space {
	margin-top: 45%;
}

.right-banner-head {
	width: 100%;
	line-height: 1;
	padding-top: 30px;
	min-height: 100%;
	position: relative;
	padding-left: 120px;
	background: linear-gradient(0deg, rgb(255 255 255 / 0) 7%, #0065a7 75%);
	padding-bottom: 30px;
	margin-right: 50px;
}

.right-banner-head a {
	text-decoration: none;
}