@charset "utf-8";

/* TEFL LONDON style sheet
modified by shio 11 January 2010 */

/* -----------------------------------------------------------

BASIC LAYOUT

----------------------------------------------------------- */

body {
background:url(../images/bg.gif) repeat ;
margin:0;
color:#333;
line-height:1.5em;
font-size:12px;
font-family:Verdana,Sans-Serif;
height:100%;
text-align:left;
}

img{
border:0
}

.page{
width:780px;
background-color: #FFF;
padding: 0 10px 10px 10px;
margin:0 auto 0 auto;
}


.rightcol{
float:left;
width:150px;
background-color:#FFF;
}


.main{
float:left;
width:630px;
background-color:#dde7fb;
clear:both;
}


.content{
float:right;
width:450px;
padding:0 15px 20px 15px;
background-color:#FFF;
}


.leftcol{
float:left;
width:150px;
background-color: #dde7fb;
height:100%;
}

.clears{
clear:both;
}


.foot{
clear:left;
background-color: #FFF;
font:10px/1.5em Verdana;
color:#999;
margin: 10px auto 20px auto;
}

.header {
margin:0;
background-color: #FFF;
height: 99px;
}


#topnav {
padding:-2px 0;
margin:10px 0 15px 0;
background:#3e64a8;
}


#address {
float:right;
text-align:right;
font:11px/1.6em Verdana,sans-serif;
color:#305098;
margin-top:30px;
}

p {
margin:20px 0 10px 0;
}


a,
a:link,
a:active,
a:visited {
text-decoration:none;
color:#24609b;
}

a:hover {
text-decoration:none;
color:#067bcf;
}


hr {
color: #CCCCCC;
background-color:#CCCCCC;
height:1px;
width: 100%;
border: 0;
}


hr.grey {
color: #CCCCCC;
background-color:#CCCCCC;
height:1px;
width: 100%;
border: 0;
}



hr.footer {
color: #CCCCCC;
background-color:#CCCCCC;
height:1px;
width: 100%;
border: 0;
margin:20px 0;
}



hr.bluedot {
color: #24609b;
background-color:#24609b;
height:1px;
width: 100%;
border: 0;
}

ul {
margin: 0;
padding: 0;
list-style: none;
}

li {
}


ul.num {
list-style:decimal outside;
padding:10px;
}


li.num {
margin:15px 0 15px 20px;
}


ul#arrow {
list-style-image:url(http://www.tefllondon.com/tefl/images/arrow.gif);
list-style-position:outside;
margin-left:30px;
}

li#arrow {
margin:5px 0;
}


ul.arrow {
list-style-image:url(http://www.tefllondon.com/tefl/images/arrow.gif);
list-style-position:outside;
margin-left:30px;
}

li.arrow {
margin:5px 0;
}


ul.greyline {
margin: 0;
padding: 0;
list-style: none;
border-top:#CCCCCC 1px solid;
}

li.greyline {
border-bottom:#CCCCCC 1px solid;
padding:5px 0;
}


.searchbox {
margin:5px 0;
background:url(../images/bt_search.gif)  no-repeat left;
width:170px;
float:right;
}

input {
border:#CCCCCC 1px solid;
font-size:11px;
color:#666666;
margin-left:25px;
width:140px;
}

.inputbox {
color: #333;
border: 1px solid #CCC;
background: #FFF;
font: 10px Verdana, sans-serif;
}



/* -----------------------------------------------------------

   MAMBO style

----------------------------------------------------------- */


/* navigation */



#active_menu {
background-color:#FFF;
color:#d11b1a;
text-decoration:none;
}

a.mainlevel:link, a.mainlevel:visited {
padding:5px;
display: block;
color: #1f61a2;
width: 140px;
text-decoration: none;
font-size:12px;
border-bottom:#fff solid 1px;
}

a.mainlevel:hover {
color: #fff;
background-color:#a2d4f1;
text-decoration:none;
}

a.mainmenu:link, a.mainmenu:visited {
color: #ffffff; 
font-size: 12px;
}

a.mainmenu:hover {
color: #a2d4f1;
}

a.sublevel:link, a.sublevel:visited {
background:#FFFFFF;
font-size: 11px;
color: #1f61a2;
text-align:left;
display:block;
padding:2px 0 4px 15px;
text-decoration:none;
list-style:none;
border-top:#dde7fb 1px solid;
margin-top:-1px;
}

a.sublevel:hover {
color: #d11b1a;
text-decoration: none;
display:block;
list-style:none;
}


/*** top menu ***/

.mainlevel-nav,a.mainlevel-nav:link, a.mainlevel-nav:visited  {
color:#fff;
text-decoration: none;
font: bold 12px/1.5em Verdana, sans-serif;
padding:5px;
margin:0 3px 0 0;
display:block;
float:left;
background:#3e64a8;
}

a.mainlevel-nav:hover {
color: #8dc5e6;
text-decoration:none;
}

#active_menu-nav {
color:#8dc5e6;
text-decoration:none;
}

/** pathway block **/

span.pathway {
display:block;
text-align:left;
color:#666;
font-size:10px;
height:20px;
margin-bottom:10px;
}

/** content title **/

.componentheading {
font-family: Verdana, sans-serif;
color:#3e64a8;
font-size: 20px;
line-height:25px;
padding: 5px 0;
display:block;
}

.contentheading,
.contentpagetitle,
a.contentpagetitle:link,
a.contentpagetitle:active,
a.contentpagetitle:visited {
font: bold 16px/1.7em Verdana, sans-serif;
color:#305098;
padding-top: 25px;
margin-bottom:10px;
display:block;
}

.contentpaneopen {
width:100%;
}


/** content title  JOB VACANCIES**/

.componentheading_job {
font: bold 14px/1.7em Verdana, sans-serif;
color:#00a2ab;
display:block;
margin-bottom:30px;
}

.contentheading_job,
.contentpagetitle_job,
a.contentpagetitle_job:link,
a.contentpagetitle_job:active,
a.contentpagetitle_job:visited {
font: bold 14px/1.7em Verdana, sans-serif;
display:block;
background:#00a2ab;
padding:5px 8px;
color:#FFFFFF;
}

.contentpaneopen_job {
width:434px;
margin-bottom:10px;
}


/* latestnews */

table.moduletable th {
padding: 3px 0px 3px 0px;
margin-bottom: 5px;
width: 150px;
color:#FFF;
text-indent:5px;
font-weight:bpld;
background-color:#3e64a8;
text-align:left;
font-size:11px;
border-bottom:#FFF 1px solid;
}


ul.latestnews {
font:11px/1.6em Verdana,sans-serif;
font-size:10px;
width:139px;
padding-bottom:10px;
}


li.latestnews{
text-indent:0px;
border-bottom:#999999 dotted 1px;
padding:3px;
}

a.latestnews:link, a.latestnews:visited {
font:11px/1.6em Verdana,sans-serif;
text-align:left;
color:#666666;
}

a.latestnews:hover {
text-decoration:none;
color:#3d97c6;
}


.currentdate {
font:11px/1.6em Verdana,sans-serif;
color:#666666;
padding:5px 0 10px 0;
float:right;
}


.createdate{
font:11px/1.6em Verdana,sans-serif;
color:#999;
padding:5px 0 10px 0;
float:right;
}


/* --------- FONTS ---------- */

.author { 
font:12px/1.7em Verdana, sans-serif;
color:#999999;
margin-bottom:10px;
}


.grey10 {
font:11px/1.6em Verdana,sans-serif;
color:#666666;
padding:5px 0 10px 0;
}


.blue10 {
font:11px/1.6em Verdana,sans-serif;
color:#24609b;
padding:0 0 10px 0;
}

.blue12 {
font:12px/1.6em Verdana,sans-serif;
color:#24609b;
padding:0 0 10px 0;
}

.blue14 {
font:bold 14px/1.6em Verdana,sans-serif;
color:#24609b;
padding:0 0 10px 0;
}


h1 {
font:bold 18px/1.8em Verdana,sans-serif;
color:#dd2f2f;
margin:10px 0 40px 0;
padding:0 15px;
border-left:#dd2f2f 15px solid; 
}

h2 {
font:bold 16px/1.8em Verdana,sans-serif;
color:#305098;
padding:20px 0 10px 0;
}

h3 {
font:bold 12px/1.8em Verdana,sans-serif;
color:#305098;
}

.red {
color:#c31414;
}

.red16 {
font:bold 16px/1.8em Verdana,sans-serif;
color:#c31414;
}

.red12 {
font: 12px/1.7em Verdana,sans-serif;
color:#c31414;
}

.bluebar {
font:bold 14px/1.8em Verdana,sans-serif;
color:#fff;
background:#91afe4;
padding:3px;
margin:30px 0 15px 0;
}


table.bluetable {
width:100%;
border-top:1px solid #e5eff8;
border-right:1px solid #e5eff8;
border-collapse:collapse;
}

table.bluetable td {
color:#678197;
border-bottom:1px solid #e5eff8;
border-left:1px solid #e5eff8;
}

tr.bluetable td {
background:#91afe4;
color:#FFFFFF;
}

table.tablegrey {
border-top:1px solid #CCCCCC;
border-collapse:collapse;
}

table.tablegrey td {
border-bottom:1px solid #CCCCCC;
}

table.tablegrey th {
border-bottom:1px solid #CCCCCC;
}

.fac {
width:150px;
font:11px/1.6em Verdana,sans-serif;
color:#666666;
text-align:right;
padding:0;
}

.formtable {
border-top:#ccc 1px solid;
}

.formtable td {
background-color:#fff;
border-bottom:#ccc 1px solid;
}

.formtable2 {
border-top:#ccc 1px dotted;
}

.formtable2 td {
background-color:#fff;
border-bottom:#ccc 1px dotted;
}


/* -----------------------------------------------------------

   images

----------------------------------------------------------- */

img.right{
float:right;
margin-left:10px;
}

img.left {
float:left;
margin-right:10px;
}

img.border {
border:#CCCCCC 1px solid;
padding:10px;
}

.bluebox {
border:#24609b 1px solid; 
padding:10px;
}

.bluebox2 {
background-color:#e0effd;
padding:15px;
margin:30px 0;
}

/* timetable */

caption.timetable {
font:bold 11px/1.4em Verdana, sans-serif;
color:#FFFFFF;
border-bottom:2px solid #FFF;
background:#305098;
padding:3px;
}

table.timetable {
font:10px/1.4em Verdana, sans-serif;
border-top:1px solid #FFF;
border-right:1px solid #FFF;
border-collapse:collapse;
}

table.timetable td {
border-bottom:2px solid #FFF;
border-left:2px solid #FFF;
text-align: left;
}

tr.timetable td {
font:bold 10px/1.4em Verdana, sans-serif;
background:#62b5e9;
font-weight:bold;
color:#FFFFFF;
}

table.timetable th {
font:bold 10px/1.4em Verdana, sans-serif;
border-bottom:2px solid #FFF;
border-left:2px solid #FFF;
color:#FFFFFF;
background:#a3d6f5;
text-align: center;
}

table.timetable th.other {
font:bold 10px/1.4em Verdana, sans-serif;
border-bottom:2px solid #FFF;
border-left:2px solid #FFF;
color:#c31414;
background:#f3dddd;
text-align: left;
}

table.timetable td.other {
border-bottom:2px solid #FFF;
border-left:2px solid #FFF;
color:#c31414;
background:#f3dddd;
}



/* apply button */

ul#applynav{
list-style:none;
float:right;
width:354px;
margin:20px 0;
height:22px;
}

ul#applynav li{
list-style:none;
float:left;
width:177px;
}

ul#applynav a{
display:block;
width:177px;
height:22px;
text-indent:-9999px;
background-image:url(http://www.tefllondon.com/tefl/images/buttons/apply.gif);
overflow:hidden;
}

a.price{
background-position:0px -22px;
}

a:hover.price{
background-position:0px 0px;
}

a.apply{
background-position:177px -22px;
}

a:hover.apply{
background-position:177px 0px;
}
