@charset "utf-8";
/* CSS Document */

/* Initial Settings */
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0;padding:0; font-family:'Open Sans', sans-serif; font-size:16px; line-height:1.3; text-align:center; background-color:#fefeff;}

/* Colours */
body{color:#013B6B;}
#TopBar, #MainMenuBar, #MainMenu a, #MainMenuPhone a{color:#fff;}
#MainMenu a:hover{ color:#0291C8; text-decoration:none;}
.SubMenu{background-color:#000;}
.SubMenuBody, .SubMenuPhoneBody, .SubMenuBodySmall{background-color:#000; border-color: #000; color: #013B6B;}
.SubMenuBody a, .SubMenuPhoneBody a, .SubMenuBodySmall a{color:#fff !important; background-color:000 !important; margin:3px 0px 3px 0px !important;}
.SubMenuBody a:hover, .SubMenuPhoneBody a:hover, .SubMenuBodySmall a:hover{color:#0291C8 !important;background-color:#000 !important;}
#FooterBar{background-color:#efefef; color:#333; text-align:center; padding:20px; border-top: 5px solid #000;}
#FooterBar p{text-align:center; }
#FooterBody a{color:#333;}
#FooterBody a:hover{color:#013B6B;}
a{color:#013B6B; color:#0291C8;}
a:hover{color:#013B6B; color:#0291C8; text-decoration:underline;}
hr{border-color:#013B6B;}

input, select, .StandAloneButton{border: 1px solid #013B6B; color: #013B6B; font-weight:100;}
textarea{border-color: #013B6B; color: #efefef;}
input[type="submit"], input[type="button"], .StandAloneButton{background-color:#eef;}
input[type="submit"]:hover, input[type="button"]:hover, .StandAloneButton:hover{color:#fff; background-color:#0080ef; text-decoration:none;}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus{border-color: #339; background-color:#efffef;}
.FieldError{border-color: #ee3333; background-color:#fee;}

/*input[type=submit], input[type=submit]:hover{ background:none; background-color:#0291C8; color:#fff; padding:6px; text-align:center; border:none;}
input[type=submit]:hover{ color:#ccc; }*/

table{border-color: #0080ef;}
/*th{color:#000;}*/

.InfoBox, .MenuBox{border-color:#0080ef; background-color:#fffaea;}
.InfoBoxClear{border-color:#0080ef;}
.InfoBox h2, .InfoBoxClear h2, .MenuBox h2{color:#fff; background-color:#0080ef;}
.CorpBox{border-color:#ff5000; background-color:#fff;}
.CorpBox h2{color:#fff; background-color:#ff5000;}
.BusCardBox{border-color:#ddd; background-color:#fffaea;}
.BusCardBox h2{color:#0080ef; background-color:#ddd;}
.BusCardInstruments{color:#0080ef;}
.BusCardMoreInfo{color:#0080ef;}
.BusCardMoreInfo:hover{color:#fff; background-color:#0080ef;}
.MoreInfoPanel{border-color:#0080ef; background-color:#ffffdd;}/* in-line panel which appears with jQuery */

.Red{color:#C00;}
a.LinkOnPic{color:#fff; background-color:#0080ef;}
a.LinkOnPic:hover{color:#0080ef; background-color:#fff;}
a.MoreInfoLink:hover{color:#0080ef; background-color:transparent;}
.rhWhiteBlue{color:#fff; background-color:#0080ef;}
.rhOrangeGrey{color:#ff5000; background-color:#eee;}
.rhWhiteOrange{color:#fff; background-color:#ff5000;}

.tab {background-color:#ddd;}
.tab:hover {background-color:#0080ef; color:#fff;}
.selected_tab {background-color:#fff;}

.ErrorTxt{color:#E00;}
.CompletedTxt{color:#0E0;}
.ListHeader{color:#66f; background-color:#eee;}
.LinkLike{color:#66f;}
.LinkLike:hover{color:#fff; background-color:#0080ef;}

/* Main layout */
#TopBar{position:relative; width:100%; height:12px; margin:0px auto;}
#BannerWrap{position:relative; height:auto; margin:0px auto; text-align:left; background-color:#000000; padding-top:10px;}
#Banner{position:relative; max-width:1000px; min-width:400px; height:auto; margin:0px auto; text-align:left;}
#BannerLogo{position:relative; }
#BannerLogo img{height:auto; border:0 none; float:left; max-width:240px;}
#BannerLogo p{color:#FFFFFF; font-size:28px; text-align:right; line-height:45px; float:right; padding:5px;}
#MainMenuBar{position:relative; width:100%; height:auto; margin:0px auto 10px; padding:4px 0px; text-align:right; clear:both;}
#MainMenu{position:relative; max-width:1000px; height:auto; margin:0px auto; font-size:16px;}
#MainMenuPhone{position:relative; display:none; font-size:1em; /*min-width:340px;*/}
#MainMenu a{padding:0px 10px;}
#MainMenuPhone a{padding:0px 8px;}
#MainMenuPhone a:hover{ color:#0291C8; text-decoration:none;}
#MainMenu a.WithSub:hover{padding-bottom:4px;}
.SubMenu, .SubMenuPhone{position:absolute; top:1px; right:0px; width:100%; margin:20px 0px 20px 0px; padding:3px 0px; z-index:99; display:none; text-align:left; background-color:#333333; border-top:2px solid #000000;}
.SubMenuBody{position:relative; width:95%; margin:0px 0px 0px 5%; font-size:0.8em; padding:8px 4px 10px; background-color:#333333;}
.SubMenuBodySmall{position:relative; width:50%; margin:0px 0px 0px 50%; min-width:200px; font-size:0.8em; padding:8px 4px 10px; background-color:#333333;}
.SubMenuPhoneBody{position:relative; margin:6px 0px 0px 10%; font-size:0.8em; padding:8px 4px 10px; background-color:#333333;}
.SubMenuBody h3, .SubMenuPhoneBody h3, .SubMenuBodySmall h3{font-size:1.1em; padding:3px;color:#0291C8 !important; font-weight:100 !important;}
.SubMenuBody a, .SubMenuBodySmall a{display:block; width:96%; font-weight:normal; padding:0px 4px !important; margin:3px 0px 3px 0px !important;}
.SubMenuPhoneBody a{display:block; width:99%; font-weight:normal; padding:0px 8px !important;}
#PageBody{position:relative; max-width:1000px; min-width:400px; margin:0px auto; text-align:left;}
#FooterBar{position:relative; width:100%; margin:0px auto;}
#FooterBody{position:relative; max-width:1000px; margin:10px auto; text-align:left; font-size:0.8em; line-height:1.1;}
.Spacer{width:100%; height:10px; font-size:9px;}
.SpacerBig{width:100%; height:30px; font-size:9px;}

.row {position:relative; width: 100%; clear:both; margin:0px 0px 8px 0px;}
.row.spaceTop, .spaceTop {margin-top:30px;}
.row.spaceTopSmall, .spaceTopSmall {margin-top:16px;}
.row.spaceBottom, .spaceBottom {margin-bottom:30px;}
.row.spaced {padding:2px 0px; margin:6px 0px 12px 0px;}
.row::after {content: "";clear: both;display: block;}
.col-1 {width: 8.33%; float:left;}
.col-2 {width: 16.66%; float:left;}
.col-3 {width: 25%; float:left;}
.col-4 {width: 33.33%; float:left;}
.col-5 {width: 41.66%; float:left;}
.col-6 {width: 50%; float:left;}
.col-7 {width: 58.33%; float:left;}
.col-8 {width: 66.66%; float:left;}
.col-9 {width: 75%; float:left;}
.col-10 {width: 83.33%; float:left;}
.col-11 {width: 91.66%; float:left;}
.col-12 {width: 100%; float:left;}
[class*="col-"] {position:relative;}
.colX-6 {position:relative; width: 50%; float:left;} /* This one is to be able to keep a 2-column layout on a phone*/


/* Containers */
.InfoBox, .InfoBoxClear, .CorpBox, .MenuBox, .BusCardBox{position:relative; width:96%; margin:4px 2%; padding:0px;}
.InfoBox p, .CorpBox p, .MenuBox p, .BusCardBox p{padding:4px; font-size:0.8em;}
.InfoBox h2, .InfoBoxClear h2, .CorpBox h2, .MenuBox h2{padding:4px; font-size:1.1em;}
.InfoBox img{width:100%;}
.CorpBox{min-height:240px;}
.CorpBox img{width:auto; max-width:98%; margin:2px 1%;}
.BusCardBox{min-height:130px; padding-bottom:20px;}
.BusCardBox h2{padding:1px 4px 2px; font-size:1em; font-weight:normal;}
.BusCardInstruments{position:absolute; left:2px; bottom:2px; font-size:0.9em; line-height:1;}
.BusCardMoreInfo{position:absolute; right:1px; top:1px; font-size:1.1em; font-weight:bold; line-height:1; padding:1px 8px; cursor:pointer;}
.BusCardDistance{position:relative; font-size:0.8em; font-weight:normal; line-height:1; padding:2px 0px; text-align:right;}
.BusCardWebLink{position:relative; display:block; font-size:0.8em; font-weight:normal; line-height:1; padding:0px 2px 1px; margin:2px 0px; text-align:right;}
.BusCardIntroLesson{position:relative; display:block; width:100%; text-align:right;}
.BusCardExpExamTut{background-color:#FF9; font-size:0.9em; padding:2px; margin:-8px 0px 0px; text-align:center;}
.MenuBox a{display:block; width:96%; margin:4px 2%; padding:1px 2px 2px;}
.MoreInfoPanel{position:relative; display:none; margin:4px 2px; padding:4px; }


/* Common Basic Styles */
h1, h2, h3, h4, h5, h6{line-height:1.2; margin:0px; padding:25px 4px 4px 0px; color:#013B6B; clear:both;}
h1{font-size:2em;}
h2{font-size:1.6em;}
h3{font-size:1.6em;}
h4{font-size:1.4em; }
h5{font-size:1.2em; font-weight:normal;}
h6{font-size:1em;}
p{margin:0px; padding:6px 0px 6px 0px;}
a{text-decoration:none; padding:0px 2px; font-weight:100;}
hr{width:100%; margin:8px auto;}
img {width:auto; height:auto; max-width:100%; border:none;}
ul{margin:4px 0px; padding:0px 0px 0px 30px;}
div.reguired-at-grade ul{padding:0px 0px 0px 20px;}
li{padding:2px 0px 0px 0px;margin:0px 40px 0px 0px; font-size:90%;}
li a{display:inline-block; width:90%;}
ul.TightList li{padding:1px 0px 1px 8px;}

/* General Styles */
.Centered{text-align:center;}
.TxtRight{text-align:right;}
.Bold{font-weight:bold;}
.Italic{font-style:italic;}
.Small{font-size:0.8em;}
.vSmall{font-size:0.7em;}

/* Images */
.ImgLeft{float:left;}
.ImgRight{float:right;}

/* Forms and Fields */
form{width:100%; margin: 4px auto; padding:0px 4px;}
form.FmBorder{ padding:4px; }
form .row{margin:0px;}
form [class*="col-"] {padding:2px 4px;}
form .FldText {padding-top:5px;}
form h3{padding-left:0px;}
input, select, .StandAloneButton{font-size:1.1em; padding:1px 2px; border-width:1px; border-style:solid; border-radius:3px; box-shadow:0px 0px 3px #999;}
textarea{font-size:0.9em; padding:1px 2px; font-family:inherit; line-height:1.1;}
select, input[type="checkbox"], input[type="radio"]{width:auto;}
input, textarea, select.FullWidth{width:100%;}
input[type="submit"], input[type="button"], .StandAloneButton{cursor:pointer; }
/* Various width settings for input fields */
input.FldDate{width:120px;}
input.FldPostCode{width:100px;}
input.FldSmall{width:90px;}
input.FldMedium{width:200px;}
select.SelSmall{font-size:0.8em; padding:0px 2px; line-height:1;}
input.btnSmall{width:90px; font-size:1em; padding:1px 2px;}

.StandAloneButton{display:block; text-align:center; margin:4px; font-size:1.2em; padding:2px; font-weight:normal;}

/* Tables */
table{width:98%; margin:4px 1%; padding:0px;}
form table{border:none; box-shadow:none;}
tr{padding:0px;}
tr.ShadedRow{background-color:#DEF;}
th, td{margin:0px; padding:1px 8px 2px 4px; text-align:left; border:none;}
.TblSpaced td{padding:5px 8px 6px 4px;}
.CellRight{text-align:right;}
div.CellCenter, td.CellCenter{text-align:center;}
table.TeachingSpec{border-width:2px; box-shadow:none;}
table.TeachingSpec th, table.TeachingSpec td{margin:0px; padding:1px 8px 1px 4px; text-align:left; border:none; font-size:0.8em;}

/* Tabbed Block */
#tabbed-block {position:relative; width:100%; height:auto; text-align:left; margin:0px; padding:10px;}
.tab {position:relative; width:130px; margin:0px 2px 0px 0px; padding:6px 2px 6px 2px; float:left; text-align:center; font-weight:bold; z-index:2; font-size:1em; font-weight:normal;}
.selected_tab {z-index:4;}
.tab-body {position:relative; width:100%; border:1px #999 solid; margin:-2px 0px 0px 0px; padding:8px 4px 4px 4px; float:left; clear:both; overflow:hidden; z-index:3}
.TutorInfo{min-height:480px;}


/* Special styles */
.ReversedHeader{font-size:16px; font-weight:bold; padding:1px 4px 2px 4px; margin:8px 0px 4px 0px;}
.PopUpLink{cursor:pointer;}
.ListHeader{font-weight:bold;}
.LinkLike{font-weight:bold; cursor:pointer; padding:0px 4px; display:inline-block;}
.FullWidthLink{display:block; width:100%;}


/* alterations for narrower screens #1 */
@media screen and (max-width:890px){
	#SocialMediaStrip{display:none !important;}
	.SubMenuBody{width:100%; margin:0px;}
	.tab{width:100px; font-size:0.9em;}
}

/* alterations for narrower screens #2 */
@media screen and (max-width:700px){
	#MainMenu{display:none !important;}
	#MainMenuPhone{display:block !important;}
	#LogIn{display:none !important;}
	#LoggedInInfo{display:none !important;}
	#LoggedInInfoSmallScreen{display:block !important;}
	.ChangeEarly{width: 100%;}
}

/* alterations for mobile phones */
@media screen and (max-width:601px){
	[class*="col-"] {width: 100%;}
	.CorpBox{min-height:auto !important;}
	.tab{width:100%; font-size:0.9em;}
}

/********************************************************/
div.reguired-at-grade, div.book-block { padding: 5px;  background-color: #F3F3F3;  border: 1px solid #999999;}
div.book-block { margin:20px 0px 20px 0px; background-color:#CBDCE4; background-color:#E3EEF2;}
ul.inline-list{ clear:both;}
ul.inline-list li{ float:left;}
div.reguired-at-grade ul li {padding: 2px 30px 2px 0px;list-style-type: none;}
div.reguired-at-grade ul.inline-list li {float: left;}

.width-90{ width:90%;}

.valign-top{vertical-align:top;}

table.pp-table {margin:0px; padding:0px; text-align:center; width:95%;}
table.pp-table th, table.pp-table td {margin:0px; padding:0px; text-align:center; }
table.pp-table th, table.pp-table td {margin:0px; padding:0px; text-align:center; }
table.pp-table th {background-color:#eee;}
table.pp-table tr th:nth-child(1) { margin:5px;}

table.pp-subtable{width:99%; margin:0px; padding:2px; text-align:center; border:#CCCCCC 1px  solid; border-left:none; border-right:none;}
table.pp-subtable td, table.pp-subtable th{width:8%; margin:0px; padding:2px; text-align:center;}
table.pp-subtable td.pp-subtable-td-left, table.pp-subtable th.pp-subtable-td-left{width:25%; text-align:left;}
table.pp-subtable-no-border{border:none;}

table.ws-table {margin:0px; padding:6px; text-align:center; width:50%;}
table.ws-table th, table.ws-table td {margin:0px; padding:6px; text-align:center; }
table.ws-table th.ws-left-td, table.ws-table td.ws-left-td {text-align:left; }

.generalerror {color:#FF0000;}

table.downloadtable {margin:0px auto 0px auto; padding:6px; width:80%; border:none;}
table.downloadtable tr td {background-color: #eee; padding:3px;}

img.examreglogo{ width:200px;}

table.fees-table, table.fees-table-large{ border:1px solid #013B6B;}
table.fees-table-large{ width:60%; margin:0px auto 0px auto;}
table.fees-table tr td:nth-child(2), table.fees-table tr td:nth-child(3){ text-align:right !important;}
table.fees-table tr.grey-row{ background-color:#F0F0F0;}

@media screen and (max-width: 601px){
	table.fees-table-large{ width:98%;}
}

