/*
	PDF Page
	===================================================
 */
 .clearboth{ clear: both; }
 /* Main */
 #MainBlock { position: relative; overflow: hidden; ; background-size: 100% 100%; }
 /*background: url(/annual_report/2223/images/index_pdf_bg.png) no-repeat center top*/
 
 /* Logo */
 #Logo { float: left; }
 #Logo a { }
 #Logo a img { width: 255px; height: auto; }
 
 /* Title */
 #Title { text-align: right; overflow: hidden; }
 #Title .date{margin-top: 8px; font-size: 14px; color: #626262; }
 #Title img { width: 215px; }
 
 /* Main Content */
 #MainContent { clear: both; font-size: 0.9em; }
 #MainContent img { height: 1em; width: auto; }
 #MainContent h2 { padding-bottom: 25px; color: #0b4665;}
 #MainContent h2 a {color: #FFFFFF; background-color: #1977a9;border-radius: 50px; font-size: 20px; width: 353px; display: -ms-flexbox; display: flex; justify-content: space-around; padding: 5px 0; align-items: center;}
 #MainContent h3 { padding-bottom: 9px; color: #0b4665;font-size: 16px;}
 #MainContent ul { margin: 0; list-style: none; }
 #MainContent ul li { padding: 0; padding-bottom: 10px; display: -ms-flexbox; display: flex; align-items: center; font-size: 13px;}
 #MainContent ul li span:first-child { display: block; float: left; clear: both; margin-right: 15px; font-size: 13px; }
 #MainContent ul li span { display: block; overflow: hidden; }
 #MainContent ul li img { margin-left: 5px; }
 #MainContent ul li a { color: #0b4665; border: 1px solid #0b4665; border-radius: 50px; padding: 7.5px 10px; width: 464px;}
 #MainContent ul li.Annex { padding-left: 0; }
 #MainContent ul li.Annex span:first-child { margin-right: 25px; }
 
 /* Menu */
 #Menu { }
 #Menu .date { color: #313131; }
 #Menu img { width: 230px; }
 #Menu ul { margin: 0; list-style: none; }
 #Menu ul li { padding: 0; text-align: center;}
 #Menu ul li a { font-weight: bold; display: block; }
 #Menu ul li a:hover { text-decoration: none; }
 
 #Menu #MainMenu { margin-top: 7px;}
 #Menu #MainMenu li { float: left; width: 100px; margin-right: 10px; }
 #Menu #MainMenu li a { padding: 10px 0; border-width: 1px; border-style: solid; line-height: 1.18em; font-weight: normal; background-color: #1977a9; color: #fff; border-radius: 50px; font-size: 15px; }
 
 #Menu #SubMenu { font-size: 0.9em; margin-top: 15px; clear: both;}
 #Menu #SubMenu li a { padding: 5px 0; text-align: left; color: #444444; font-size: 15px; }
 
 /* WCAGLogo */
 #WCAGLogo { text-align: left; }
 #WCAGLogo a { display: inline-block; }
 #WCAGLogo img { width: 89px; }
 
 /* Link */
 #Link { font-size: 0.9em; overflow: hidden; }
 #Link ul { list-style: none; margin: 0; padding-bottom: 8px; }
 #Link ul li { display: inline; padding: 0; vertical-align: baseline; }
 #Link ul li:before { content: ""; vertical-align: baseline; padding: 0 9px; }
 #Link ul li:first-child:before { content: ""; padding: 0; }
 #Link a { display: inline; vertical-align: baseline; font-size: 12px; }
 #Link span { vertical-align: baseline; }
 
 /* Adobe */
 #Adobe { overflow: hidden; font-size: 0.633em; padding-bottom: 50px; }
 #Adobe a { display: inline-block; }
 #Adobe img { width: 95px; height: auto; }
 #Adobe p { margin-top: 8px; }
 
 
 /*
	 Colour
	 ===================================================
 */
 /* AA */
 
 #MainContent ul li span { color: #333; }
 
 #Menu #MainMenu li a:hover { background-color: #fff; }
 
 #Menu,
 #Link ul { border-color: #ccc; }
 
 #Menu #MainMenu li a { border-color: #1977a9; }
 
 #MainContent ul li.Annex span,
 #Menu #MainMenu li a:hover,
 #Link a { color: #313131; }
 
 /*#MainContent ul li a,
 #Menu #SubMenu li a,{ color: #005670; }*/
 
 #Menu #MainMenu li a { background-color: #1977a9; color: #fff; }
 #Menu #SubMenu li a:hover { text-decoration: underline;}
 
 
 /* AAA * /
 #Menu #MainMenu li a { border-color: #175d89; }
 
 #MainContent ul li a,
 #MainContent ul li.Annex span,
 #Menu #MainMenu li a:hover,
 #Menu #SubMenu li a { color: #175d89; }
 
 #Menu #MainMenu li a,
 #Menu #SubMenu li a:hover{ background-color: #175d89; }
 
 
 /*
	 Z-Index
	 ===================================================
 */
 #Logo { }
 #Title { }
 #MainContent { }
 
 
 /*
	 Responsive
	 ===================================================
	 Priority:	Size Max > Size Min > General
 */
 @media screen and (min-width:1025px) {
	 #Logo { padding: 34px 70px 32px; }
 
	 #Title { padding: 52px 53px 23px; position: absolute; right: 202px; top: 29px;}
	 #Title img { width: 215px; }
 
	 #MainContent { float: right; width: 632px; margin-top: 3%; margin-right: 16px; }
	 #MainContent ul.tc li{ padding-bottom: 6.7px; }
	 #MainContent ul.tc li.Annex{  }
 
	 #Menu { float: left; padding-left: 70px; width: 240px; margin-top: 3%; }
	 #Menu .date {margin-bottom: 8px; font-size: 14px;}
 
	 #WCAGLogo { clear: both; padding: 0 70px; padding-top: 9px; }
 
	 #Link { width: 638px; float: right; text-align: right; padding-top: 10px; position: absolute; bottom: 91px; left: 189px;}
 
	 #Adobe { margin-top: 50px; padding-left: 86px; }
 }
 
 @media screen and (max-width:1024px) {
	 #Logo { padding: 25px 0 40px 40px; }
 
	 #Title { padding: 40px 40px 0 0; }
 
	 #MainContent { padding-left: 60px; }
	 #MainContent img { height: 1.2em; }
	 #MainContent h2 a { padding: 11px 0; }
	 #Menu #MainMenu li a { font-size: 20px; }
 
	 #Menu { margin: 0; }
	 #Menu .Thumbnail { display: none; }
	 #Menu #MainMenu { margin: 34px 20px 0 20px; }
	 #Menu #SubMenu { padding: 0 20px; border-top: 1px solid #D9D9D9; border-bottom: 1px solid #D9D9D9; }
	 #Menu #SubMenu li { margin: 30px 0; }
	 #Menu #SubMenu li a { padding: 13px 0; text-align: center;border: 1px solid #444444; border-radius: 50px; }
	 #Menu #MainMenu li { float: left; width: 48%; margin: 0 1%; }
 
 
	 #WCAGLogo { margin: 20px 40px; margin-top: 15px; text-align: center; display: -ms-flexbox; display: flex; flex-flow: column-reverse; }
 
	 #Link { margin: 20px 10px; text-align: center; }
	 #Link ul li {width: 100%; float: left;}
	 #Link ul li:before {display: none; }
	 #Link a { display: block; text-align: center; padding: 8px 0;  line-height: 2em; }
 
	 #Adobe { margin: 20px 40px; text-align: center; padding-bottom: 50px; }
 }
 
 @media screen and (max-width:768px) {
	 #MainBlock { background: #ffffff; background-image: url('../images/mobile-bg2.png')!important; background-position: top; background-size: contain; }
 
	 #Logo { float: none; text-align: center; padding: 20px 20px 0 20px; }
 
	 #Title { float: none; text-align: center; padding: 20px 20px 20px; }
	 .desktop { display: none; }
	 .mobile { display: block!important; margin: auto; margin-top: 10px; }
 
	 #MainContent { padding: 0 28px; }
	 #MainContent h3 { font-size: 20px; text-align: center; }
	 #MainContent h2 { padding-bottom: 15px; }
	 #MainContent h2 a { width: auto; }
	 #MainContent ul li { display: -ms-flexbox; display: flex; flex-flow: column; align-items: normal; font-size: 16px; padding-bottom: 20px; }
	 #MainContent ul li a { width: auto; height: 47px; display: -ms-flexbox; display: flex; align-items: center; padding: 0 15px; border: 2px solid #1977a9; }
	 #MainContent ul li span:first-child { margin-bottom: 10px; }
 
	 #Menu { margin: 0; }
	 #Menu #SubMenu { margin-top: 54px; }
	 #Menu #SubMenu li a { width: 180px; margin: auto; }
 
	 #WCAGLogo { margin: 0 20px 30px 20px; }
 
 
	 #Adobe { margin: 20px; padding-bottom: 20px; }
 }
 
 @media screen and (max-width:480px) {
 
	 #MainContent { padding: 0 28px; }
	 #MainContent ul li span:first-child { margin-right: 15px; }
 }
 
 @media screen and (max-width:320px) {
 
	 #MainContent { padding: 0 15px; }
 }
 