/* =========================================
    Layout Styles for i-to-i TEFL Ireland
	Sept 2009
	See global.css for browser specs
	
	-- Hacked up and somewhat fixed from original 28/10/2009 Chris Leach --
	
   ========================================= */   

/* ===== header =================================================================== */

div#header {
	width: 100%;
	background: #888 url(/gfx/bg-header.gif) no-repeat bottom center;
	}

#header .header-inner {
	width: 980px;
	margin:0 auto 0 auto;
	position:relative;
}

#header .header-inner a#logo-main {
	float:left;
	width:144px;
	height:118px;
	background: url(/gfx/logo.png) no-repeat top left;
	_background: url(/gfx/logo.gif) no-repeat top left;
}
#header .header-inner a#logo-main span { display:block; width:144px; height:118px; text-indent:-5000px; }

/* Main navigation */

#header .header-inner ul#main-nav { position:absolute; bottom:0; right:0; margin:0; padding:0; }
#header .header-inner ul#main-nav li {
	float:left;
	margin:0;
	padding:0;
	background:url(/gfx/nav-separator.gif) repeat-y bottom right;
}
#header .header-inner ul#main-nav li.nav-4 { background:none; }

#header .header-inner ul#main-nav li a { display:block; }
#header .header-inner ul#main-nav li a span { display:block; width:97px;text-indent:-5000px; }
#header .header-inner ul#main-nav li.nav-1 a { width:136px; height:55px; background: url(/gfx/nav-1.gif) no-repeat bottom left; }
#header .header-inner ul#main-nav li.nav-2 a { width:134px; height:55px; background: url(/gfx/nav-2.gif) no-repeat bottom left; }
#header .header-inner ul#main-nav li.nav-3 a { width:149px; height:55px; background: url(/gfx/nav-3.gif) no-repeat bottom left; }
#header .header-inner ul#main-nav li.nav-4 a { width:97px; height:55px; background: url(/gfx/nav-4.gif) no-repeat bottom left; }

#info-bar { width: 100%; background: #fff url(/gfx/bg-infobar.jpg) no-repeat bottom center; }
#info-bar .inner-content { width:980px; margin:0 auto 0 auto; padding:10px 0 14px 0; /*background: #fff url(/gfx/bg-infobar-inner.gif) repeat-x bottom left; */}

#info-bar form {
	width: 300px;
	padding-top: 3px;
	padding-left: 20px;
	text-align: left;
	float: left;
	}

#info-bar p {
	font-size:1.4em;
	color:#666;
	text-align: right;
	padding:0;
	margin:0;
	}
	
#info-bar p span { font-weight:bold; font-size:1.6em; }
#info-bar p a { font-weight:bold; font-size:1.2em; }




div#header div#inner div#quickFind {
	height:30px;
	width: 100%;
	margin: 0;
	padding-top: 15px;
	}

div#header div#inner div#quickFind p {
	width: 520px;
	color: #FFFFFF;
	font-size: 13px;
	padding-top: 3px;
	float: left;
	text-align: right;
	}
	
div#header div#inner div#quickFind select {
	margin-right: 10px;
	}	

div#header div#inner div#quickFind ul {
	text-align: right;
	padding-right: 30px;
	}

div#header div#inner div#quickFind li {
	display: inline;
	font-size: 1.2em;
	padding: 0 20px;
	}

div#header div#inner div#quickFind li a,
div#header div#inner div#quickFind li a:visited {
	color: #EEEEEE;
	}
	
div#header div#inner div#quickFind li a:hover,
div#header div#inner div#quickFind li a:active {
	color: #CCCCCC;
	}	

div#header div#inner div#nav {
	height:60px;
	width: 100%;
	margin: 12px 0 0 0;
	text-align: right;
	}
	
div#header div#inner div#nav img {
	padding: 0 10px;
	}	

div#header div#inner div#nav img.last {
	padding-right: 20px;
	}

	
/* ===== page rules =================================================================== */

#wrap {
width:100%;
background: url(/gfx/bg-wrap.jpg) no-repeat top center;
}

div#container {
	width:980px;
	margin:0 auto 0 auto;
	text-align: left;
/*	background: url(/gfx/bg_container.jpg) #FFFFFF repeat-x top left;  */
	}
	
ul#breadcrumbs {
	text-align: left; 
	padding-left: 20px;
	}

ul#breadcrumbs li {
	display: inline;
	padding-right: 20px; 
	}

ul#breadcrumbs li a:hover {
	color: #ED8A36;
	text-decoration: underline;
	}

ul#breadcrumbs li.selected {
	color: #ED8A36; 
	}
	
/* ==== left column ==================================================================== */

div#leftColumn {
	width: 190px;
	margin-top: 8px;
	float: left;
	}
	
div#leftColumn div#menu {
	padding-bottom: 15px;
	background: url(/gfx/leftHeader.gif) transparent no-repeat top left; 
	}
	
div#leftColumn div#menu h2 {
	padding:8px 0 0 15px;
	margin:0;
	background: url(/gfx/leftHeader.gif) transparent no-repeat top left; 
	}
		
div#leftColumn div#menu ul {
	padding-top: 10px;
	text-align: left;
	}

div#leftColumn div#menu ul li { 
	padding:0;
	margin-left: 1px;
	border-left: 1px solid #CFCFCF;
	border-right: 1px solid #CFCFCF;
	border-bottom: 1px solid #CFCFCF;
	background: url(/gfx/menu_grad.gif) transparent repeat-x top left;
	}		

div#leftColumn div#menu ul li a { 
	display:block;
	padding:3px 5px 3px 10px;
		}

div#leftColumn div#menu li a:hover,
div#leftColumn div#menu li a:active { 
		background: url(/gfx/menu_gradOn.gif) #333333 repeat-x top left;
		color: #FFFFFF;
		text-decoration: none;
		}
		
div#leftColumn div#menu ul ul { padding-top:0; }
div#leftColumn div#menu ul ul li { margin:0; border:0; background: none; }
div#leftColumn div#menu ul ul li a { padding-left: 15px; }
div#leftColumn div#menu ul ul ul li a { padding-left: 20px; }

div#leftColumn div#menu li a.active { color:#fff; background: url(/gfx/menu_gradOn.gif) #333333 repeat-x top left; }


div#leftColumn ul#social img {
	padding-right: 0.6em;
	float: left; 
	}

ul#social li { 
	clear: both;
	padding: 0.4em 0;
	line-height: 25px;
	font-size: 1.1em; 
	}

div#leftColumn .box h2, div#leftColumn .box h3 { margin-top:0; }
			
/* ==== centre column ==================================================================== */
	
div#content {
	width: 560px;
	margin: 10px 0 0 20px;
	padding:0;
	float: left;
	}
	
div#content .twoColumn {
	width: 770px
	}

div#content div#breakout {
	width: 100%;
	margin-top: 15px;
	float: left;
	}

div#content div#breakout div.cta {
	width: 180px;
	padding-bottom: 20px;
	float: left;
	}
	
div#content div#breakout div.cta p {
	font-size: 11px;
	line-height: 14px;
	padding: 5px 2px;
	}	

.pad {
	margin-right: 7px;
	}

/* ==== right column ==================================================================== */

div#rightColumn {
	width: 190px;
	margin-top: 8px;
	float: right;
	}

div#rightColumn p {
	font-size:1.1em;
	line-height: 1.3em; 
	}

p.dots { 
	border-bottom:1px dotted #000000; 
	margin:0;
	}	
	
div#rightColumn .box h2, div#rightColumn .box h3 { margin-top:0; }
	
/* ===== footer =================================================================== */
	
div#footer {
	width: 980px;
	margin:0 auto;
	background: transparent url(/gfx/bg-footer.gif) no-repeat bottom left;
}
div#footer .inner-content { padding:5px 0 5px 0; background: transparent url(/gfx/bg-footer-top.gif) no-repeat top left; }

div#footer ul {
	width: 400px;
	font-size: 1.1em;
	text-align: right;
	padding-right: 30px;
	float: right;
	}

div#footer ul#copyright {
	width: 400px;
	text-align: left;
	padding-left: 20px;
	float: left;
	}

div#footer li {
	display: inline;
	font-size: 1.1em;
	padding: 0 20px;
	color: #999999;
	}

div#footer li a,
div#footer li a:visited {
	color: #999999;
	}
	
div#footer li a:hover,
div#footer li a:active {
	color: #333333;
	}


/*
============================================================================
FLOATFIX - MAGIC
============================================================================
*/

.floatfix:after {
	content:".";
	display:block;
	height:0px;
	clear:both;
	visibility:hidden
}
.floatfix { display:inline-block }
/* Hides from IE-mac \*/
* html .floatfix { height:1% }
.floatfix { display:block }
/* End hide from IE-mac */