/* **** General MathsNet CSS **** */

/* Body */

body
{
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #444;
	padding-bottom: 50px;
}

/* **** Core Styles **** */

h1, h2, h3, h4, h5
{
	color: #666;
	font-weight: normal;
}

h1, .tophdr
{
	font-size: 25px;
	margin-top: 0;
	text-shadow: #aaa 1px 1px 0.1em
}

h2
{
	font-size: 20px;
}

h3
{
	font-size: 18px;
}

h4
{
	font-size: 16px;
}

h5
{
	font-size: 14px;
}

p
{
	font-size: 14px;
	line-height: 1.4em;
}

textarea
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
}

.large, .large a
{
	font-size: 16px !important;
}

#countdown
{
	font-size: 20px;
	padding: 10px;
	width: 200px;
	text-align: center;
	background-color: #eee;
	color: #555;
	border-radius: 3px;
	margin: 20px 0 0 60px;
}

.refreshbtn
{
	margin-left: 60px;
	width: 350px;
}

/* **** Links **** */

a
{
	font-size: 14px;
	color: blue;
	text-decoration: none;
	outline: none;
}

a:hover
{
	color: #000;
}

a img
{
	border: none;
	outline: none;
}

.small
{
	font-size: 12px;
}

.tiny
{
	font-size: 11px;
}

/* **** List styles **** */

li
{
	font-size: 14px;
}

a /* remove unwanted focus outlines from links */
{
	outline: none;
}

*:focus
{
	outline: none;
}

/* **** General tab handling **** */

#utility
{
	min-width: 350px !important;
	height: 74px;
	order: 3;
}

ul#ultabs
{
	margin: 8px 0 3px 0;
	padding: 0 0 0 3px;
}

ul#ultabs li
{
	display: inline-block;
	margin: 0;
}

ul#ultabs li.taboff a, ul#ultabs li.taboff a:visited
{
	background-color: black;
	font-family: "Century Gothic", Arial, sans-serif;
	font-size: 12px;
	color: white;
	padding: 2px 8px 2px 8px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

ul#ultabs li.taboff a:hover
{
	background-color: #eee;
	color: #777;
}

ul#ultabs li.tabon a, ul#ultabs li.tabon a:visited
{
	font-family: "Century Gothic", Arial, sans-serif;
	background-color: white;
	font-size: 12px;
	color: black;
	padding: 2px 8px 3px 8px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

ul#ultabs li.tabon a:hover
{
	background-color: #eee;
	color: black;
}

/* For tabs 1 to 3 */

#utility .tabfield
{
	background-color: #f8f8f8;
	border-radius: 1px;
	width: 341px;
	height: 45px;
	box-sizing: border-box;
}

/* For tabs 4 and 5 */

#utility .tabfield2
{
	background: white;
	width: 324px;
	height: 180px;
	z-index: 500;
	border-radius: 1px;
	box-shadow: #555 2px 2px 10px;
}

/* Individual tab boxes */

#tabbox1
{
	padding: 3px 0 0 5px;
}

#tabbox2
{
	position: relative;
}

#tabbox3
{
	padding: 3px 0 0 5px;
}

#tabbox4, #tabbox5
{
	position: absolute;
	padding: 8px;
}

.hilitesyltab a
{
	background-color: #800 !important;
}

.hilitesyltab a:hover
{
	color: black !important;
	background-color: yellow !important;
}

/* Inner box for help and change syllabus */

#helpinner, #sylinner
{
	margin: 6px;
	width: 310px;
	height: 120px;
	overflow: hidden;
	line-height: 1.7em;
}

#sylinner .changesyl, #helpinner .menuhelp
{
	border-right: 1px solid white;
	border-bottom: 1px solid white;
	border-radius: 1px;
	background: #f8f8f8;
	padding: 0 3px;
	margin-bottom: 2px;
	color: #444;
	height: 20px;
	overflow: hidden;
}

#sylinner .csselected
{
	background-color: #d8d8d8;
}

#sylinner .changesyl:hover, #helpinner .menuhelp:hover
{
	cursor: pointer;
	background: #e8e8e8;
	color: black;
	border-right: 1px solid #555;
	border-bottom: 1px solid #333;
}

#sylinner .changesyl .changesylinfo
{
	color: #444;
	font-size: 10px;
	padding-right: 2px;
	font-weight: normal;
	float: right;
}

.menuhelp:hover
{
	cursor: pointer;
}

/* Search box */

input#search
{
	width: 246px;
	height: 25px;
	margin: 8px 0 0 10px;
	padding: 1px 38px 4px 30px;
	background: url("/images/tabs/searchbg.png") no-repeat 5px 2px;
	border-radius: 13px;
	border: 1px solid #777;
	background-color: white;
}

input#searchButton
{
	position: absolute;
	top: 10px;
	right: 15px;
	width: 25px;
	margin: 4px;
	background: url("/images/tabs/search-button.png") no-repeat;
	border: none;
	cursor: pointer;
}

/* Log On */

#logonwrapper
{
	padding-top: 8px;
	padding-left: 12px;
	z-index: 10;
}

#logon
{
	font-size: 16px;
	font-weight: bold;
	color: black;
}

#logon img
{
	vertical-align: bottom;
}

#fgtpswd
{
	padding-left: 90px;
	font-size: 12px;
	font-weight: bold;
}

/* Profile */

#profilewrapper
{
	padding-top: 1px;
	padding-left: 8px;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.4em;
}

.profilename
{
	overflow: hidden;
	white-space: nowrap;
	width: 315px;
	height: 14px;
	border-bottom: 1px solid #999;
	margin-bottom: 1px;
}

.profilebtn
{
	font-size: 12px;
	font-variant: small-caps;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: 0.06em;
	margin-right: 6px;
	padding-top: 0;
	padding-bottom: 0;
}

.profilebtn.expacct
{
	color: #c00 !important;
}

#profilewrapper button::-moz-focus-inner
{
	margin: -1px;
	padding: 0;
	border-width: 1px;
}

.profilebtn:hover
{
	cursor: pointer;
}

.conline
{
	font-size: 11px;
}

#optionswrapper
{
	padding-top: 2px;
	padding-left: 8px;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.4em;
}

.bigpg
{
	font-size: 130%;
	font-weight: bold;
	text-shadow: #aaa 1px 1px 0.1em
}

/* **** Tables **** */

table.module
{
	border-spacing: 2px;
	width: 100%;
}

table.module td
{
	padding: 2px;
}

table#subscriptiontable
{
	padding: 10px;
	background-color: #ddd;
	border-radius: 10px;
	min-width: 600px;
}

table#subscriptiontable td
{
	padding: 3px 6px;
	background-color: #f8f8f8;
}

table#subscriptiontable td input
{
	margin-top: 1px;
}

/* **** Images **** */

.img, imgb
{
	margin: 5px;
}

.imgl, .imglb
{
	float: left;
	margin: 0 5px 3px 0;
}

.imgc, .imgcb
{
	margin: 5px auto;
	display: block;
}

.imgr, .imgrb
{
	float: right;
	margin: 0 0 3px 5px;
}

.imgb, .imglb, .imgrb, .imgcb
{
	padding: 8px;
	background: white;
	border-top: 1px solid #ccc;
	border-left: 1px solid #bbb;
	border-right: 2px solid #777;
	border-bottom: 2px solid #555;
	border-radius: 3px;
	box-shadow: #bbb 2px 2px 4px;
}

.piccaption
{
	margin: 0;
	padding: 0;
}

.piccaption p
{
	margin: 5px 0;
	padding: 0;
}

/* **** System Check table **** */

td.syschktype
{
	background-color: transparent;
	color: #444;
	padding: 2px 4px;
	text-align: right;
}

td.syschkvalue
{
	background-color: white;
	font-weight: bold;
	color: #040;
	border: 1px solid #999;
	padding: 2px;
	width: 180px;
	border-radius: 3px;
}

/* **** Image **** */

.img, imgb
{
	margin: 5px;
}

.imgl, .imglb
{
	float: left;
	margin: 0 5px 3px 0;
}

.imgc, .imgcb
{
	margin: 5px auto;
	display: block;
}

.imgr, .imgrb
{
	float: right;
	margin: 0 0 3px 5px;
}

.imgb, .imglb, .imgrb, .imgcb
{
	padding: 8px;
	background: white;
	border-top: 1px solid #ccc;
	border-left: 1px solid #bbb;
	border-right: 2px solid #777;
	border-bottom: 2px solid #555;
	border-radius: 3px;
	box-shadow: #bbb 2px 2px 4px;
}

/* **** Applet timer popup **** */

#alttimes
{
	background-color: #f4f4f4;
	border: 1px solid #555;
	padding: 5px;
	font-size: 10px;
	border-radius: 3px;
	box-shadow: #888 1px 1px 2px;
	margin-right: 35px;
}

#alttimes a, #alttimes a:visited
{
	text-decoration: none;
	color: black;
}

#alttimes a:hover
{
	color: white;
	background-color: black;
}

/* **** Stripe **** */

#stripepaytable
{
	background-color: #eee;
	padding: 10px;
	border-radius: 10px;
}

#card-element, #cardholder-name
{
	background-color: white !important;
	padding: 3px;
	min-height: 26px;
	font-size: 16px;
	border: 1px solid black;
}

#card-button
{
	font-size: 16px;
}

#usermsg
{
	min-height: 50px;
	background-color: #555;
	color: white;
	min-width: 440px;
	max-width: 620px;
	padding: 5px;
	border-radius: 5px;
	line-height: 1.5em;
}

/* **** Site Messages **** */

#errormessage, #errormsg
{
	width: 650px;
	color: #ffffee;
	padding: 10px;
	font-size: 17px;
	background-color: red;
	margin-bottom: 10px;
	text-align: left;
	border-radius: 5px;
}

#errormsg li
{
	font-size: 16px;
}

#sitefreeze, #siteupdate, #sitemessage, #genmsg, #dommsg
{
	margin: 3px 0;
	padding: 5px;
	text-align: center;
	border-radius: 2px;
	font-size: 14px;
}

#sitemsgbold
{
	font-size: 16px;
	font-weight: bold;
}

#sitefreeze
{
	color: #060;
	border: 2px solid #060;
	padding: 5px;
	background-color: #ffe;
	font-weight: normal;
}

#freezemsg
{
	padding: 8px;
	border: 1px solid black;
	background-color: #ffe;
	font-size: 13px;
	text-align: justify;
}

#subsoffline
{
	font-style: italic;
}

#siteupdate
{
	color: white;
	background-color: #e00;
}

#sitemessage, #genmsg
{
	color: #042;
	border: 2px #060 solid;
	background-color: #ffc;
	font-size: 13px;
	font-weight: bold;
}

#dommsg
{
	color: #c00;
	border: 2px #c00 solid;
	background-color: #ff8;
	font-size: 13px;
	font-weight: bold;
}

#oldbrowser
{
	clear: both;
	padding: 10px;
	border: 2px solid red;
	text-align: left;
	background: url("/dlib/images/browsers/warning.png") no-repeat yellow 5px 5px;
	margin: 25px 0;
	min-height: 60px;
}

#oldbrowser .browser
{
	float: right;
	width: 50px;
	text-align: right;
	padding-right: 10px;
}

#oldbrowser .message
{
	font-size: 16px;
	margin: 3px 0 0 100px;
	color: #400;
}

#oldbrowser a, #oldbrowser a img
{
	border: none;
}

.pexammod
{
	font-size: 15px;
	color: #444;
	font-weight: bold;
}

.helpbuttonexample
{
	display: inline;
	width: 20px;
	padding: 1px 4px;
	font-size: 12px;
	font-weight: bold;
	border: 1px solid #666;
	border-radius: 10px !important;
	background-color: #99f773;
	box-shadow: 2px 2px 4px #bbb, inset 1px 1px 2px rgba(255, 255, 255, 0.6), inset -1px -1px 2px rgba(100, 100, 100, 0.5);
}

#ubuttons
{
	float: right;
	text-align: right;
	padding: 3px 3px 0 8px;
	height: 19px;
	margin: 0;
}

.ebutton
{
	display: inline-flex;
	padding: 0 1px 0 0;
	justify-content: center;
	align-items: center;
	width: 20px;
	height: 20px;
	margin-left: 8px;
	font-size: 12px !important;
	font-weight: bold;
	border: 1px solid #666;
	border-radius: 50%;
	box-shadow: 2px 2px 4px #bbb, inset 1px 1px 2px rgba(255, 255, 255, 0.6), inset -1px -1px 2px rgba(100, 100, 100, 0.5);
}

.semarkex
{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.ebutton:hover
{
	background-color: white !important;
}

.ebutton:hover a
{
	color: red !important;
}

.ubutton
{
	padding: 2px 1px 1px 1px;
	margin-left: 8px;
	font-size: 12px !important;
	font-weight: bold;
	border: 1px solid #666;
	border-radius: 10px;
	box-shadow: 2px 2px 4px #bbb, inset 1px 1px 2px rgba(255, 255, 255, 0.6), inset -1px -1px 2px rgba(100, 100, 100, 0.5);
}

.hubutton
{
	padding: 2px 5px 1px 5px;
	font-size: 12px;
	font-weight: bold;
	border: 1px solid #666;
	border-radius: 10px;
	box-shadow: 2px 2px 4px #bbb, inset 1px 1px 2px rgba(255, 255, 255, 0.6), inset -1px -1px 2px rgba(100, 100, 100, 0.5);
}

.ubutton a:hover
{
	color: black;
	border-color: black !important;
}

.ubuttonc0, .ubuttonf0, .ubuttont0, .ubuttone0
{
	background-color: #ccc;
	color: #888 !important;
}

.ubuttonc0 a, .ubuttonf0 a
{
	color: #888 !important;
}

#ubuttonc1
{
	background-color: #ffac35;
}

#ubuttonc2
{
	background-color: #ffe935;
}

#ubuttonf1
{
	border: 1px solid #666;
	background-color: #baecdc;
}

#ubuttont1
{
	border: 1px solid #611315;
	background-color: #ffc5c7;
}

#ubuttont2
{
	border: 1px solid #611315;
	background-color: #ffaa4f;
}

#ubuttont1 a, #ubuttont1 a:visited, #ubuttont2 a, #ubuttont2 a:visited
{
	color: #611315;
}

#ubuttonh0, .hubutton
{
	background-color: #ddd;
}

#ubuttonh1
{
	background-color: #99f773;
}

#ubuttone1
{
	border: 1px solid #611315;
	background-color: #ffc5c7;
}

#ubuttone2
{
	border: 1px solid #611315;
	background-color: #ffaa4f;
}

#ubuttone1 a, #ubuttone1 a:visited, #ubuttone2 a, #ubuttone2 a:visited
{
	color: #611315;
}

#exmkmins
{
	background-color: #ffc;
	padding: 2px 5px;
}

#exmkmins a
{
	color: #666;
	font-size: 10px;
}

#exmkmins a:hover
{
	color: black;
}

/* **** Front page student summary table **** */

table#stustatstbl th, table#stustatstbl td
{
	border-radius: 4px;
}

table#stustatstbl td.sscol1, table#stustatstbl th
{
	padding: 2px 6px;
	font-weight: bold;
	color: white;
	background: #60676d;
	background: -moz-linear-gradient(top, #abb2ba 0%, #4b5356 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#abb2ba), to(#4b5356));
	border-right: 1px solid black;
	border-bottom: 1px solid black;
}

table#stustatstbl td.sscol2, #stustatstbl td.sscol3
{
	padding: 2px 4px;
	color: black;
	background: #eee;
	background: -moz-linear-gradient(top, #f6f7f8 0%, #e0e3e6 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#f6f7f8), to(#e0e3e6));
	border-right: 1px solid #777;
	border-bottom: 1px solid #777;
}

#stustatstbl td.sscol3
{
	font-size: 11px;
}

/* **** Top Schools **** */

.topschtbl th a
{
	color: white !important;
}

/* **** Score Boxes **** */

.sscorebox
{
	float: left;
	padding: 7px 9px 10px 9px;
	margin: 0 20px 20px 0;
	border: 1px solid #777;
	border-radius: 3px;
	box-shadow: #bbb 2px 2px 4px;
	text-align: center;
}

.sscorebox .title
{
	padding: 4px;
	margin: 0 0 8px 0;
	color: #444;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	text-shadow: #ccc 1px 1px 0.1em;
	background: rgba(255,255,255,0.8);
	background: white;
	border: 1px solid #777;
	border-radius: 3px;
	box-shadow: #777 2px 2px 4px;
}

.sscorebox table, .topschools table
{
	padding: 2px;
	margin-right: 5px;
	background-color: white;
	border: 1px solid #333;
	border-radius: 3px;
	box-shadow: #777 2px 2px 4px;
	margin: 0 auto;
}

.sscorebox table th, .topschools table th
{
	background-color: #787f85;
	border-right: 1px solid black;
	border-bottom: 1px solid black;
	border-radius: 2px;
	color: white;
}

.sscorebox table th a, .sscorebox table th a:visited,
.topschools table th a, .topschools table th a:visited
{
	color: white;
	text-decoration: none;
}

.sscorebox table th a:hover, .topschools table th a:hover
{
	color: #34b9f1;
}

.sscorebox table td, .sscorebox p,
.topschools table td, .topschools p
{
	color: #444;
	border-right: 1px solid #6e7f81;
	border-bottom: 1px solid #53656a;
	padding: 3px;
	background-color: #f4f4ff;
	border-radius: 2px;
}

.sscorebox table td.sscore1,
.topschools table td.sscore1

{
	background-color: #63ffd3;
}

.sscorebox table td.sscore2,
.topschools table td.sscore2
{
	background-color: #b5ff63;
}

.sscorebox table td.sscore3,
.topschools table td.sscore3
{
	background-color: #f3ff63;
}

#reporterror
{
	margin-top: 20px;
	text-align: right;
}

#reporterror a, #reporterror a:visited
{
	font-size: 14px;
	color: blue;
}

.otselbox
{
	border: 1px solid #eee;
	border-radius: 3px;
	margin-bottom: 1px;
	cursor: default;
	vertical-align: top;
	padding: 1px 1px 2px 1px;
}

.otselbox:hover
{
	border: 1px solid #999;
	background-color: #ddd;
}

.otselbox a .otqlink
{
	cursor: pointer;
}

.otselbox input
{
    width: 15px;
    height: 13px;
    padding: 0;
    margin: 0;
    vertical-align: bottom;
    position: relative;
    top: 0;
	overflow: hidden;
}

/* **** Boxes **** */

.boxouter
{
	padding: 2px 0 0 0;
	border-radius: 2px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
}

.boxouter h2, .boxouter h3, .boxouter h4, .boxouter h5
{
	font-size: 14px;
	font-weight: bold;
	padding: 4px 4px 4px 10px;
	margin: 0;
	color: white;
	text-shadow: 1px 1px 1px #333;
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	background: url("/images/site/h2header.png") no-repeat top right;
background-color: #777;
}

#labox h2
{
	background-image: none !important;
}

.boxouter .boxclose
{
	font-family: "Century Gothic", Arial, sans-serif;
	float: right;
	font-weight: normal;
	margin-top: -4px;
	font-size: 16px;
	padding: 1px 2px;
	transform: scale(1.4,1);
	cursor: pointer;
	color: white;
}

.boxouter .boxclose:hover
{
	background-color: #c00;
}

.boxinner
{
	padding: 10px;
	background: white;
	border-right: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
	border-left: 1px solid #bbb;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	color: #555;
}

.boxinner a, .boxinner a:visited
{
	color: black !important;
}

.boxinner a:hover
{
	color: #c00 !important;
}

/* **** Search Table **** */

.searchtbl th, .searchtbl td, .worksheet th, .worksheet td
{
	padding: 3px;
}

.worksheet td, .worksheet td a
{
	font-size: 13px;
}

.worksheet td a
{
	font-weight: bold;
	color: blue;
}

.worksheet td a:hover
{
	color: #333;
}

td.wkstopic
{
	font-size: 16px;
	font-weight: bold;
}

.searchtbl
{
	border-spacing: 3px;
}

.searchtbl th, .worksheet th
{
	color: white;
	background-color: #4d5558;
	border-radius: 2px;
}

.searchtbl td, .worksheet td
{
	background-color: #f4f4f4;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	border-radius: 3px;
}

.sitegreen
{
	font-weight: bold;
	color: black;
}

/* **** News Item Box **** */

#newsbox
{
	padding: 0;
	border-radius: 2px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
	background-color: #f8f8f8;
}

.newsdate
{
	float: right;
	font-style: italic;
	font-weight: normal;
}

.newsitem
{
	margin: 5px 10px 10px 20px;
}

#newsmore
{
	margin-top: -5px;
	text-align: right;
}

.newstitle
{
	margin-bottom: 14px;
	padding: 2px 4px 2px 4px;
	font-size: 10pt;
	font-weight: bold;
}

.newsimgl, .newsitem img
{
	float: left;
	margin: 0 10px 3px 0;
}

.newsimgr
{
	float: left;
	margin: 0 0 3px 10px;
}

a.optionlink
{
	margin: 0 7px 0 0;
	padding: 1px 5px;
	border: 1px solid #ccc;
	border-radius: 2px;
	background-color: transparent;
}

a.optionlink:hover
{
	background-color: white;
}

/* **** Cookie Law: Push-down bar and table **** */

#cklbox
{
	box-sizing: border-box;
	font-family: "Century Gothic", Verdana, Arial, sans-serif;
	background-color: #d00;
	background-color: #333;
	box-shadow: 0 2px 4px #555;
	display: none;
	position: fixed;
	text-align: left;
	font-size: 16px;
	z-index: 999;
	width: calc(100% - 2px);
	left: 0;
	top: 0;
	color: white;
	padding: 5px 20px;
	font-weight: normal;
}

#cklbox a, #cklbox a:visited
{
	color: yellow;
	font-size: 16px;
	text-decoration: none;
	font-weight: bold;
}

#cklbox a:hover
{
	text-decoration: underline;
}

#cklhide
{
	float: right;
	margin: 3px 0 0 10px;
	font-weight: bold;
	padding: 4px;
	border-radius: 3px;
	font-size: 20px;
	background-color: #f0d800;
	cursor: pointer;
	color: black;
}

#cklhide:hover
{
	background-color: yellow;
}

table.ckl th
{
	background-color: #4f575a;
	color: white;
	border-radius: 3px;
	border-right: 1px solid #040;
	border-bottom: 1px solid #040;
	padding: 2px 5px;
}

table.ckl td
{
	background-color: #fcfffc;
	border-radius: 3px;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	padding: 2px 5px;
}

table.ckl tr:hover td
{
	background-color: #f0fff0;
}

/* **** Popup Tooltip **** */

#popuptooltip
{
	text-align: left;
	border: 1px solid black;
	border-radius: 5px;
	font-size: 10px;
	padding: 5px;
	background-color: #ffc;
	color: black;
	z-index: 1000;
	box-shadow: 3px 3px 3px #222;
	max-width: 250px;
	line-height: 1.4em;
}

#xpopuptooltip
{
	padding: 3px;
	font-size: 9px;
	border: 1px solid #777;
}

/* **** Progress Table and Worked List links **** */

.workedlist
{
	margin: 0 0 15px 10px;
	text-align: center;
	padding: 10px;
	border-left: 1px solid #999;
}

.progresstbl
{
	padding: 3px;
	border: 1px solid #999;
	box-shadow: 2px 2px 1px #999;
	border-radius: 2px;
	margin: 0 3px 10px 0;
	border-spacing: 2px;
}

.progresstbl th
{
	font-size: 13px !important;
	border-width: 0 1px 1px 0;
	border-color: black;
	border-style: solid;
	background-color: #777;
	color: white;
	border-radius: 1px;
	padding: 2px;
}

.progresstbl td
{
	font-size: 12px !important;
	border-width: 0 1px 1px 0;
	border-color: #999;
	border-style: solid;
	border-radius: 1px;
	padding: 1px 2px;
}

.progresstbl td a
{
	font-size: 12px !important;
}

td#progthis
{
	border: 1px solid red;
	font-weight: bold;
}

.modprogress
{
	border-top: 1px solid #ccc;
}

/* **** Exam Dates **** */

#examdates
{
	font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;
	font-size: 15px;
	padding: 4px 10px;
	background-color: #4b5356;
	color: #ffd;
	border-radius: 3px;
	font-style: italic;
	margin-bottom: 10px;
}

#examdates .examdatelist
{
	font-size: 15px;
	font-weight: bold;
	color: white;
	font-style: normal;
	margin-right: 20px;
}

#examdates a
{
	color: white;
}

#examdates a:hover
{
	color: yellow;
}

#examdatefull
{
	font-style: normal;
	margin: 5px 5px 5px 20px;
	color: white;
}

.examdateentry
{
	font-size: 14px;
	margin: 4px 3px;
	background-color: #3b4346;
	display: flex;
}

.examdate1, .examdate2, .examdate3, .examdate4, .examdatec
{
	display: inline-block;
	margin-right: 10px;
	align-self: center;
}

.examdate1
{
	width: 130px;
	text-align: right;
}

.examdate2
{
	width: 80px;
	text-align: center;
	font-style: italic;
}

.examdate3
{
	width: 120px;
	text-align: center;
}

.examdatec
{
	width: 14px;
	text-align: center;
	cursor: pointer;
}

.examdate1.exhead, .examdate2.exhead, .examdate3.exhead
{
	text-align: center !important;
}

.examdateentryhead
{
	margin: 4px 3px;
	background-color: #1b2326;
	font-size: 16px;
	font-variant: small-caps;
}

.examdateentryhead span
{
	font-size: 12px;
}

/* **** Summary **** */

.summary
{
	margin: 0 5px 5px 5px;
	padding: 0 5px;
	border: 1px solid #ccc;
	background-color: #eee;
	color: #333;
	text-align: left;
	border-radius: 2px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
}

.summary img
{
	background-color: white;
	padding: 6px;
	margin: 0 10px 10px 10px;
	border-radius: 3px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
}

.summarybox
{
	background-color: #ccffff;
	border: 1px solid #1d718d;
}

.summarybox img
{
	margin: 8px;
}

.changesylmsg
{
	font-size: 11px;
	line-height: 1.2em;
}

.mcanswer
{
	background-color: #e3f4fb;
}

#position
{
	margin: 0 5px 15px 5px;
	background: #f5f5f5;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

#header
{
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: wrap;
	height: auto !important;
	min-height: 74px;
	background-color: #3d4347;
}

.gotocontent
{
	display: none;
}

#logo
{
	display: inline-block;
	width: 200px;
	height: 74px;
	order: 1;
}

#logo a
{
	display: block;
	width: 200px;
	height: 74px;
	text-indent: -999em;
	outline: none;
	background: url("/images/site/logo-cutout.png") no-repeat 0 0;
}

#syllabus
{
	text-align: center;
	display: inline-block;
	box-sizing: border-box;
	width: 300px;
	padding-left: 20px;
	background-position: left bottom;
	background-repeat: no-repeat;
	background-image: none !important;
	overflow: hidden;
	order: 2;
	color: white;
	font-size: 20px;
	line-height: 1.4em;
	margin: 8px 10px 5px 5px;
	font-family: "Century Gothic", Verdana, Arial, sans-serif;
}

#syllabus1, #syllabus2
{
	display: block;
}

/* **** Top navigation **** */

#mainNav
{
	padding: 5px;
	height: auto !important;
	height: 30px;
	min-height: 30px;
}

#mainNav div
{
	margin-top: 3px;
}

#mainNav div a
{
	font-size: 13px;
	padding: 0 4px 0 4px;
}

.menu
{
	display: inline-block;
	margin: 0 8px;
	padding: 3px 5px;
}

.menu:hover
{
	background-color: #333;
	cursor: pointer;
	color: white;
}

/* **** Module Drop-down Menu **** */

#pagemask
{
	position: absolute;
	background-color: rgba(0, 0, 0, 0.2);
	width: 100%;
	height: inherit;
	left: 0;
	top: 0;
	z-index: 999;
}

.mainmenuhead
{
	display: inline-block;
	margin-left: 8px;
	padding: 3px 5px;
	font-variant: small-caps;
	font-size: 16px;
	background-color: #e2e2e2;
}

.mainmenudown
{
	display: inline-block;
	width: 10px;
	height: 10px;
	transform: rotate(45deg);
	border-right: 1px solid #222;
	border-bottom: 1px solid #222;
	margin-left: 10px;
	position: relative;
	top: -3px;
}

.mainmenuhead:hover
{
	cursor: pointer;
	color: white;
	background-color:#333;
}

.mainmenuhead:hover .mainmenudown, .mainmenudown:hover
{
	border-color: white;
}

.amenubar
{
	height: 0;
	border: 1px solid #999;
	margin: 5px 0;
}

#modmenu, #accmenu, #abmenu
{
	box-sizing: border-box;
	position: absolute;
	background-color: #f8f8f8;
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.9);
	padding: 5px;
	font-family: "Century Gothic", Arial, Helvetica, sans-serif;
	font-size: 15px;
	z-index: 1000;
}

.mmenu, .mmenux, .amenu
{
	box-sizing: border-box;
	display: flex;
	color: #333;
}

.mmenu, .mmenux
{
	padding: 0 !important;
	margin: 1px 0 !important;
}

.amenu
{
	background-color: #eee;
	padding: 1px 5px !important;
	margin: 2px !important;
}

.mmenu:hover, .amenu:hover
{
	background-color: #333;
	cursor: pointer;
	color: white;
}

.mmenux
{
	color: #999;
}

.mmenumod
{
	align-self: flex-start;
	background-color: #555;
	color: white;
	padding: 2px 3px;
	margin: 0 10px 0 0 !important;
	min-width: 30px;
	display: inline-block;
	text-align: left;
}

.mmenu:hover .mmenumod
{
	background-color: #058;
}

.mmenusmall
{
	position: relative;
	align-self: flex-start;
	display: inline-block;
	font-size: 13px;
	min-width: 350px;
	max-width: 350px;
	overflow: hidden;
	white-space: nowrap;
	padding: 2px 3px 5px 3px;
}

.mmenusmall:hover:after
{
	display: none;
}

.mmenusmall:after
{
	content: "";
	position: absolute;
	z-index: 1001;
	bottom: 0;
	left: 0;
	pointer-events: none;
	background-image: linear-gradient(to right, rgba(255,255,255, 0) 0%, rgba(255,255,255, 0) 90%, rgba(255,255,255, 1) 100%);
	width: 100%;
	height: 25px;
}

/* **** Main content positions **** */

.contentWrapper
{
	background-color: white;
	padding: 10px 0 20px 0;
	border: 1px solid #ccc;
	overflow: hidden;
}

.contentInner
{
	padding: 15px 20px 0 20px;
}

.contentWrapperTwo
{
	background: #fff;
	margin: 15px 0 15px 0;
}

.contentContainer
{
	overflow: hidden;
	padding-bottom: 5px;
}

.contentContainer p:first-child
{
	margin-top: 2px !important;
}

.contentContainer p:last-child
{
	margin-bottom: 2px !important;
}

.contentColLeft
{
	float: left;
	width: 25%;
}

.contentColRight
{
	float: left;
	margin-left: 1%;
	width: 73%;
	border-left: 1px solid #ccc;
}

/* **** Other column layout **** */

.content2Col
{
	float: left;
	width: 49%;
	padding-right: 3px;
}

.content3Col
{
	float: left;
	width: 32%;
}

.content4Col
{
	float: left;
	width: 24%;
}

.content2ColPadder
{
	margin-left: 1%;
}

.content3ColPadder
{
	margin-left: 1%;
}

.content4ColPadder
{
	margin-left: 1%;
}

.contentPadder
{
	padding: 0 8px 10px 8px;
_border: 1px dotted blue;
}

.contentColRight .contentPadder
{
	padding: 0 0 10px 20px;
_border: 1px dotted red;
}

/* **** Footer **** */

#footer
{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	text-align: center;
	height: auto !important;
	min-height: 18px;
	margin: 0 15px;
	padding: 12px 4px;
	background: #3d4347;
}

#footer p
{
	margin: 0 8px;
}

#footer p, #footer a, #footer a:visited
{
	margin: 0;
	padding: 0;
	font-size: 13px;
	color: white;
}

#footer a:hover
{
	color: yellow;
}

#footer span.footersss
{
	display: inline-block;
	margin-left: 10px;
	color: #444 !important;
}

/* **** Glossary **** */

#glossbounds
{
	height: 620px;
}

#glosscol0
{
	float: left;
	padding: 5px;
	width: 30px;
	text-align: center;
	margin-right: 5px;
	height: 620px;
	line-height: 1.5em;
}

.gcolalpha
{
	padding: 2px 0;
}

#glosscol1
{
	padding: 5px;
	text-align: left;
	margin: 0 10px 0 5px;
	height: 620px;
	overflow: auto;
}

.glossbox
{
	margin: 2px;
	clear: both;
}

.glossbox h2
{
	font-size: 16px;
	font-weight: bold;
}

.glossbox h3
{
	font-size: 15px;
	font-weight: bold;
	color: #036;
}

.glossentry
{
	margin: 5px 5px 15px 15px;
}

.glossentry p
{
	line-height: 1.6em;
}

.glosspic
{
	float: left;
	margin: 0 10px 10px 0;
	padding: 5px;
	border: 1px solid #ddd;
	border-left: 1px solid #bbb;
	border-right: 1px solid #aaa;
	border-bottom: 1px solid #999;
	border-radius: 3px;
}

.glossquizq
{
	font-size: 11pt;
	font-weight: bold;
	padding: 10px;
	margin: 0;
}

.glossquizscore
{
	float: right;
}

.glossquizopts
{
	margin: 15px 0 20px 50px;
}

.glossanswer
{
	text-align: center;
	font-size: 11pt;
}

#gqans
{
	float: right;
	width: 100px;
}

/* **** Page header/title line **** */

#pageheader
{
	border-bottom: 1px solid #ccc;
	padding: 0 10px 10px 10px;
	font-size: 18px;
}

#pageheader a, #pageheader a:link, #pageheader a:visited, #pageheader a:active
{
	text-decoration: none;
	font-size: 18px;
}

#pageheader a:hover
{
	text-decoration: underline;
}

#pageheader .qheadgrey
{
	color: #999;
	margin: 0 5px 0 5px;
	font-size: 18px;
}

#questionid
{
	float: right;
	color: #999;
	font-size: 15px;
	border: 1px solid #ccc;
	padding: 3px 5px;
}

#questionid span
{
	font-size: 15px;
	font-weight: bold;
}

#pageheader .nparrow
{
	color: #999;
}

#pageheader .nparrow a
{
	margin: 0 2px;
	font-size: 20px;
}

#pageheader .headextra a
{
	font-size: 13px;
}

#qtitlepopup
{
	color: #444;
	border: 1px solid #ccc;
	border-radius: 1px;
	padding: 0 15px;
	margin: 0 5px;
	white-space: nowrap;
}

#qtitlepopup:hover
{
	background-color: #333;
	color: white;
	cursor: pointer;
}

/* **** Print Exam page **** */

#examtbl, .otesttbl, #examtbl2
{
	padding: 5px;
	border: 1px solid #777;
	border-radius: 5px;
	box-shadow: #ddd 2px 2px 4px;
}

#examtbl
{
	margin-left: 130px;
}

.examline
{
	background-color: #eee;
	margin: 4px;
	padding: 3px;
}

.pexothermods
{
	float: right;
}

.examsectioninner
{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	background-color: #ddd;
	padding: 8px;
}

.examhdsection
{
	font-size: 15px;
	padding: 1px 8px;
	color: white;
	font-weight: bold;
	background-color: #2a3137;
	border: 1px solid #2a3137;
	border-radius: 3px;
	box-shadow: inset 0 2px 8px rgba(255,255,255,0.5), inset -0 -2px 8px rgba(0,0,0,0.9);
}

.examtopicblk
{
	border: 1px solid #777;
	border-radius: 2px;
	padding: 8px;
	margin: 0 8px 8px 0;
	background-color: white;
}

.examhdtopic
{
	background-color: #5a6167;
	color: white;
	padding: 2px 5px;
}

.examtopicinner
{
}

.exampqline, .exampqline a
{
	font-size: 11px;
	font-weight: normal;
}


.otesttbl th, .otesttbl td
{
	border-radius: 3px;
}

.otesttbl th
{
	background-color: #5a6167;
	color: white;
	padding: 2px 5px;
}

.otesttbl td
{
	border: 1px solid #bbb;
}

td.pexammod
{
	font-size: 15px;
	color: white;
	font-weight: bold;
	background-color: #2a3137;
	border: 1px solid #2a3137;
	border-radius: 3px;
	box-shadow: inset 0 2px 8px rgba(255,255,255,0.5), inset -0 -2px 8px rgba(0,0,0,0.9);
}

#tmmk
{
	position: fixed;
	top: 280px;
	left: 30px;
	border: 1px solid #777;
	background-color: #eee;
	width: 100px;
	color: black;
	padding: 5px;
	border-radius: 3px;
	box-shadow: #ddd 2px 2px 4px;
}

/* **** Module Pages **** */

#moduleWrapper
{
	border: 1px solid #ccc;
	float: left;
	padding: 0 10px 10px 10px;
	border-radius: 5px;
}

#moduleInfo
{
	border-bottom: 1px solid #ccc;
}

#moduleLatest
{
	float: right;
	width: 22%;
}

.modsection
{
	padding: 5px;
}

.modsectionb
{
	padding: 5px;
	border-top: 1px solid #ccc;
}

.modsection a, .modsectionb a
{
	font-size: 18px;
}

.modsectblock
{
	padding-left: 34px;
}

.modulepara
{
	padding-bottom: 20px;
}

.topictext a
{
	font-weight: bold;
	font-size: 14px;
	color: #555;
}

.qmlinks a
{
	font-weight: normal;
	font-size: 13px;
	color: #777;
}

.topicblock
{
	display: flex;
	justify-content: flex-start;
	background-color: #eee;
	border-radius: 3px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
	margin: 4px 0 6px 0;
}

.topichead
{
	display: inline-block;
}

.topicheadinner
{
	text-align: left;
	font-size: 16px;
	padding: 5px;
	margin: 5px;
	width: 160px !important;
	min-width: min-content;
}

.topicquestions
{
	padding: 10px;
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	flex-basis: 100%;
}

.topicblkend
{
	display: inline-flex;
	width: 1px !important;
}

.sectioninfo
{
}

.qmlink
{
	padding: 3px 3px 3px 24px;
	margin: 5px;
	width: 200px;
	background-color: #3d4347;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
	color: white !important;
}

.qmlink:hover
{
	background-color: black !important;
	cursor: pointer;
}

.qmlink.analyse
{
	background: url("/images/qtypes/analytical, algebraic/analyse.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.engineering
{
	background: url("/images/qtypes/engineering/engineering.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.exam
{
	background: url("/images/qtypes/exam.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.quiz
{
	background: url("/images/qtypes/quiz/quiz.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.test
{
	background: url("/images/qtypes/test/test.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.video
{
	background: url("/images/qtypes/video/video.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.videolm
{
	background: url("/images/qtypes/video by Livemaths/videolivemaths.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.videomn
{
	background: url("/images/qtypes/video by mathsnet/videomathsnet.png") #3d4347 no-repeat 2px 2px;
}

.qmlink.visual
{
	background: url("/images/qtypes/visual/visual.png") #3d4347 no-repeat 2px 2px;
}

/* **** Exam Tips button **** */

.examtipwrapper
{
	margin-top: 30px;
	text-align: center;
}

.examtip
{
	display: inline-block;
	border-radius: 50%;
	padding: 8px 18px;
	margin-top: 5px;
	color: white;
	background-color: #3d4347;
	font-size: 14px;
	font-weight: bold;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}

.examtip:hover
{
	cursor: pointer;
	background-color: #262;
}

/* **** General Positioning **** */

.clearfix:after
{
	content: "";
	display: table;
	clear: both;
}

td#clrbutton
{
	color: black;
	font-weight: bold;
	font-size: 13px;
	border: 0;
	padding: 0;
	background-color: white;
	padding-bottom: 3px;
}

td#clrbutton .pexothermods
{
	float: right;
	font-size: 13px;
	padding: 2px 0 0 26px;
	font-weight: normal;
}

ul li, ol li
{
	margin-bottom: 5px;
}

/* **** Latest Additions **** */

.latestref
{
	float: left;
	color: white !important;
	background: #555;
	border-radius: 2px;
	padding: 5px 3px;
	margin-right: 8px;
	width: 45px;
	text-align: center;
}

.latestadtn
{
	margin: 2px 0 5px 0;
	text-align: left;
	background-color: #f2f2f2;
}

.latestadtn:hover
{
	background-color: #e2e2e2;
	color: black;
	cursor: pointer;
}

/* **** Common Home Pages **** */

.hsamples
{
	font-size: 12px;
	margin: 3px 0;
	padding: 2px 3px;
}

.hmodlist
{
	padding: 2px 3px;
	background-color: #f8f8f8;
	margin-bottom: 3px;
}

.hmodlist:hover, .hsamples:hover
{
	cursor: pointer;
	background-color: #ddd;
}

.hmodlistl
{
	text-align: left;
	font-size: 15px;
	color: black;
	font-weight: bold;
}

.hmodlistr
{
	float: right;
	text-align: right;
	padding-top: 1px;
	font-size: 14px;
	font-weight: normal;
}

.facebook
{
	float: right;
	padding-right: 8px;
}

.homepgtable
{
	border: 1px solid #ccc;
	padding: 3px;
	background-color: #eee;
	border-spacing: 3px;
}

.homepgtable th
{
	background-color: #777;
	color: white;
	padding: 2px 3px;
}

.homepgtable td
{
	background-color: white;
	padding: 2px 3px;
}

.infobox
{
	border: 1px solid #ccc;
	border-radius: 2px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
	height: auto;
	padding: 3px 3px 3px 95px;
	margin: 0 4px 4px 0;
	overflow: hidden;
}


.infobox a
{
	margin-bottom: 20px !important;
	font-size: 13px !important;
	font-weight: bold !important;
}

.infobox img
{
	float: left;
}

/* **** Syllabus List **** */

#syllist
{
	width: 100%;
}

#syllist th
{
	font-size: 15px;
	font-weight: bold;
	color: white;
	background-color: #555;
	padding: 3px;
}

#syllist td
{
	font-size: 14px;
	font-weight: bold;
	padding: 3px;
}

/* **** Targetted Messages **** */

#targetmsg
{
	font-size: 16px;
	padding: 8px;
	background-color: #0d8404;
	color: #f8f8f8;
	font-family: "Century Gothic", Arial, sans-serif;
}

#targetmsg #tgtclose
{
	float: right;
	margin-top: -6px;
	font-size: 24px;
	padding: 4px;
	transform: scale(1.4,1);
	cursor: pointer;
}

#targetmsg #tgtclose:hover
{
	background-color: #c00;
}

#targetmsg p, #targetmsg p a
{
	font-size: 18px;
	font-family: "Century Gothic", Arial, sans-serif;
}

#targetmsg li
{
	margin: 8px 0;
	font-family: "Century Gothic", Arial, sans-serif;
}

#targetmsg li, #targetmsg li a
{
	font-size: 16px;
}

#targetmsg a, #targetmsg li a
{
	color: white;
	font-weight: bold;
}

#targetmsg a:hover, #targetmsg li a:hover
{
	color: yellow;
	text-decoration: none;
}

/* **** Beacon **** */

.beacon
{
	box-sizing: border-box;
	position: fixed;
	z-index: 4000;
	border-radius: 50%;
	animation-duration: 2.5s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

#beacon1
{
	border-top: 30px solid #335;
	border-bottom: 30px solid #335;
	border-left: 30px solid #bdb;
	border-right: 30px solid #bdb;

	border-top: 30px solid #222;
	border-bottom: 30px solid #222;
	border-left: 30px solid #bfb;
	border-right: 30px solid #bfb;

	width: 200px;
	height: 200px;
	top: calc(50% - 75px);
	left: calc(50% - 75px);
	animation-name: brotate1;
	opacity: 0.75;
}

#beacon2
{
	border-top: 30px solid #686;
	border-bottom: 30px solid #686;
	border-left: 30px solid #cce;
	border-right: 30px solid #cce;

	border-top: 30px solid #666;
	border-bottom: 30px solid #666;
	border-left: 30px solid #ccf;
	border-right: 30px solid #ccf;

	width: 170px;
	height: 170px;
	top: calc(50% - 60px);
	left: calc(50% - 60px);
	animation-name: brotate2;
	opacity: 0.5;
}

@keyframes brotate1
{
	from {transform: rotate(0deg);}
	to {transform: rotate(360deg);}
}

@keyframes brotate2
{
	from {transform: rotate(360deg);}
	to {transform: rotate(0deg);}
}

/* **** ThreeJS container **** */

#container3
{
	float: right;
	width: 300px;
	height: 300px;
	margin: 20px;
	border: 1px solid #999;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}

/* **** Front Page Personal Info **** */

.taskblock
{
	border: 1px solid #3d4347;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
	margin: 3px 0 6px 0;
}

.taskdetails
{
	background-color: #3d4347;
	color: white;
	padding: 8px;
	font-size: 13px;
	font-weight: normal;
	line-height: 1.4em;
}

.taskdetails:hover
{
	background-color: #4d5357;
	cursor: pointer;
}

.taskids
{
	padding: 3px;
}

.taskid
{
	box-sizing: border-box;
	display: inline-block;
	width: 60px;
	padding: 2px 6px;
	text-align: center;
	margin: 1px;
	border: 1px solid black;
	color: white;
	text-shadow: -1px -1px black, 1px 1px black, -1px 1px black, 1px -1px black;
	font-family: "Century Gothic", Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	border-radius: 11px;
	letter-spacing: 0.1em;
}

.taskid:hover
{
	background-color: white !important;
	color: black;
	cursor: pointer;
	text-shadow: 0 0 0 black;
}

.fpclasses
{
	background-color: #3d4347;
	color: white;
	padding: 2px 8px;
	font-size: 13px;
	margin: 3px 2px;
	display: inline-block;
	width: 200px;
	text-align: center;
}

.fpclasses:hover
{
	background-color: #4d5357;
	cursor: pointer;
}

.accshort
{
	box-sizing: border-box;
	display: inline-block;
	padding: 2px 9px;
	text-align: center;
	margin: 2px 5px;
	border: 1px solid black;
	background-color: #bdf86e;
	color: black;
	font-family: "Century Gothic", Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	border-radius: 11px;
	letter-spacing: 0.05em;
}

.accshort:hover
{
	background-color: yellow;
	cursor: pointer;
}

#oldsyllabusbox, #oldsyllabusbox h2
{
	background-color: red !important;
}

#oldsyllabusbox a
{
	font-size: 14px !important;
}

.oldsylmsg
{
	display: inline-block;
	font-size: 12px;
	font-style: italic;
	margin-left: 8px;
}

/* **** Payment Table **** */

.payment
{
	background-color: #eee;
	font-size: 15px;
	border-spacing: 6px;
	padding: 5px;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}

.payment td
{
	background-color: #033961;
	padding: 4px 8px;
	color: white;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

/* **** Subscription Grid **** */

#subscreen
{
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: auto;
	column-gap: 20px;
	grid-column-gap: 20px;
}

/* **** Media Changes **** */

@media only screen and (max-width: 1000px)
{
	#subscreen
	{
		grid-template-columns: 100%;
		grid-template-rows: auto auto;
	}
}

@media only screen and (max-width: 900px)
{
	#logo
	{
		order: 1;
	}

	#utility
	{
		order: 2;
	}

	#syllabus
	{
		order: 3;
		display: flex;
		justify-content: space-around;
		clear: both;
		width: auto;
	}

	#syllabus1, #syllabus2
	{
		display: inline-block;
	}

	#syllabus2
	{
		margin-left: 30px;
	}

	.infobox
	{
		padding: 100px 3px 3px 3px;
	}
}

@media only screen and (max-width: 600px)
{
	#header
	{
		justify-content: center;
	}

	#syllabus
	{
		display: block !important;
	}

	#syllabus1, #syllabus2
	{
		display: block !important;
	}

	#syllabus2
	{
		margin: 0;
		font-size: 100% !important;
	}

	#footer
	{
		display: block;
	}

	#footer p
	{
		display: block;
		margin-bottom: 8px;
	}

	#footer p, #footer p a
	{
		font-size: 16px !important;
	}
}