/* colours


Text:

Dark (main) yellow: #ffcc00
Light yellow: #ffe05c


https://www.mtn.com/investors/shareholders/sens/category-sens/?sens_year=2019

*/

body {
	margin: 0px;
}

.wrapper {
	width: 100%;
	max-width: 1122px;
	position: relative;
	background-color: -yellow;
	height: 100%;
	margin: 0 auto;
}


#sens_blocks {
	width: 540px;
	background-color: -green;
	position: relative;
	margin: 3px 6px 9px 6px;
	border: 0px solid #6b6b6b ;
	border-radius: 15px ;
	-moz-border-radius: 15px ;
	-webkit-border-radius: 15px ;

   box-shadow:         0px 5px 10px #cccccc;
   -moz-box-shadow:    0px 5px 10px #cccccc;
   -webkit-box-shadow: 0px 5px 10px #cccccc;
}

.left_block {
	background-color: -red;
	float: left;
}

.right_block {
	background-color: -blue;
	float: right;
}

.sens_notice {
	float: left;
	width: 70%;
	margin: 10px 0px 0px 20px;
}

.sens_date {
	float: left;
	width: 70%;
	margin: -25px 0px 10px 20px;
}

.sens_link {
	float: right;
	position: absolute;
	top: 50%;
	right: -15px;
	transform: translate(-50%, -50%);
}



td,th,p {
	font-family: 'MTNBrighterSans-light', Helvetica, sans-serif;
	font-size: 14px;
	color: #000000;
	font-weight: normal;
	text-align: left;
	line-height: 135%;
}

i	{
	font-family: 'MTNBrighterSans-lightitalic', Helvetica, sans-serif;
}

.table_right {
	text-align: right;
	padding: 6px 8px 6px 0px;
}


input[type="button"] {
	text-align: center;
	height: 60px;
	width: 60px;
	outline: none;
	border: 0px solid #999999;
	border-radius: 100px;
	cursor: hand;
	padding-left: 0px;
	padding-right: 0px;
	background: url(images/more_button.png) no-repeat right #ffcc00;
	background-position-x: calc(100% - 20px);
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
-ms-transition-duration: 0.3s;
transition-duration: 0.3s;
}

input[type="button"]:hover {
	background: url(images/more_button.png) no-repeat right #ffe05c;
	background-position-x: calc(100% - 20px);
}

input[type="button"]:active {
	background: url(images/more_button.png) no-repeat right #ffe05c;
	background-position-x: calc(100% - 20px);
   box-shadow:         0px 5px 10px #cccccc;
   -moz-box-shadow:    0px 5px 10px #cccccc;
   -webkit-box-shadow: 0px 5px 10px #cccccc;
}


.rule {
	height: 10px;
	font-size: 1px;
}

.last_rule {
	height: 10px;
	padding-top: 12px;
	font-size: 1px;
}

hr {
	color: #999999;
	background-color: #999999;
	height: 1px;
	border: 0px;
	width: 100%;
	margin: 0px;
}


a:link, a:visited {
	color: #999999;
	text-decoration: none;
}
a:hover, a:active {
	color: #000000;
	text-decoration: none;
}

.spacer_xs {
	height: 4px;
	font-size: 1px;
}

.spacer_s {
	height: 8px;
	font-size: 1px;
}

.spacer {
	height: 15px;
	font-size: 1px;
}

.spacer_l {
	height: 18px;
	font-size: 1px;
}

.spacer_xl {
	height: 25px;
	font-size: 1px;
}

/*---- SENS pop-up styles starts here ------*/

body.sens	{
	margin-top: 20px;

}


.popup_sens_head {

	font-size: 20px;
	color: #ffcc00;
	text-align: left;
	font-weight: normal;
	text-transform: uppercase;
	height: 24px;

	padding-left: 20px;
}

.popup_sens_date {
	height: 28px;

	padding-left: 20px;

	padding-bottom: 10px;
	border-bottom: solid #2a2a2a 1px;

}

.popup_sens_body {
	text-align: justify;
	line-height: 24px;
	padding-left: 20px;
	padding-right: 20px;
}

.popup_sens_left {
	padding-left: 20px;
}

.mono_type {
	padding-left: 20px;
	padding-right: 20px;
}

/*---- SENS pop-up styles starts here ------*/


/* Responsive sizes   */



@media only screen and (max-width: 1122px) {

.wrapper {
	width: 942px;
	position: relative;
	background-color: -pink;
	height: 100%;
	margin: 0 auto;
}

#sens_blocks {
	width: 450px;
	position: relative;
}



}



@media only screen and (max-width: 942px) {

.wrapper {
	width: 702px;
	position: relative;
	background-color: -green;
	height: 100%;
	margin: 0 auto;
}

#sens_blocks {
	width: 330px;
	position: relative;
}

.sens_notice, .sens_date {
	width: 50%;
}


}



@media only screen and (max-width: 702px) {


.wrapper {
	width: 100%;
	max-width: 534px;
	position: relative;
	background-color: -orange;
	height: 100%;
	margin: 0 auto;
}

#sens_blocks {
	width: calc(100% - 30px);
	position: relative;
	margin-left: 15px;
	margin-right: 15px;
}

.sens_notice, .sens_date {
	width: 80%;
}

}