/*
Theme Name: Global
Theme URI: http://junowebdesign.com
Description: Global Style
Version: 1.0
Author: Juno Web Design
Author URI: http://junowebdesign.com
Tags: juno media, web design, web development, graphic design
*/

/* Imports */
@import url("css/reset.css");
@import url("css/global-forms.css");


	
	body {
		background: black url('images/body-bg.jpg') top center no-repeat;
		color: white;
		font-size: 100%; /* Base font size: 16px */
		font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
		margin: 0;
		padding: 0;
		text-align: left;
	}

/* 
	Base Font Size: 11px
*/
h2 {font-size: 1.727em}	/* 19px */
h3 {font-size: 1.545em}	/* 17px */
h4 {font-size: 1.364em}	/* 15px */
h5 {font-size: 1.182em}	/* 13px */
h6 {font-size: 1em}		/* 11px */

/* 
	Base Font Size: 12px
*/
h2 {font-size: 1.667em}	/* 20px */
h3 {font-size: 1.5em}	/* 18px */
h4 {font-size: 1.333em}	/* 16px */
h5 {font-size: 1.167em}	/* 14px */
h6 {font-size: 1em}		/* 12px */

/* 
	Base Font Size: 13px
*/
h2 {font-size: 1.615em}	/* 21px */
h3 {font-size: 1.462em}	/* 19px */
h4 {font-size: 1.308em}	/* 17px */
h5 {font-size: 1.154em}	/* 15px */
h6 {font-size: 1em}		/* 13px */

/* 
	Base Font Size: 14px
*/
h2 {font-size: 1.571em}	/* 22px */
h3 {font-size: 1.429em}	/* 20px */
h4 {font-size: 1.286em}	/* 18px */
h5 {font-size: 1.143em}	/* 16px */
h6 {font-size: 1em}		/* 14px */

/* 
	Base Font Size: 15px
*/
h2 {font-size: 1.533em}	/* 23px */
h3 {font-size: 1.4em}	/* 21px */
h4 {font-size: 1.267em}	/* 19px */
h5 {font-size: 1.133em}	/* 17px */
h6 {font-size: 1em}		/* 15px */

/* 
	Base Font Size: 16px
*/
h2 {font-size: 1.5em}	/* 24px */
h3 {font-size: 1.375em}	/* 22px */
h4 {font-size: 1.25em}	/* 20px */
h5 {font-size: 1.125em}	/* 18px */
h6 {font-size: 1em}		/* 16px */

h2, h3, h4, h5, h6 {line-height: 1.1; margin-bottom: .8em;}
	
/* Links */
a {outline: 0;}
a img {border: 0px; text-decoration: none;}
a:link, a:visited {color:#50b6f1;}
a:hover, a:active {}
	
/* Paragraphs */
p {
	margin-bottom: 1.2em;
	line-height: 1.5;
}

strong, b {font-weight: bold;}
em, i {font-style: italic;}

/* Lists */
ul {
	list-style: outside disc;
	margin: 1em 0 1.5em 1.5em;
}

ol {
	list-style: outside decimal;
	margin: 1em 0 1.5em 1.5em;
}

dl {
	margin: 0 0 1.5em 0;
}
dt {font-weight: bold;}
dd {margin-left: 1.5em;}

/* Quotes */
blockquote {font-style: italic;}
cite {}

q {}

/* Tables */
table {margin: .5em auto 1.5em auto; width: 98%;}
	
	/* Thead */
	thead th {padding: .5em .4em; text-align: left;}
	thead td {}

	/* Tbody */
	tbody td {padding: .5em .4em;}
	tbody th {}
	
	tbody .alt td {}
	tbody .alt th {}
	
	/* Tfoot */
	tfoot th {}
	tfoot td {}
.contents {width:1003px;margin:0 auto}
/***** Layout *****/
/* Header */
#header {overflow:hidden;}
#header #logo {float:left;margin:23px 0 12px 0}
#header #follow-us{float:right; background: url('images/follow-us-bg.png') no-repeat; padding: 15px 0px 14px 15px;}
#header #follow-us h4{font-size:1em;margin-bottom:8px;}
#header #follow-us ul{list-style-type:none;margin:0}
#header #follow-us li{float:left;margin-right:15px}

/* Navigation*/
.nav-bottom{background:url('images/nav-bottom-bg.png') repeat-x bottom;}
#nav{background:url('images/nav-bg.png') no-repeat center; overflow:hidden;height:1%}
#nav ul{list-style-type:none; float:left; margin:0;}
#nav ul li{float:left;padding: 12px 20px; border-right:1px solid #585858}
#nav #last{border:none}
#nav .active{background: url('../images/nav-li-bg.png') repeat-x;}
#nav ul li a{color:#fff;font-weight:bold;}
#nav ul li a:link,#nav ul li a:visited{text-decoration:none;}
#nav ul li a:hover, #nav ul li a:active{text-decoration:underline;}
#nav ul li:hover{background: url('../images/nav-li-bg.png') repeat-x;}
#nav ul li:hover ul{display:block;background:#2b2b2b;padding:10px 0;position:absolute;z-index:9999}

/*
.nav-bottom{background:url('images/nav-bottom-bg.png') repeat-x bottom;}
#nav{overflow:hidden;position:relative;}
#menu{list-style-type:none;margin:0;}
#menu li{float:left;}
#menu li a{  background: transparent url('images/sprite.png') no-repeat top left;
    display: block;
    padding: 14px 0;
    text-align: center;
    text-indent: -9000em;
}
#menu li#home a {
    background-position: 0 0;
    width: 80px;
}

#menu li#home a:hover, #menu li#home.active a:link, #menu li#home.active a:visited{
    background-position: 0 -46px;
}

#menu li#blogs a {
    background-position: -80px 0;
    width: 100px;
}

#menu li#blogs a:hover, #menu li#blogs.active a:link, #menu li#blogs.active a:visited {
    background-position: -80px -46px;
}

#menu li#abouts a {
    background-position: -180px 0;
    width: 97px;
}

#menu li#abouts a:hover, #menu li#abouts.active a:link, #menu li#abouts.active a:visited {
    background-position: -180px -46px;
}

#menu li#elesson a {
    background-position: -277px 0;
    width: 123px;
}

#menu li#elesson a:hover, #menu li#elesson.active a:link, #menu li#elesson.active a:visited {
    background-position: -277px -46px;
}

#menu li#resource a {
    background-position: -400px 0;
    width: 136px;
}

#menu li#resource a:hover, #menu li#resource.active a:link, #menu li#resource.active a:visited {
    background-position: -400px -46px;	
}
#menu li#try-global a {
    background-position: -536px 0;
	width:466px;
}

#menu li#try-global a:hover, #menu li#try-global.active a:link, #menu li#try-global.active a:visited {
    background-position: -536px -46px;
}


*/

#menu ul{display:none;position:absolute;overflow:hidden;width:170px;font-size:0.9em;margin:12px 0 0 -21px; text-transform: none;z-index:999}
#menu ul li{border:none;float:none;padding:3px 0}
#menu ul li a{line-height:20px;font-weight:normal;padding: 0 10px;}
#menu ul li a:hover, #menu ul li a:active{text-decoration:none;}
#menu ul li:hover{background:url('images/menu-dropdown-bg.png');}
#nav ul #first{ -moz-border-radius-topleft:7px ; -webkit-border-top-left-radius:7px; -moz-border-radius-bottomleft:7px ; -webkit-border-bottom-left-radius:7px;border-radius:7px;}
#nav fieldset{/*
position:absolute;right:0;top: 0;
*/border: 1px solid #4d4d4d;background: #000;float:right;width:280px;padding: 0;margin:6px 7px;}
#nav input#text{background:#000; border:none;width:220px;color:#fff;font-size:0.8em;float:left;padding: 5px 10px;}
#nav #button{background: url('images/go.gif') no-repeat; text-indent:-9999px;font-size:0; line-height:0; height:20px;width:25px;border:none;cursor:pointer;float:right;margin-top:3px;}
/* Body */
#page{background: url('images/bg-news.png');padding:0 0 40px 0;overflow:hidden;}
#main{float:left; width:700px; margin-top: 20px}
#main #flash{margin-bottom:20px;}
#main #content{width:690px;margin-bottom:30px;}
#main #content p{font-size:0.85em;}
#main #content ul {margin-bottom:15px;}
#main #content ul li{margin-bottom:15px;}
#main #content ul li ul{margin:15px 0 15px 15px;}
#main #list-course{list-style-type:none;margin:0;}
#main #list-course .sub-course{width:325px;margin:20px 10px 20px 0;float:left;}
#main #list-course .newline{clear:both;}
#main #list-course img{float:left;margin-right:8px;}
#main #list-course .sub-content{width: 220px;float:left;}
#main #list-course .sub-content h4{font-size:1em;margin-bottom:10px;padding:0; color:#fff}
#main #list-course .sub-content h4 a:link, #main #list-course .sub-content h4 a:visited{text-decoration:none; color:#fff}
#main #list-course .sub-content h4 a:hover, #main #list-course .sub-content h4 a:active{text-decoration:underline}
#main #list-course .sub-content p{margin-bottom:0;font-size:0.75em}



/*Side Bar*/
#sidebar{float:right; width:280px;margin-top:20px;}
#sidebar ul{list-style-type:none;margin:0;}
#sidebar ul li a{color: #fff;font-weight:bold;}
#sidebar li a:link,#sidebar li a:visited{text-decoration:none;}
#sidebar li a:hover,#sidebar li a:active{text-decoration:underline;}
#sidebar #tab{background: url('images/tab-bg.png'); overflow:hidden;padding:7px 0 0 5px; height:40px;} 
#sidebar #tab li{float:left;padding:12px 0 11px 7px;}
#sidebar #tab li a{padding:13px 12px 11px 0;}
#sidebar #tab .active{background: url(images/left-tabs.png) no-repeat left; overflow:hidden;}
#sidebar #tab .active a{background: url(images/right-tabs.png) repeat-x right;}
#sidebar .sub-tab{background: url('images/sub-tab-bg.png');border:1px solid #302c2d}
#sidebar .sub-tab li{border-bottom: 1px solid #4f4c4d;padding:10px 5px 10px 15px;font-size:0.8em}
#sidebar .sub-tab li a{display:block;}
#sidebar .sub-tab li span{color:#949393; font-size:0.8em}
#sidebar .sub-tab li.last,#sidebar .sub-tab li.view-more{border:none; padding:17px 0px 0px 15px;margin:0}
#sidebar .sub-tab li.last a{background:url('images/view-more.png') no-repeat;font-size:0; line-height:0;text-indent:-9999px;width:111px; height:28px;}
#sidebar .sub-tab li.view-more a{display:inline;}

#sidebar #other{margin-bottom:20px}
#sidebar #most-popular{overflow:hidden;}
#sidebar #other a:link, #sidebar #other a:visited {color: #fff}
#sidebar #other #tags #cloud {margin:10px 15px 20px; text-transform: lowercase}
#sidebar #newsletter{margin: 0 0 20px 0;cursor:pointer;}
#sidebar #twitter-box{margin-bottom:25px;}
#sidebar #brands li{float:left;margin-bottom:27px;}
#sidebar #brands li.first{margin-right:27px;}
#sidebar #bookmark-us{clear:both; overflow: hidden; margin-bottom:27px;}
#sidebar #bookmark-us h4{font-size:1em;display:block;}
#sidebar #bookmark-us li{float:left;margin-right:10px;}
#sidebar #this-month li{overflow:hidden;height:1%}
#sidebar #this-month .pdf-download{float:right;width:22px;padding:3px 20px 0 0}
#sidebar #this-month p{float:left;width:200px;margin-bottom:0;line-height:1em}

#sidebar #dictionary-search {clear:both; margin: 0 0 27px 0; background-color: #000; border: 1px solid #444; padding: 10px; font-family: Arial,Helvetica,sans-serif; text-align: center;}
#sidebar #dictionary-search .fop-logo {margin-bottom: 4px;}
#sidebar #dictionary-search .fop-textbox {border: 1px solid #999; margin: 0pt; padding: 2px; width: 100px; height: 15px; font-size: 12px; color: #666; vertical-align: top;}
#sidebar #dictionary-search .fop-submit-btn {margin: 0pt 0pt 8px; cursor: pointer; vertical-align: top;}
#sidebar #dictionary-search .dictionary-link {margin: 0pt; padding: 0pt; display: block; font-size: 10px; color: #666; line-height: 1em;}

/* Footer */
#footer {background: #070707 url('images/footer-bg.png') center no-repeat;  padding-top:30px;overflow:hidden;}
#footer #box{overflow:hidden;}
#footer .footer-sub-box h2{font-weight:normal;margin-bottom:0;border-bottom: 1px dotted #391031;padding:0 0 8px 10px;}
#footer .footer-sub-box {float:left;}
#footer .footer-sub-box ul{list-style-type:none;margin:0;}
#footer .footer-sub-box li{border-bottom: 1px dotted #391031;padding:10px 0 10px 10px;}
#footer .footer-sub-box li a{background:url('images/bullet.png') no-repeat; padding: 0 0 0 20px; font-size:0.8em; color:#fff;font-weight:bold;line-height:1em}
#footer .footer-sub-box li a:link,#footer .footer-sub-box li a:visited{text-decoration:none;}
#footer .footer-sub-box li a:hover,#footer .footer-sub-box li a:active{text-decoration:underline;}
#footer #blogs,#about{width:240px; margin-right:20px}
#footer #recent-entries{width:450px;}
#footer #twitter{display:block;float:left; margin-top:50px; width:131px; height:50px;}
#footer #macmilan{display:block;float:right; margin-top:50px;}
#footer .juno-power{display:block;float:left; clear: left; height:20px; margin-bottom:18px; font-size: 13px}
#footer .juno-power a:link, #footer .juno-power a:visited {color: #6E6D6E; text-decoration: none}
#footer .juno-power a:hover, #footer .juno-power a:active {text-decoration: underline}
#footer #copyright{display:block;clear:both;padding:20px 0;font-size:0.75em;color:#827f82;}
#footer a:link, #footer a:visited {color:#fff; text-decoration: none}
#footer a:hover {text-decoration: underline}

/***** Sections *****/
/* Tabs More*/
#sidebar #other .tabs-more{
	background:url('images/tabs-bg.png') repeat-x;
}

/* Elessons */
#elessons{list-style-type:none;margin:0;}
#elessons li{margin-bottom:30px}
#main h2,#elessons h2{font-size:2em;margin-bottom:15px;}
#elessons .sub-elessons{background: url('images/content-bg.png'); overflow:hidden;padding:20px 20px 25px;height:1%}
#elessons .sub-elessons .content{float:left; width:465px;}
#elessons .sub-elessons a img{display:block;float:right;width:160px}
#elessons .sub-elessons h3{margin-bottom:0;font-weight:normal;font-size:1.5em;line-height:0.7em}
#elessons .sub-elessons h3 a{color:#fff;text-decoration:none;}
#elessons .sub-elessons h3 a:hover,#elessons .sub-elessons h3 a:active{text-decoration:underline;}
#elessons .sub-elessons .meta{font-size:0.7em;}
#elessons .sub-elessons .meta a{color:#fff;text-decoration:underline;}
#elessons .sub-elessons .meta a:hover,#elessons .sub-elessons .content .meta a:active{text-decoration:none;}
#elessons .sub-elessons p{font-size:0.9em; margin:15px 0 30px}
#elessons .sub-elessons .content .download{background:url('images/download-bg.png') no-repeat;display:block;height:40px;margin-bottom:10px}
#elessons .sub-elessons .content .download a{background: url('images/pdf.gif') no-repeat 8px 0px; padding:10px 0 15px 48px;line-height:43px;color:#fff;text-decoration:none;font-size:0.85em}
#elessons .sub-elessons .content .download span{font-weight:normal;font-size:0.7em;padding-left:15px}
#elessons #last-lesson p{margin-bottom:0}
#elessons #prev-week{padding-bottom:0}
#elessons .sub-elessons ul{list-style-type:none;margin:0}
#elessons .sub-elessons li{margin-bottom:20px}
#elessons .sub-elessons .last{margin-bottom:0}
#paginator{overflow:hidden;font-size:0.75em}
#paginator span{display:block;float:left;padding:5px 10px 5px 0}
#paginator ul{list-style-type:none;margin:0}
#paginator li{float:left;padding:5px 7px;}
#paginator li a{color:#fff;text-decoration:none;}
#paginator li a:hover, #paginator li a:active{text-decoration:underline;}
#paginator .active{background:url('images/paginator-bg.png') no-repeat}

#main #return{color:#fff;text-decoration:none;font-size:0.8em}
#main #return:hover,#elessons #return:active{text-decoration:underline;}

#main ul{list-style-type:none;margin:0}
#main #sub-nav{overflow:hidden;background:url('images/sub-nav-bg.png') no-repeat}
#main #sub-nav li{float:left;padding:9px 10px 12px}
#main #sub-nav li a{color:#fff;font-size:0.85em;text-decoration:none;padding:5px 8px}
#main #sub-nav .active a{background:url('images/sub-nav-hover.png') repeat-x;color:#000;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;}
		
		
/* About */
#main #content .box{ padding:20px 20px 10px; margin-bottom: 25px; margin-right: 25px; overflow: hidden; display; height: 1%; }
#main #content .half-box { padding:20px 20px 10px; width: 280px; float: left; margin-bottom: 25px; margin-right: 25px; overflow: hidden; height: 1%; }
#main #content .purple { background: #871a68; }
#main #content .grey { background: #666666; }
#main #content .box ul li, #main #content .half-box ul li { background: url('images/bullet_white.png') 10px 2px no-repeat; padding: 0 0 0 30px; margin-bottom: 5px; }


img.alignleft {float: left; margin: 0 18px 5px 0}
img.alignright {float: right; margin: 0 0 5px 18px}

#main #content .sub-about { background: #871a68; padding:20px 20px 10px; width: 280px; float: left; margin-bottom: 25px; margin-right: 25px; }
#main #content .sub-about-grey { background: #666666; padding:20px 20px 10px; margin-bottom: 25px; margin-right: 25px; }
#main #content .sub-about ul li { background: url('images/bullet_white.png') 10px 2px no-repeat; padding: 0 0 0 30px; margin-bottom: 5px; }


		
/* Listing */
#main #title-page{color:#fff;padding:20px 0}
#main.single #title-page{padding:20px 0 0}
#main #listing li {margin-bottom: 30px}
#main #listing h3{margin-bottom:9px;line-height:0.8em}
#main #listing h3 a{color:#fff; text-decoration:none;font-weight:normal;} 
#main #listing .meta{color:#8f1977;font-size:0.7em; display: block; margin-bottom: 20px}
#main #listing .meta a:link, #main #listing .meta a:visited {color:#8f1977;}
#main #listing a:hover,#main #listing a:active{text-decoration:none;}
/* #main #listing p{font-size:0.9em; padding:10px 0} */
#main #listing p{font-size:0.85em;}
#main #listing.post p{padding:16px 20px 0 0; margin-bottom:5px}

#sidebar #recent .global-bloggers,#main #listing .global-bloggers .meta, #main #listing .global-bloggers.meta, #main #listing .global-bloggers a:link, #main #listing .global-bloggers a:visited, #main #title-page.global-bloggers {color:#8f1977}
#sidebar #recent .author-blog, #main #listing .author-blog .meta, #main #listing .author-blog.meta, #main #listing .author-blog a:link, #main #listing .author-blog a:visited, #main #title-page.author-blog, #main .author-blog h4 {color:#098a39}
#sidebar #recent .teaching-tips, #main #listing .teaching-tips .meta, #main #listing .teaching-tips.meta, #main #listing .teaching-tips a:link, #main #listing .teaching-tips a:visited,#main #title-page.teaching-tips,#main .teaching-tips h4 {color:#4e97cf}

#main #listing.single-cat .author-blog h3 a:link, #main #listing.single-cat .author-blog h3 a:visited, #main #listing.single-cat .teaching-tips h3 a:link, #main #listing.single-cat .teaching-tips h3 a:visited, #main #listing.single-cat .global-bloggers h3 a:link, #main #listing.single-cat .global-bloggers h3 a:visited {color:#fff}

#sidebar #recent .general,#main #listing .general,#main #listing .general a,#main #title-page.general,#main .general h4{color:#ccc}

#main #sub-nav.author{background:url('images/sub-nav-author-bg.png') no-repeat}
#main #sub-nav.teaching{background:url('images/sub-nav-teaching-bg.png') no-repeat}

#main h4{font-size:1.2em; color:#8f1977;font-weight:normal;padding-top:40px}
#comments{overflow:hidden;width:565px}

#comments ul li div.outer{background:transparent url('images/comment-top.png') no-repeat top;width:563px;padding-top:5px;}
#comments ul li div.inner{background:transparent  url('images/comment-bottom.png') repeat-x bottom ;padding:4px 14px 22px;color:#ffffff;overflow:hidden;}
#comments ul li p{color:#4c4c4c;margin-bottom:0;font-size:0.8em}
#comments ul li span{font-size:0.7em;padding: 10px 0 15px 10px;display:block;}

#comments fieldset{border:none;padding:0;margin:0;width:565px}
#comments fieldset #submit{float:right;}
#comments fieldset textarea{background: url('images/comment-textarea-bg.png') no-repeat;border:none;height:135px;width:553px;padding:5px;overflow:hidden;font-size:1.2em;}
#comments-form label{display:block;padding:4px 0}
#comments-form .text {width:539px;padding:7px;font-size:1.05em;height:20px;}
.clear { clear: both; }

/* Try Global */
#download{
	background: #962780;
	padding:25px;
	
	width: 950px;
}
#download h3{
	font-size:1.2em;

}
#download #categories{
	overflow:hidden;
	font-size:17px;	
}
#download #categories a:link, #download #categories a:visited {
	padding-left: 40px;
	font-weight:bold;
	display:block;
	line-height:33px;
	margin-top:4px;
	color:#fff;
	text-decoration: none
}
#download #categories a:active, #download #categories a:hover{
	text-decoration:none;
}
#download #categories span{
	font-size: .9em;
	background: url('images/arrow.png') no-repeat; 
	height:42px;
	width: 375px;
	margin:0px 25px 10px 0px;
	float:left;
	padding-left: 10px;
}
#download #categories .file-size, .file-size{
	font-size: .68em;
	background: none; 
	height:auto;
	width: auto;
	margin:0;
	float:none;
	padding-left: 0;
}
#download #categories .music{
	background: url('images/disc.gif') no-repeat;
}
#download #categories .pdf{
	background: url('images/pdf.gif') no-repeat;

}

.tracks {width: 310px; float: left}
#main .tracks h4 {
font-size:1.125em;
font-weight:normal;
margin: 0 0 5px 0;
color: #fff;
}

/* Listening Materials */
#page .audio {background:none;}
#page .audio h2 {width: 310px; float: left;}
.audio.listings {background:#222222; border: 1px solid #777777; padding: 15px; overflow: hidden}
#content.audio {margin: 0 0 12px 0;}
#content.audio h4 {font-weight: normal; margin-bottom: 5px; font-size: 1.125em}
#content.audio .download {
	background:transparent url('images/arrow.png') no-repeat scroll 0 0;
	float:left;
	height:42px;
	margin:0 255px 10px 0;
	padding-left:10px;
	width:375px;
}
#content.audio .download .music{
	background: url('images/disc.gif') no-repeat;
	color:#FFFFFF;
	font-size: 17px;
	display:block;
	font-weight:bold;
	line-height:33px;
	margin-top:4px;
	padding-left:40px;
	text-decoration:none;
	text-transform: uppercase;
}