/** Element Style **/

body {
	background:#0071c5;
	font-size:1.3em;
}
body#preview {
	background:#fff;
	min-width:100%;
}

a {
	color:#0071C5;
}
a:hover {
	color:#B34A14;
}


/** Common Class **/

.sans {
	font-family: 'Open Sans', sans-serif;
}
.serif {
	font-family: 'Amiri', serif;
}

.message-copy {
    text-align:center;
    padding:50px 0;
}
.message-copy:before {
    content:"“";
}
.message-copy:after {
    content:"„";
}

.large {
	font-size:1.6em;
	line-height:1.4;
}
.small {
	font-size:0.8em;
	line-height:1.4;
}

.text-red {
    color:#d33737 !important;
}
.text-green {
    color:#5ba552 !important;
}
.border-black {
    border:solid 1px #000;
}

main {
	background:#fff;
}

.level2 {
	background:#eee;
}

.button {
	display:inline-block;
	padding:10px 20px;
    margin:5px 0;
	min-width:48px;
	background:#0071c5;
	border-radius:4px;
	color:#fff;
}
.button:hover {
	background:#291f88;
	color:#fff;
}

.file-icon {
	margin-left:5px;
}

.database-nav {
	float:right;
	padding:15px 0 0 0;
    margin-right:20px;
}
.database-nav li {
	display:inline;
}
.database-nav li a {
	display:inline-block;
	background:#0071c5;
	padding:5px 10px;
	height:28px;
	border-radius:4px;
	margin-left:5px;
	color:#fff;
}
.database-nav li a.rss {
	background:#ff8a00;
	padding:4px 8px;
	cursor:pointer;
}
.database-nav li a.rss img {
	vertical-align:middle;
}
.database-nav li a.white {
	background:#fff;
	color:#000;
}
.database-nav #rss-selector {
	position:relative;
}
.database-nav #rss-selector ul {
	display:none;
	border:solid 3px #ccc;
	background:#fff;
	width:240px;
	position:absolute;
	top:30px;
	right:0;
	margin:0;
	padding:0;
}
.database-nav #rss-selector ul li {
	margin:0;
	padding:0;
	display:block;
}
.database-nav #rss-selector ul li a {
	background:none;
	border-radius:0;
	display:block;
	padding:5px 10px;
	margin:0;
	color:#000;
}
.database-nav #rss-selector ul li a:hover {
	background:#eee;
}

/** bannr **/
#banner {
	background:#eee;
	padding:25px 10px 10px 10px;
}
#banner div {
	text-align:center;
	margin-bottom:15px;
}
#banner div a img {
	transition:0.2s;
	margin:3px;
}
#banner div a:hover img {
	box-shadow:0 0 4px rgba(0,0,0,0.4);
}


/* Page header */

#page-header-outer {
	overflow:hidden;
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:240px;
	padding:0;
	background:#ddd;
	background-size:38px 26px;
	border-bottom:solid 3px #0071c5;
}
#page-header-outer-level3 {
	overflow:hidden;
	position:relative;
	top:0;
	left:0;
	width:100%;
	padding:0;
	background:#ddd;
	background-size:38px 26px;
	border-bottom:solid 3px #0071c5;
}
#page-header-outer-level3 #page-header {
	background:rgba(0,113,197,0.8);
}
#page-header-outer .page-header-image {
	position:absolute;
	top:0;
	left:0;
	right:0;
	width:100%;
	padding:0;
	z-index:20;
}
#page-header-outer .page-header-image img {
	position:absolute;
	top:0;
	bottom:0;
}
#page-header h1 {
	display:inline-block;
	background:#0071c5;
	font-size:200%;
	line-height:1.1;
	color:#fff;
	font-weight:normal;
	padding:15px 30px;
	margin:0;
	z-index:30;
}
#page-header-outer #page-header h1 {
	position:relative;
	top:90px;
	left:20px;
}

/* Main Content */

#main-content {
	padding-top:20px;
    font-size:1.2em;
    line-height:1.4;
}
#main-content h1 {
	font-family: 'Amiri', serif;
	font-size:2.8em;
	line-height:1.4;
	color:#000;
	padding:0 0 10px 0;
	border-bottom:solid 1px #ccc;
	margin:0 0 30px 0;
}
#main-content h1.news {
	margin-bottom:5px;
}
#main-content h2 {
	font-family: 'Amiri', serif;
	font-size:2.2em;
	color:#000;
	padding:0 0 10px 0;
	margin:0;
}
#main-content h2 span {
    font-size:0.7em;
    color:#555;
    line-height:1.2;
}
#main-content h3 {
	font-size:1.6em;
	font-weight:bold;
	color:#000;
	padding:0 0 10px 0;
	margin:0;
}
#main-content h3 span {
    font-size:0.7em;
    color:#555;
    line-height:1.2;
}
#main-content h4 {
	font-size:1.2em;
	font-weight:bold;
	color:#291F88;
	padding:0 0 10px 0;
	margin:0;
}
#main-content h5 {
	font-size:1.2em;
	font-weight:bold;
	color:#000;
	padding:0 0 5px 0;
	margin:0;
}
#main-content h6 {
	font-size:1.1em;
	font-weight:bold;
	color:#444;
	padding:0 0 5px 0;
	margin:0;
}

#main-content p + h2 ,
#main-content ul + h2 ,
#main-content ol + h2 ,
#main-content table + h2 {
    padding-top:40px;
}
#main-content p + h3 ,
#main-content ul + h3 ,
#main-content ol + h3 ,
#main-content table + h3 {
	padding-top:30px;
}

#main-content p ,
#main-content li {
	text-align:justify;
	text-justify:distribute;
	line-height:1.6;
	color:#444;
}
#main-content table p {
	text-align:left;
}
#main-content p.text-center {
	text-align:center;
}
#main-content p.text-right {
	text-align:right;
}
#main-content ul ,
#main-content ol {
	padding-left:1.5em;
}
#main-content li li {
	font-size:1em;
}

#main-content p {
	color:#444;
	padding:0 0 20px 0;
	line-height:1.8;
}
#main-content p.text-left {
	text-align:left;
}
#main-content p.text-right {
	text-align:right;
}
#main-content p.text-center {
	text-align:center;
}
#main-content img.left {
	padding-right:30px;
	padding-bottom:20px;
}
#main-content img.right {
	padding-left:30px;
	padding-bottom:20px;
}
#main-content .images p {
	line-height:1.4;
	padding-bottom:20px;
}
#main-content .images p img {
	padding-bottom:5px;
}

#main-content em {
	font-weight:bold;
	color:#000;
    font-size:1em;
}
#main-content strong {
	display:block;
	font-family: 'Amiri', serif;
	font-size:1.4em;
	font-weight:bold;
	color:#000;
	background:#eee;
	padding:10px 20px;
	margin:15px 20px 0 20px;
	text-align:center;
}

#main-content ul ,
#main-content ol {
	margin:0 0 20px 0;
}
#main-content li {
	padding-bottom:10px;
}

#main-content .link-list li {
    display:inline;
    list-style:none;
}
#main-content .link-list a {
    display:inline-block;
    padding:0 0 5px 0;
    margin:0 10px 15px 10px;
    border-bottom:solid 1px #000;
    width:calc(25% - 24px);
}

#main-content table {
	border-collapse:collapse;
	margin:0 0 30px 0;
	width:100%;
	table-layout:fixed;
	word-wrap:break-word;
}
#main-content table.free {
	table-layout:auto;
}
#main-content table th {
	border:solid 1px #ccc;
	background:#eee;
	color:#000;
	vertical-align:top;
	padding:5px;
}
#main-content table th.text-middle {
	vertical-align:middle;
}
#main-content table td {
	border:solid 1px #ccc;
	background:#fff;
	color:#444;
	vertical-align:top;
	padding:5px;
}
#main-content table caption {
	font-family: 'Amiri', serif;
	font-size:1.8em;
	color:#000;
	padding:0 0 5px 0;
	text-align:left;
}

#main-content table.no-border ,
#main-content table.no-border th ,
#main-content table.no-border td {
	border:none;
	table-layout:auto;
}
#main-content table.right-image-text ,
#main-content table.right-image-text th ,
#main-content table.right-image-text td {
	border:none;
	table-layout:auto;
}
#main-content table.left-image-text ,
#main-content table.left-image-text th ,
#main-content table.left-image-text td {
	border:none;
	table-layout:auto;
}

#main-content table ul ,
#main-content table ol {
	margin-bottom:0;
	padding-bottom:0;
}

#main-content .important-news {
    border:solid 1px #B34A14;
    border-radius:4px;
    margin:0 0 30px 0;
    padding:20px;
}

#main-content .yerrow-box {
	background:#f2e96a;
	padding:20px;
	margin-bottom:10px;
	color:#000;
    border-radius:4px;
}
#main-content .yerrow-box em {
	color:#fff;
}
#main-content .yerrow-box ul ,
#main-content .yerrow-box ol {
	margin-left:20px !important;
}

#main-content .inline-block-left {
	float:left;
	display:inline-block;
	*display:inline;
	*zoom:1;
	padding-top:5px;
	padding-right:30px;
	padding-bottom:20px;
}
#main-content .inline-block-right {
	float:right;
	display:inline-block;
	*display:inline;
	*zoom:1;
	padding-top:5px;
	padding-left:30px;
	padding-bottom:20px;
}

#main-content ul.inline-block li {
    display:inline-block;
    width:calc((100% / 3) - 20px);
}

#main-content ul.page-index {
	list-style:none;
	padding:0;
	margin:0 0 20px 0;
}
#main-content ul.page-index li {
	display:inline-block;
    margin-bottom:10px;
}
#main-content ul.page-index a {
	display:inline-block;
	*display:inline;
	*zoom:1;
	padding:5px 10px;
	background:#f0f0f0;
	border:solid 1px #ddd;
	border-radius:4px;
	margin:0 5px;
	text-align:center;
}
#main-content ul.page-index a:hover {
	background:#ddd;
}

#main-content aside.glay {
	background:#f0f0f0;
	padding:20px 20px 0 20px;
	margin-bottom:30px;
}
#main-content aside.glay:after {
	content: ".";
	display:block;
	clear:both;
	visibility:hidden;
}
#main-content aside.glay p {
	margin-bottom:0;
	padding-bottom:0;
}

#main-content .column {
	background:#f0f0f0;
	border:solid 1px #ccc;
	border-radius:4px;
	margin-bottom:20px;
	padding:20px;
}

.level2 #content .flex article {
	overflow:hidden;
	height:240px;
	margin-bottom:20px;
	position:relative;
	transition:0.2s;
	border:solid 10px #fff;
	background:#fff;
}
.level2 #content .flex article:hover {
	box-shadow:0 0 4px rgba(0,0,0,0.4);
}
.level2 #content .flex article.g6 {
    width:calc(50% - 22px);
}
.level2 #content .flex article .title {
	position:absolute;
	left:0;
	bottom:0;
	padding:10px;
	width:100%;
	color:#fff;
	font-size:1.2em;
	background:rgba(0,0,0,0.4);
	text-overflow:ellipsis;
	transition:0.2s;
}
.level2 #content .flex article:hover .title {
	color:#000;
	background:rgba(255,255,255,1);
}

.level2 #content .flex article .image {
	position:absolute;
	bottom:0;
	top:0;
	width:100%;
}

#main-content .card > article ,
#main-content .card > div ,
#main-content .card > .flex > article ,
#main-content .card > .flex > div {
    border:solid 1px #ccc;
    background:#fff;
    padding:20px;
    border-radius:3px;
}
#main-content .card > article ,
#main-content .card > div {
    margin-bottom:20px;
}

#main-content .card .card {
    border:solid 1px #ccc;
    background:#eee;
    padding:20px;
    border-radius:3px;
    margin-bottom:20px;
}

#content .sitemap-level2 {

}
#content .sitemap-level2 article {
	overflow:visible;
	height:auto;
	position:static;
	border:none;
    background:none;
}
#content .sitemap-level2 article:hover {
	box-shadow:none;
}
#content .sitemap-level2 h2 {
    font-size:1.4em;
}
#content .sitemap-level2 h2 a ,
#content .sitemap-level2 h2 span {
    display:block;
    padding:10px;
}
#content .sitemap-level2 ul {
    margin:0 0 20px 0;
    padding:0;
}
#content .sitemap-level2 li {
    list-style:none;
    padding:0;
    margin:0;
    border-top:solid 1px #ccc;
}
#content .sitemap-level2 li a {
    display:block;
    padding:10px;
}
#content .sitemap-level2 a:hover {
    background:#B34A14;
    color:#fff;
}

#content {
	padding-bottom:20px;
}
#content > .flex > .g4 {
	margin-top:0;
}

.contact-to {
    text-align:center;
    background:#eee;
    padding:20px;
    margin:0 0 20px 0;
}


/* Event */
#event ul#event-list {
    padding:20px;
    margin:0;
    list-style:none;
}
#event ul#event-list li {
    padding:20px 0;
    margin:0;
    border-bottom:solid 1px #eee;
    font-size:1.2em;
}
#event ul#event-list li span {
    float:left;
    width:8em;
}
#event ul#event-list li a {
    display:block;
    margin-left:9em;
}


/* SDGs */
#main-content #sdgs-index {
	padding:0 0 20px 15px;
}
#main-content #sdgs-index img {
	padding:5px;
	cursor:pointer;
}
#main-content #sdgs_section {
	margin:15px;
	width:calc(100% - 30px);
}
#main-content #sdgs_section option {
	padding:3px;
}
#main-content .sdgs {
	margin-bottom:20px;
}
#main-content .sdgs > a {
	display:block;
	border:solid 2px #ccc;
	padding:10px;
	margin-bottom:10px;
    transition:0;
    overflow:hidden;
}
#main-content .sdgs > a:hover {
	border:solid 2px #B34A14;
}
#main-content .sdgs > a .image {
	float:left;
	width:60px;
	text-align:center;
	overflow:hidden;
}
#main-content .sdgs > a h1 {
	font-size:1.4em;
	line-height:1.4;
	border:none;
	padding:0;
	margin:0 230px 0 70px;
}
#main-content .sdgs > a .goal {
	float:right;
	width:210px;
}
#main-content .sdgs .goal img {
	padding:0 2px;
}
#main-content .sdgs .section {
	margin:0 0 20px 0;
	padding:15px;
	border:solid 1px #999;
	border-radius:4px;
}
#main-content .sdgs .button {
	background:#eee;
	color:#000;
	padding:5px 10px;
}
#main-content .sdgs .button:hover {
	background:#B34A14;
	color:#fff;
}

#main-content #___gcse_0 form * {
	height:40px;
}
#main-content #___gcse_0 table {
	table-layout:auto;
}
#main-content #___gcse_0 table ,
#main-content #___gcse_0 table td {
	border:none;
	padding:0;
}
#main-content #___gcse_0 .gsc-input-box {
	border:solid 1px #ccc;
	border-radius:4px;
	position:relative;
}
#main-content #___gcse_0 .gsc-search-box table td.gsib_a { /* search box */
	padding:10px;
	background:none;
}
#main-content #___gcse_0 .gsc-search-box table td.gsib_b { /* X icon */
	width:20px;
	background:none;
	position:absolute;
	top:3px;
	right:10px;
}
#main-content #___gcse_0 .gsc-search-box table td.gsc-search-button { /* search button */
	width:60px;
}

#main-content #___gcse_0 .gsc-search-box table td.gsib_a input.gsc-input {
	background:none;
}
#main-content #___gcse_0 .gsc-search-box table td.gsc-search-button button.gsc-search-button {
	width:100%;
	height:40px;
	min-width:auto;
	text-align:center;
	padding:10px;
	border-radius:4px;
}
#main-content #___gcse_0 .gsc-search-box table td.gsc-search-button button.gsc-search-button svg {
	height:13px;
}
#main-content .gsc-results * {
	height:auto;
	width:auto;
}


/* Sitemap */

#main-content .sitemap h2 {
	margin:0;
	padding:0;
	display:inline;
    font-size:1.4em;
}
#main-content .sitemap h2 a {
	color:#000;
	display:block;
	padding:10px;
}
#main-content .sitemap h2 a:hover {
	background:#eee;
}
#main-content .sitemap ul {
	list-style:none;
	padding:0;
	margin:0 0 20px 0;
}
#main-content .sitemap ul li {
	margin:0;
	padding:0;
	display:inline;
}
#main-content .sitemap ul li a {
	display:block;
	color:#444;
	padding:10px;
	margin:0;
	border-top:solid 1px #eee;
}
#main-content .sitemap ul li a:hover {
	background:#eee;
}

/* Database page */

.database-list {
	border-bottom:solid 1px rgba(0,0,0,0.1);
	margin-bottom:25px;
}
.database-list:last-child {
	border:none;
}
.database-list .float-box-inner {
	overflow:hidden;
}

.academic-year {
	margin:0;
	padding:0 20px;
	border-top:solid 1px #ccc;
	background:#eee;
	overflow:hidden;
	*zoom:0;
}
.academic-year dt {
	float:left;
	color:#0b73bb;
	font-size:1.2em;
	padding:20px 20px 20px 0;
	margin:0;
}
.academic-year dd {
	float:left;
	padding:0;
	margin:0;
}
.academic-year dd ul {
	float:left;
	padding:0;
	margin:0;
	list-style:none;
}
.academic-year dd ul li {
	float:left;
	padding:0;
	margin:0;
	font-size:1.2em;
}
.academic-year dd ul li a {
	display:inline-block;
	margin:20px 7px;
}
.academic-year dd ul.previous {
	display:none;
	height:40px;
	overflow:hidden;
}
.academic-year dd ul a.button {
	display:inline-block;
	text-align:center;
    font-size:0.8em;
	line-height:1.1;
	border:solid 1px #999;
	border-radius:4px;
	padding:5px 10px;
	margin:10px 7px;
	color:#999;
	background:transparent;
}
.academic-year dd ul a.button:hover {
	background:#999;
	color:#fff;
}


/* Pageing */

ul.pageing {
	background:#999;
	padding:0;
	margin:0;
	height:50px;
	list-style:none;
	text-align:center;
}
ul.pageing li {
	display:inline-block;
}
ul.pageing li a ,
ul.pageing li em {
	display:table-cell;
	width:50px;
	height:50px;
	text-align:center;
	vertical-align:middle;
	border-right:solid 1px #999;
	color:#fff;
	font-size:1.4em;
	background:#aaa;
}
ul.pageing li em {
	background:#ccc;
}
ul.pageing li a:hover {
	background:#e99f00;
}
ul.pageing li span {
	display:block;
	transform: scale(0.8, 1.6);
}

/* Element List */

#main-content table.element-list {
	table-layout:auto;
}
#main-content table.element-list th {
	font-weight:bold;
	text-align:left;
}
#main-content table.element-list th.title {
	font-size:1.4em;
}
#main-content table.element-list td p:last-child {
	padding-bottom:0;
}

/* Search */

#search-results table ,
#search-results table td {
	border:none;
	table-layout:auto;
}
.gsc-above-wrapper-area ,
.gcsc-branding {
	display:none;
}
.gsc-cursor {
	font-size:1.4em;
}
.gsc-cursor .gsc-cursor-page {
	margin-right:20px;
}


/** Media Query **/

@media only screen and (max-width : 1024px) {
	.level2 #content .flex article {
		height:200px;
	}
}
@media only screen and (max-width : 980px) {

}
@media only screen and (max-width : 768px) {
    #banner .g3 {
        width:calc(50% - 22px);
    }

	.level2 #content .flex article {
		height:250px;
	}

    .database-nav {
        padding-top:15px;
    }
    .database-nav li {
        display:inline-block !important;
    }

    #event ul#event-list li a {
        clear:both;
        margin-left:0;
        padding-top:5px;
    }

	.academic-year {
		padding-bottom:20px;
	}
	.academic-year dt {
		display:block;
		padding:20px 0 0 0;
		float:none;
	}
	.academic-year dd ul:first-child {
		display:block;
		float:none;
	}
	.academic-year dd ul li a {
		margin:10px 10px 10px 0;
	}
	.academic-year dd ul li a.button {
		margin:10px 10px 20px 0;
	}

	#page-header-outer {
		position:static;
		height:auto;
	}
	#page-header-outer-level3 {
		position:static;
		height:auto;
		margin-bottom:20px;
	}
	#page-header-outer .page-header-image {
		position:static;
	}
	#page-header-outer .page-header-image img {
		position:static;
	}
	#page-header h1 {
		display:block;
		padding:20px 15px;
		font-size:1.6em;
	}
	#page-header .width-limitter {
		padding:0;
		margin:0;
	}
	#page-header-outer #page-header h1 {
		position:static;
	}

	#main-content {
		padding:0 15px 20px 15px;
	}
	#main-content h1 {
		font-size:2em;
		line-height:1.4;
		margin:0 0 20px 0;
	}
	#main-content h2 {
		font-size:1.8em;
	}

	#main-content strong {
		font-size:1.2em;
		margin:15px 0 0 0;
		line-height:1.4;
	}

	#main-content ul.page-index a {
		display:block;
		padding:10px;
		margin:5px 0;
	}

	#main-content .inline-block-left {
		float:none;
		display:block;
		padding-right:0;
		padding-bottom:20px;
	}
	#main-content .inline-block-right {
		float:none;
		display:block;
		padding-left:0;
		padding-bottom:20px;
	}

	#content > .flex > .g4 {
		margin:-10px;
		padding:0;
		width:calc(100% + 20px);
	}

	#main-content .sdgs > a .image {
		width:100px;
	}
	#main-content .sdgs > a h1 {
		line-height:1.2;
		margin:0 0 0 110px;
	}
	#main-content .sdgs > a .goal {
		float:none;
		margin:0 0 10px 110px;
		width:auto;
	}

	#main-content #___gcse_0 table {
		display:table;
	}
	#main-content #___gcse_0 table td {
		display:table-cell;
	}
	#main-content #___gcse_0 .gsc-search-box table td.gsib_a { /* search box */

	}
}

@media only screen and (max-width : 640px) {
    #banner .g3 {
        width:100%;
    }
}

@media print {
    body {
        min-width:1200px !important;
    }
}