.intro{font-family:'Telkom123 Light','Calibri', Arial, Helvetica, sans-serif; color:#0083C2; font-size: 24px; margin:0; font-weight: 600; line-height: 1.3; margin-bottom: 20px;}
.intro-med{font-family:'Telkom123 Light','Calibri', Arial, Helvetica, sans-serif; color:#48C7EC; font-size: 21px; margin:0; font-weight: 500; line-height: 1.4; margin-bottom: 20px;}
.intro-sml{font-family:'Telkom123 Light','Calibri', Arial, Helvetica, sans-serif; color:#0083C2; 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;}


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


.caption, .captionfin, .fincaption{font-family:'Telkom123 Light','Calibri', Arial, Helvetica, sans-serif; font-size: 11px; margin:0; font-style:italic; line-height: 1.3; }


.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 }
		.intro-med{color: #48C7EC; font-size: 21px; text-align: left;}
		.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 #A7A9AC;right: 50%;height: 43px;top: auto;bottom: -32px;background: #a7a9ac;}
.capitals-circle:after{content: '';position: absolute;width: 5px;height: 5px;border-radius: 50%; right:20px;top: 49%;background: #A7A9AC;top: auto;bottom: 9px;right: 49%;}

	.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:16px; 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:16px; 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:16px; 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 #0083C2;  left: 4px;   top: 10px;}

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


/*=TABLE STYLES
---------------*/

.fin-tbl tr:hover {background:#DFE8EA !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: #57585b;  text-align:right; padding: 3px 8px 3px 3px;  background:#DFE8EA ; 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*/

.finheader{ background:#0083C2; color: #fff; font-weight: bold;font-family: Telkom123 Bold;border-right: 1px solid #fff;border-bottom: 1px solid #939598}
.finheader-blue{ background:#0083C2; color: #fff; font-weight: bold;font-family: Telkom123 Bold;border-right: 1px solid #fff;border-bottom: 1px solid #939598}
.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}
.finrightwhite {
    border-right: 1px solid #fff;
}
.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;}
.fintop { border-top: 1px solid #0083C2}
.fintopgrey { border-top: 1px solid #939598}
.finthin { border-bottom: 1px solid #0083C2}
.finthin-blue { border-bottom: 1px solid #0083C2}
.finthinwhite{ border-bottom: 1px solid #fff}
.finthick { border-bottom: 3px solid #0083C2}
.finthickblue { border-bottom: 3px solid #0083C2}
.finthicker {border-bottom: 3px solid 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;}
.finrightblue {border-right: 1px solid #0083C2;}
.finleftblue {border-left: 1px solid #0083C2;}
.finright {border-right:1px 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;}
.finrow {border-top:1px solid #0083C2; border-bottom:1px solid #0083C2;}
.finleft {border-left:1px solid #0083C2;}
.finthingrey{ border-bottom: 1px solid #939598}
.finthindargrey{ border-bottom: 1px solid #636466}
.finthickgrey{ border-bottom: 2px solid #939598}
.finrightgrey{ border-right: 1px solid #939598}
.finleftgrey{ border-left: 1px solid #939598}
.alignlft{text-align:left!important}

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


.finthicktop { border-top: 2px solid #0083C2}
.finthickbot { border-bottom: 2px solid #0083C2}


.fintopleftblue {border-top:1px solid #0083C2; border-left:1px solid #0083C2;}
.fintoprightblue {border-top:1px solid #0083C2; border-right:1px solid #0083C2;}
.finbotleftblue {border-bottom:1px solid #0083C2; border-left:1px solid #0083C2;}
.finbotrightblue {border-bottom:1px solid #0083C2; border-right:1px solid #0083C2;}
.finleftblue {border-left:1px solid #0083C2;}
.finrightblue {border-right:1px solid #0083C2;}
.fintopblue {border-top:1px solid #0083C2;}
.finrowleftblue {border-left:1px solid #0083C2; border-top:1px solid #0083C2; border-bottom:1px solid #0083C2;}
.finrowrightblue {border-right:1px solid #0083C2; border-top:1px solid #0083C2; border-bottom:1px solid #0083C2;}
.finrowblue {border-top:1px solid #0083C2; border-bottom:1px solid #0083C2;}
.finleftwhite {border-left:1px solid #fff;}


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

/*=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: #485966!important}
	.switch-d-grey-1{color: #9FAAB2!important}
	.switch-grey{color: #939597!important}
	.switch-aq-blue{color: #95D3F3!important}
	.switch-blue{color: #0083C3!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;}
		.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-info::before { content: ""; width: 1px; height: 80px; background-color: #FFF; position: absolute; bottom: -70px; left: 50%;transform: translateX(-50%); z-index: 3; }


.year-info::after { content: ""; width: 5px; aspect-ratio: 1/1; border-radius: 50%; background-color: #FFF; position: absolute; bottom: -70px; left: 50%; transform: translateX(-50%); z-index: 3; }

.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 */





/*************/
.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 */





/*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;}
	}
	
	@media screen and (max-width: 500px){
	
		.ethical-culture {
		display: block;
		margin: 0 auto;
		height: unset;
		float: unset;
		}
	}

/*end Managing our business with integrity */





















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

@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}
}

@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: 100% }
	.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: 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%;}
}