/*
-------------------------------------------------------------- 
Project: MTC 
Author: Yaw Dako
Module: Global
Date: August 08
-------------------------------------------------------------- 
*/

/*
-------------------------------------------------------------- 
YAHOO RESET 
-------------------------------------------------------------- 
*/

@import url("reset.css");

/*
-------------------------------------------------------------- 
GENERAL
-------------------------------------------------------------- 
*/
html { background:#a1b7de url(/images/bg/bg_tile.jpg) repeat-x; }

html, 
body { height:100%; width:100%; margin:0; padding:0; }

body { color:#666; font-size:62.5%; font-family:"Trebuchet MS", Tahoma, Verdana, Arial, sans-serif; line-height:1; }

p { color:#FFF; font-size:120%; padding-bottom:20px; line-height:1.5; }
a { color:#FFF; text-decoration:none; }
a:hover { text-decoration:underline; }
em { font-style:italic; }

h3 { color:#FFF; font-size:180%; padding-bottom:15px; }

/* h3 { margin-left:15px; } */

#content h2 { height:23px; margin-bottom:28px; overflow:hidden; text-indent:-9999px;  }

/*
-------------------------------------------------------------- 
LAYOUT
-------------------------------------------------------------- 
*/

.wrapper { position:relative; background:url(/images/bg/nav_bg.png) left top repeat-y; margin-bottom:-100px; min-height:100%; height:auto !important; height:100%; z-index:2; }
.bg { background:url(/images/bg/wrapper_bg.png) left top no-repeat; }
.contentBg { background:url(/images/bg/content_bg.png) left top; min-height:300px; height:auto !important; height:300px; }

#header { height:157px; margin:0 auto; width:960px; }

#navContainer { background:url(/images/bg/nav_bg.png) left top no-repeat; height:100%; left:0; position:absolute; top:0; width:253px; z-index:4; }

#nav { left:0; position:absolute; top:0; width:224px; z-index:5; }

#logo { background:url(/images/mtc_logo.gif); display:block; height:80px; overflow:hidden; text-indent:-9999px; width:96px; }
#contentContainer { position:relative;  padding:80px 0 0 274px; z-index:1; min-height:300px; height:auto !important; height:300px; }

#contentContainer,
#content { width:678px; }

.colX { float:left; width:395px; position:relative; }
.colY { float:right; width:280px; background:#5B678C; border:1px solid #9ba5bb; border-top:none; }

.contentGraphic { background:url(/images/bg/content_graphic.png) left top no-repeat; position:absolute; height:138px; width:852px; z-index:1; }

.olymp { margin-bottom:15px; }

/*
-------------------------------------------------------------- 
TOOLTIPS
-------------------------------------------------------------- 
*/

.doodle { cursor:pointer; }

/*
-------------------------------------------------------------- 
TITLES
-------------------------------------------------------------- 
*/

#TAL01 h2 { background:url(/images/titles/mtc_talent_management.png) left top no-repeat; }
#NEW01 h2,
#NEW02 h2 { background:url(/images/titles/news.png) left top no-repeat; }
#TES01 h2 { background:url(/images/titles/people_say.png) left top no-repeat; }
#BIO01 h2 { background:url(/images/titles/team.png) left top no-repeat; }
#CON01 h2 { background:url(/images/titles/contact.png) left top no-repeat; }
#TAL03 h2 { background:url(/images/titles/talent_licensing.png) left top no-repeat; }
#ABO01 h2 { background:url(/images/titles/about.png) left top no-repeat; }
#OLY01 h2 { background:url(/images/titles/olympics.png) left top no-repeat; }
#OLY02 h2 { background:url(/images/titles/activate.png) left top no-repeat; }

.profileTitle { background:url(/images/titles/mtc_profile.png) left top no-repeat; }
.newsTitle { background:url(/images/titles/news.png) left top no-repeat; }
.sponsorTitle { background:url(/images/titles/sponsor_events.png) left top no-repeat; }
.peopleTitle { background:url(/images/titles/people_say.png) left top no-repeat; }
.teamTitle { background:url(/images/titles/team.png) left top no-repeat; }
.contactTitle { background:url(/images/titles/contact.png) left top no-repeat; }
.casestudyTitle { background:url(/images/titles/casestudy.png) left top no-repeat; }

/*
-------------------------------------------------------------- 
NAVIGATION 
-------------------------------------------------------------- 
*/

#nav { margin-left:22px; }
#nav ul { width:223px; }
#nav ul li { font-size:140%; font-weight:bold; min-height:1.9em; height:auto !important; height:1.9em; line-height:1.3; }
#nav ul li a { color:#FFF; cursor:pointer; display:block; overflow:hidden; padding:4px 0 4px 20px; }

* html #nav ul li a { height:1%; overflow:visible; }

#nav ul li a:hover { background:#3C4971; text-decoration:none }

#nav .talent a { color:#a0c400; }
#nav .sponsors a { color:#FFC324; }
#nav .olympics a { color:#FF24AB; }

#nav .talent a:hover { border-left:7px solid #A0C400; color:#FFF; padding-left:13px; }
#nav .sponsors a:hover { border-left:7px solid #FFC324; color:#FFF; padding-left:13px; }
#nav .olympics a:hover { border-left:7px solid #FF24AB; color:#FFF; padding-left:13px; }
#nav .news a:hover, 
#nav .about a:hover, 
#nav .contact a:hover { border-left:7px solid #A1ABC0; color:#FFF; padding-left:13px; }

#nav .talent a.selected   { border-left:7px solid #A0C400; }
#nav .sponsors a.selected { border-left:7px solid #FFC324; }
#nav .olympics a.selected { border-left:7px solid #FF24AB; }

#nav .news a.selected, 
#nav .about a.selected, 
#nav .contact a.selected { border-left:7px solid #A1ABC0; }

#nav ul li a.selected { background:#3C4971; color:#FFF; padding-left:13px; }

#nav ul ul { margin-top:3px; }
#nav li li { font-size:80%; }
#nav li li a { color:#FFF; padding-left:35px; }

#nav li.talent li a { color:#FFF; }
#nav li.talent li a:hover { background:none; border-left:none; color:#A0C400; padding-left:35px; }
#nav li.talent li a.selected { background:url(/images/icons/arrow_green.gif) 25px no-repeat; border-left:none; color:#A0C400; padding-left:35px; }

#nav li.olympics li a { color:#FF24AB; }
#nav li.olympics li a:hover { background:none; border-left:none; color:#FF24AB; padding-left:35px; }
#nav li.olympics li a.selected { background:url(/images/icons/arrow_pink.gif) 25px no-repeat; border-left:none; color:#FF24AB; padding-left:35px; }

#nav li.about li a { color:#FFF; }
#nav li.about li a:hover  { background:none; border-left:none; color:#A1ABC0; padding-left:35px; }
#nav li.about li a.selected { background:url(/images/icons/arrow_blue.gif) 25px no-repeat; border-left:none; color:#A1ABC0; padding-left:35px; }


/*
-------------------------------------------------------------- 
FILTER
-------------------------------------------------------------- 
*/

.filter { padding:0 0 2px 2px; position:relative; z-index:1;}
.filter ul { background:#A8CC14; border-top:5px solid #d1f000; border-bottom:5px solid #6f9d00; height:1.5em; line-height:1; width:100%;  }
.filter ul li { color:#00339E; font-size:110%; text-align:right; float:right; }
.filter ul li a { color:#00339E; display:block; height:1.0em; float:left; padding:2px 12px; position:relative; text-decoration:none; line-height:1;  }
.filter li label { display:block; padding:2px 10px 2px 20px; } 
.filter ul li a:hover { background:#6f9d00; color:#FFF; text-decoration:none; }
.filter ul li a span { display:none; }
.filter ul li a:hover span,
.filter ul li.selected a span { display:block; position:absolute; left:45%; top:20px; background:url(/images/icons/filter_arrow.gif) 0 0 no-repeat; width:10px; height:5px; overflow:hidden; }
.filter ul li.selected a { background:#6f9d00; color:#FFF; }
.filter ul input { float:left; font-size:90%; }
.filter .checked { background:url(/images/icons/chk_on.gif) 5px 2px no-repeat; }
.filter .unchecked { background:url(/images/icons/chk_off.gif) 5px 3px no-repeat; }
.filter .globe { background:url(/images/bg/filter_globe.gif) no-repeat; display:block; height:32px; left:-4px; position:absolute;  top:-5px; width:33px; }

.filter ul a:hover em { display:block; overflow:hidden; border:6px solid #06a; border-color:#06a #fff; border-width:6px 6px 0 6px; position:absolute; top:0; left:50%; margin-left:-6px; }

.secondLayout .filter { margin-right:25px; }

.filter .profileList li a { padding:2px 8px;  }
.filter .profileList { margin-bottom:14px; }
.filter .profileList  { padding-left:25px; width:360px; }
.filter .profileList li { float:left; }
.colY .filter { padding:0; margin-bottom:10px;}

.newsColumn .filter ul  { background:#5b678c; border-top:5px solid #A1ABC0; border-bottom:5px solid #1d255c; }
.newsColumn .filter ul li a { color:#FFF; }
.newsColumn .filter ul li a:hover { background:#1d255c; }
.newsColumn .filter ul li.selected a { background:#1d255c; }
.newsColumn .filter ul li a:hover span,
.newsColumn .filter ul li.selected a span { background:url(/images/icons/filter_arrow_blue.gif) 0 0 no-repeat; } 

.caseStudy ul.profileList li a { padding:2px 7px; }
.caseStudy ul li a.lastChild { padding-right:4px; white-space:nowrap;  }
.caseStudy ul  {  background:#FFC324; border-top:5px solid #FFDB7D;  border-bottom:5px solid #FFA200; }
.caseStudy ul li a:hover { background:#FFA200; }
.caseStudy ul li.selected a { background:#FFA200; }
.caseStudy ul li a:hover span,
.caseStudy ul li.selected a span { background:url(/images/icons/filter_arrow_orange.gif) 0 0 no-repeat; } 
.caseStudy .globe { background:url(/images/bg/filter_globe_casestudy.gif) no-repeat; top:-4px; }

/*
-------------------------------------------------------------- 

-------------------------------------------------------------- 
*/

.colX p { color:#c3ccde; padding-right:10px; }

.colX p strong, 
.colX p b { font-weight:bold; }

.colX p strong { color:#FFF; }

.client { background:url(/images/bg/list_bg.png) left top; float:left; margin:0 0 7px 0; }
.clientDesc { background:url(/images/bg/thumb_bg.png) no-repeat; font-size:110%; float:left; height:117px; width:93px; }
.clientDesc span { display:block; padding:5px 9px 0px 9px; color:#666 }
.client img { display:block; padding:0 9px 0 9px; margin-top:9px; text-align:center; }

.clientDetail { float:left; height:111px; margin-top:3px; position:relative; left:-4px; width:234px; z-index:1; } 
.clientDetail h4 { background:url(/images/icons/dottedLine_white.gif) left bottom repeat-x; color:#C3CCDE; font-size:120%; font-weight:bold; line-height:1.3; padding:10px 0 7px 0; margin:0 10px; }
.clientDetail h4 small { display:block; font-size:90%; }
.clientDetail h4 a { position:relative; bottom:0; right:0; }
.clientDetail h4 a:hover { text-decoration:none; } 
.clientDetail p { position:relative; color:#c3ccde; padding:10px 10px 5px 10px; }
.clientDetail a.clientMore { background:url(/images/icons/arrow_blue.gif) right no-repeat; color:#c3ccde; bottom:7px; line-height:1.2; padding-right:10px; position:absolute; right:5px; }
.clientDetail a.clientMore:hover { background:url(/images/icons/arrow_white.gif) right no-repeat; color:#FFF; }

.clientGallery,
.clientList { width:100%; padding:24px 0 20px 0; }
 
.clientList .clientDetail { display:none; }
.clientList .client { margin:0 19px 15px 0px; }
.clientList .client { background:none; }

#TAL04 .client { width:380px; margin-bottom:10px; position:relative; }
#TAL04 .clientDetail { width:280px; }
#TAL04 .clientDetail p { position:static; float:left; margin-left:5px; padding-top:0px; }

.newsList .clientDetail { width:295px; }
.newsList .clientDetail p, 
.caseList .clientDetail p { padding-top:5px; }
.caseList .clientDetail { width:243px; }

.intro { padding:10px 0; position:relative; width:100%; }
.intro .introImg { float:left; padding:0 0 10px 10px; }
.intro .introImg em { display:block; background:url(/images/icons/dottedLine_white.gif) left bottom repeat-x; margin-top:5px; padding-bottom:6px; }
.intro .introImg img { display:block; }
.intro .introDesc h3 { background:url(/images/icons/dottedLine_white.gif) left bottom repeat-x; margin:0 8px 5px 16px; }
.withImage .introDesc { float:left; width:290px; }
.withImage .introDesc h3 { margin-right:7px; }
.intro p { color:#FFF; font-size:120%; font-weight:bold; line-height:1.3; margin-left:16px; text-transform:uppercase; }
.contentBg p { margin-left:16px; }

.bioElement { float:left; }
.tabContainer { position:relative; }
.tabElement { padding-bottom:10px; position:relative; zoom:1; width:385px; }
.tabElement ul { list-style:disc; }
.tabElement ul, 
.tabElement ol { color:#C3CCDE; font-size:120%; line-height:120%; margin:0 0 15px 16px;  }
.tabElement ul li { list-style:disc; }
.tabElement ol li { list-style:decimal; }
.tabElement ul li,
.tabElement ol li { padding-bottom:5px; margin-left:20px; }
.tabElement h4 { color:#FFF; margin:0 0 10px 16px; font-size:130%; font-weight:bold; line-height:1.2 }

.introText { font-size:140%; }

#qandaPanel { background:#060A2E; position:absolute; left:383px; top:240px; width:272px; z-index:10; }
#qandaPanel p { padding:10px 10px 10px 10px; text-transform:none; }
#qandaPanel a { background:url(/images/icons/dottedLine_white.gif) left bottom repeat-x; display:block; margin:0 5px 5px 5px; padding:6px; text-align:right; }

.mediaList { background:#a1abc0; padding:12px; }
.mediaList ul { font-size:120%; } 
.mediaList ul li { padding-bottom:2px; }
.mediaList ul li a { background:url(/images/icons/video_icon.gif) left no-repeat; color:#101b4d; line-height:1.3; padding-left:24px; } 

.relatedList h3 { background:#ffc324; border-top:5px solid #ffdb7d; border-bottom:5px solid #ffa200; color:#00339E; font-size:110%; padding:2px 0 2px 9px; margin:0 0 12px 0; }
.relatedList ul { padding:0 12px 12px 12px; }
.relatedList ul li { font-size:120%; line-height:1.3; padding-bottom:2px; }
.relatedList ul li a { color:#FFF; font-weight:bold; } 

.newsColumn .relatedList h3 { background:#a8cc14; border-top:5px solid #d1f000;  border-bottom:5px solid #6f9d00; }

.infoPanel { position:relative; color:#FFF; z-index:1; }
.infoPanel h4 { background:#a1abc0; color:#101b4d; font-size:110%; padding:5px 5px 5px 9px; width:266px; }
.infoPanel p { font-size:110%; margin:8px 0 0 10px; }
.infoPanel img { display:block; float:left; padding-right:10px; }
.infoPanel strong,
.infoPanel p a { font-weight:bold }

.infoPanel fieldset { padding:10px; text-align:right; }
.infoPanel fieldset label { color:#FFF; display:block; font-style:italic; line-height:110%; padding-bottom:5px; }
.infoPanel fieldset .textField { width:255px; font-size:110%; padding:2px 2px 2px 3px; margin-bottom:10px; }

.subscribe h4 {  font-size:140%; padding:10px 5px 10px 9px; }
.subscribe .rss { background:url(/images/icons/rss_icon.gif) right no-repeat; color:#101B4D; font-size:80%; line-height:1.2; padding:0 30px 0 0; position:absolute; right:5px; text-align:right; top:5px; white-space:nowrap; }
.subscribe .submits { background:#0f1d3e; border:1px solid #0f1d3e; border-top:1px solid #878E9F; border-bottom:1px solid #050A15; color:#FFF; font-family:"Trebuchet MS", Tahoma, Verdana, Arial, sans-serif; font-size:120%; padding:2px 10px; width:75px;  }

#mainImage { min-height:154px; height:auto !important; height:154px; }

.imagePanel { text-align:center; }
.imagePanel h4 { background:#a1abc0; color:#101B4D; font-size:120%; line-height:1.2; padding:6px 9px 5px 9px; margin-top:10px; text-align:left; }
.imagePanel em { background:#a1abc0; color:#101B4D; display:block; font-size:110%; padding:0 9px 9px 9px; text-align:left }

.imageGallery ul { padding:6px 0 0 7px; }
.imageGallery ul li { float:left; padding:0 6px 6px 0; }
.imageGallery ul li a { position:relative; display:block; height:48px; width:48px; z-index:1 }
.imageGallery ul li img { position:relative; z-index:1 }
.imageGallery ul li span { background:url(/images/bg/thumb_overlay.png); cursor:pointer; display:block; height:48px; left:0; position:absolute; top:0; width:48px; z-index:2 }
.imageGallery ul li.active span { display:none; }

.imageGallery ul li a:hover span { display:none; }


.booksPanel { float:left; width:280px; clear:both; padding-bottom:5px; }


.footNote { clear:both; padding-top:10px }
.footNote h4 { background:url(/images/bg/border_line.gif) repeat-x; color:#FFF; font-size:140%; font-weight:bold; margin:0 0 0 16px; padding:10px 0 8px 0; float:left; width:360px; display:inline; }
.footNote ul { font-size:120%; line-height:1.5; margin-left:16px; }
.footNote ul li { padding-bottom:3px; }

.bookmarks { background:url(/images/bg/border_line.gif) top repeat-x; float:left; margin-top:10px; width:100%; }
.bookmarks ul li { float:right; padding:5px 5px 5px 0px; }
.bookmarks ul li a { display:block; height:22px; overflow:hidden; text-indent:-9999px; width:22px; }
.bookmarks .digg { background:url(/images/icons/digg_icon.gif) top repeat-x; }
.bookmarks .delicious { background:url(/images/icons/delicious_icon.gif) top repeat-x; }
.bookmarks .furl { background:url(/images/icons/furl_icon.gif) no-repeat; }
.bookmarks .reddit { background:url(/images/icons/reddit_icon.gif) no-repeat; }

ul.peopleSay { padding:20px 20px 10px 0; }
ul.peopleSay li { background:url(/images/icons/dottedLine_white.gif) left bottom repeat-x; margin:0 0 10px 16px; padding-bottom:10px; text-align:right;  }
ul.peopleSay li p { color:#c3ccde; font-style:italic; text-align:left; margin-left:0; }
ul.peopleSay li span { font-size:110%; color:#FFF; } 

.team { background:url(/images/bg/content_bg.png) left top; padding:10px; margin-bottom:10px; }
.teamDesc { float:left; width:545px; } 
.teamDesc h3 { background:url(/images/icons/dottedLine_white.gif) left bottom repeat-x; margin-bottom:10px; line-height:1.4; padding-bottom:10px; }
.teamDesc h3 span { font-size:80%; }
.teamDesc h3 span a { display:block; font-weight:bold; }
.teamDesc p { color:#c3ccde; line-height:1.7; padding-right:20px; }
.teamImg { float:left; padding-right:17px; width:95px; }

.contactUs .colY { background:url(/images/bg/list_bg.png) left top; border:none; min-height:313px; height:auto !important; height:313px; }

.contactDetail { background:url(/images/bg/list_bg.png) left top; padding:16px 10px 10px 16px; margin-right:15px; min-height:287px; height:auto !important; height:287px; }
.contactDetail span { color:#c3ccde; font-weight:bold; }
.contactDetail address { color:#FFF; font-size:140%; font-weight:bold; line-height:1.4; margin-bottom:10px; }
.contactDetail p { font-size:120%; color:#FFF; }
.contactDetail h4 { background:url(/images/icons/dottedLine_white.gif) left top repeat-x; color:#FFF; font-size:120%; font-weight:bold; margin-bottom:10px; padding:20px 0 0 0 }

/*
-------------------------------------------------------------- 
FOOTER
-------------------------------------------------------------- 
*/

#footer { background:#FFF url(/images/bg/footGrad_L.jpg) left repeat-y; clear:both; min-height:100px; height:auto !important; height:100px; position:relative; z-index:5; width:100%; overflow:hidden; min-width:960px; }
.footerSpacer { height:100px; }
#footer p { padding:20px 0 0 29px; color:#213A75; font-size:1.5em; font-weight:bold; }
#footer p a { color:#999; }
#footer span { padding-right:8px }
#footer ul { position:relative; z-index:99; color:#999; font-size:110%; line-height:1.1; margin:15px 0 0 29px; }
#footer li { display:inline; padding-right:6px; }
#footer li a { color:#999; padding-right:8px; text-decoration:none; }
#footer li a:hover { color:#999; text-decoration:underline; }

.footerInner { background:url(/images/bg/footGrad_R.jpg) right repeat-y; min-height:100px; height:auto !important; height:100px; }

/*
-------------------------------------------------------------- 
CLEAR FLOATS
-------------------------------------------------------------- 
*/
.clearfix:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display: inline-block; }
/* hides from IE/Mac \*/
* html .clear { height: 1%; }
.clear { display: block; }
/* end hide from IE-Mac */
/*** end clearing hack  ***/

/*
-------------------------------------------------------------- 
PRINT
-------------------------------------------------------------- 
*/

#print #printGraphic { display:none; }
#print .instruct { margin-top:50px; }

#print table td { padding-bottom:5px; }
#print .client { margin-bottom:0; }