﻿@import url('reset.css');

@font-face {
	font-family: 'BookmanMediumBold';
	src: url('../Fonts/bkb_____-webfont.eot');
	src: url('../Fonts/bkb_____-webfont.eot?iefix') format('eot'),
	url('../Fonts/bkb_____-webfont.woff') format('woff'),
	url('../Fonts/bkb_____-webfont.ttf') format('truetype'),
	url('../Fonts/bkb_____-webfont.svg#webfontDoya4Oeb') format('svg'); font-weight:normal; font-style:normal;}
	
@font-face {
	font-family:'BookmanLightBold';
    	src: url('../Fonts/bkd_____-webfont.eot');
    	src: url('../Fonts/bkd_____-webfont.eot?iefix') format('eot'),
    	url('../Fonts/bkd_____-webfont.woff') format('woff'),
    	url('../Fonts/bkd_____-webfont.ttf') format('truetype'),
    	url('../Fonts/bkd_____-webfont.svg#webfontReOWcGvv') format('svg'); font-weight:normal; font-style:normal;}

/*================================================================================
    OVERLAY & CONTAINER
=================================================================================*/
#overlay {position:absolute; top:0; left:0; width:100%; z-index:100; height:100%; display:none;}

#container {width:958px; margin:0 auto; font-size:1.1em; background:#fff;}

/*================================================================================
    HEADER
=================================================================================*/
#header {position:relative; clear:both; padding:10px 8px; width:942px;}
#header img.logo {float:left; margin:7px 0 0 9px; display:inline; position:relative;}
#header #globals {width:555px; float:right;}
#header #globals img {float:left; display:inline;}
#header #globals img.drop {margin:13px 8px 0 0;}


/*================================================================================
    MAIN CONTENT LAYOUT
=================================================================================*/
#content {width:940px; padding:0 9px; margin:15px 0 0; font-size:1.1em;background:url('../Images/content-bg.gif') 0 0 repeat-y; }

#leftCol {width:200px; float:left; font-family:Georgia, Times, Arial, Tahoma, Verdana, Helvetica, "Trebuchet MS", sans-serif; font-size:0.9em;}
#rightCol {width:730px; float:right; margin:0 0 0 10px; padding:0 0 30px 0;}


/*================================================================================
    LEFT HAND NAVIGATION
=================================================================================*/
#leftCol ul#leftNav {padding:0; background:#f3f3f3; list-style-type:none;margin:0;}
#leftCol ul#leftNav li a {display:block; padding:20px 0 20px 10px; color:#515151; background:url('../Images/Navigation/off.png') 0 0 repeat-x #fff; text-decoration:none; font-weight:bold; text-transform:uppercase;margin:0;height:1%;}
#leftCol ul#leftNav li a:hover, #leftCol ul#leftNav li a.TopItemCurrent, #leftCol ul#leftNav li a.Expanded {background:url('../Images/Navigation/on.png') 0 0 repeat-x #fff;}
#leftCol ul#leftNav ul li a {display:block; padding:5px 0 5px 10px; color:#515151; background:url('../Images/Navigation/off.png') 0 0 repeat-x #fff; text-decoration:none; font-weight:bold; text-transform:uppercase;margin:0;}
#leftCol ul#leftNav ul li a:hover, #leftCol ul#leftNav ul li a.subItemCurrent {background:url('../Images/Navigation/on.png') 0 0 repeat-x #fff;}

#leftCol ul#leftNav ul li ul li a {display:block; padding:5px 0 5px 20px; color:#515151;background:none;text-decoration:none; font-weight:bold; text-transform:none;margin:0;}
#leftCol ul#leftNav ul li ul li a:hover, #leftCol ul#leftNav ul li ul li a.subItemCurrent, #leftCol ul#leftNav ul li ul li a.Expanded {background:none;color:#c33;}

#leftCol ul#leftNav ul li ul li ul li a {display:block; padding:5px 5px 5px 30px; color:#515151;background:none;text-decoration:none; font-weight:normal; text-transform:none;margin:0;}


/*================================================================================
    HOT JOBS
=================================================================================*/
#leftCol .hotjobs  { margin:1em 0 0 0;width:200px;padding:0; }
#leftCol .hotjobs .header { height:16px; }
#leftCol .hotjobs .hotjobscopy { width:200px;color:#fff;background:#000 url(../Images/Navigation/hotjobs-graph.gif) no-repeat;padding:0 0 0.25em 0;margin:0; }
#leftCol .hotjobs .hotjobscopy img { padding:17px 0 0 13px; }

/* HOTJOBS AVAILABLE */
#leftCol .hotjobs .hotjobscopy .hotjobsnav { width: 175px; }
#leftCol .hotjobs .hotjobscopy .hotjobsnav ul {	margin:0 0 0 10px;padding:0;list-style-type:none; }
#leftCol .hotjobs .hotjobscopy .hotjobsnav a { display:block;padding:3px;width:175px;font-weight:bold;background:#333;opacity:0.5;filter: alpha(opacity = 50);border-bottom: 2px solid #000; }
#leftCol .hotjobs .hotjobscopy .hotjobsnav a:link, #leftCol .hotjobs .hotjobscopy .hotjobsnav a:visited { color:#fff;text-decoration:none; }
#leftCol .hotjobs .hotjobscopy .hotjobsnav a:hover { background:#333;color:#fff;opacity:0.85;filter:alpha(opacity = 85); }

/* WHEN NO HOT JOBS AVAILABLE
#leftCol .hotjobs .hotjobscopy .hotjobsnav {width:175px; padding:10px 12px 0 13px; }
#leftCol .hotjobs .hotjobscopy .hotjobsnav p {color:#fff; margin:0 0 8px;}
#leftCol .hotjobs .hotjobscopy .hotjobsnav a:hover {color:#cc3333; text-decoration:none;}
#leftCol .hotjobs .hotjobscopy .hotjobsnav ul {margin:0 0 8px 14px; list-style:disc;}
#leftCol .hotjobs .hotjobscopy .hotjobsnav ul li {padding:2px 0;} */


/*================================================================================
    I'M INTERESTED IN
=================================================================================*/
#leftCol .interestedin { margin:0;width:200px;margin:1em 0;padding: 0; }
#leftCol .interestedin .header { height:16px; }
#leftCol .interestedin .interestedincopy { width:200px;color:#fff;background:#fff url(../Images/Navigation/interested-in.jpg) no-repeat;padding:4px 0 0.25em 0; }
#leftCol .interestedin .interestedincopy .interestedinhead .interestedhighlight { color:#e2373f; }
#leftCol .interestedin .interestedincopy p { font-size:1.2em;line-height:1.3em;font-weight:bold;color:#333;padding:0 10px 0.5em 10px;margin:0; }


/*================================================================================
    MAIN CONTENT
=================================================================================*/
#rightCol .pageHeaderHome {margin:0 0 8px 0;}
#rightCol .pageHeaderHome img, #rightCol .pageHeaderHome object, #rightCol .pageHeader img, #rightCol .pageHeader object  {display:block;}

#rightCol .MediaHeaderHome {margin:0 0 8px 0;}
#rightCol .MediaPromos  {margin:0 0 5px 0;} 
#rightCol .MediaPromos .promoOne, #rightCol .MediaPromos .promoTwo {float:left; margin:0 8px 0 0;}
#rightCol .MediaPromos .promoThree { float:left;margin:0;}

#rightCol .promos .promoOne, #rightCol .promos .promoTwo {float:left; margin:0 7px 0 0;}
#rightCol .promos .promoThree { float:left;margin:0;}

#rightCol .related-copy { border:1px solid #cfd0d2;margin:5px 0 0 0;padding:10px; }
#rightCol .related-copy h1 { margin:0 0 5px 0;padding:0;font-size:1.5em; }
#rightCol .related-copy h2 { color:#000; }
#rightCol .related-copy p { margin:10px 0 0 0; }

#rightCol .contentText { padding:30px; }
#rightCol .contentText ul, #rightCol .contentText ol { font-weight:normal;list-style-type:none;margin:0 0 20px 0; }
#rightCol .contentText ul li, #rightCol .contentText ol li { background:url(../Images/list-pointer.gif) 0 0.5em no-repeat;padding:0 0 3px 15px;color:#333;line-height:1.6em; }

#rightCol .contentText #SiteMap ul { font-weight:normal;list-style-type:none;padding:0 0 20px 0; }
#rightCol .contentText #SiteMap ul li { background:url(../Images/list-pointer.gif) 0 0.5em no-repeat;padding:0 0 10px 15px;color:#333;line-height:1.6em; }
#rightCol .contentText #SiteMap ul li ul { padding:20px 0 0 0 ; }

#rightCol .contentText table.eventsTable { font-size:1.0em;border-collapse:collapse;color:#333; }
#rightCol .contentText table.eventsTable th { background:#c33;padding:4px;text-align:left;color:#fff; }
#rightCol .contentText table.eventsTable td { border-bottom:1px solid #ccc;padding:4px 0; }

#rightCol .altContent .getflashImg { float:left;width:156px; }
#rightCol .altContent .getflashTxt { float:left;width:400px;margin:0 0 0 15px;text-align:left; }

/*================================================================================
    FOOTER
=================================================================================*/
#footer {border-top:1px solid #999;}

#footer #logos {width:280px; padding:4px 0 0 9px; float:left; text-align:center;}
#footer #logos img { padding:6px 10px 10px 0; }

#footer ul#support {list-style-type:none; text-align:center; width:660px; float:right; padding:20px 0;}
#footer ul#support li {display:inline; padding:0 20px;}
#footer ul#support li a { color:#333;text-decoration:none; }
#footer ul#support li a:hover { color:#c33;text-decoration:none; }


#videoTranscript {height: 200px; overflow:auto; margin-top: 20px;}
#videoTranscript p.time {margin:0; padding:0; color: #bbb;}
#videoTranscript p {margin: 5px 0;}

body#threatsPage {background: #15191c;}
#threatsContainer {margin: 20px auto 0 auto; width: 952px;}



/*================================================================================
    PUZZLE PAGE
=================================================================================*/
#puzzle { position:relative; width:710px; height:447px; overflow:hidden; background:url('../Images/Puzzle/puzzle-bg.jpg?v=2') 20px 0 no-repeat; font-family:BookmanMediumBold,Georgia,Times,Arial,Tahoma,Verdana,Helvetica,"Trebuchet MS",sans-serif; -webkit-text-size-adjust: none; }

.info { position:relative; }
.info h3 { font-weight:normal; color:#FFF; }

#question { display:block; top:100px; }
#question.info { width: 246px; left:96px; }
#question h3 { font-size: 3em; line-height: 1.1em; }
#question img.triangle { position:absolute; width: 287px; height:245px; top:-12px; left:242px;}
#question #puzzle-form { position:relative; padding:10px 0 0 0; height:30px; }
#question #puzzle-form #response { position:absolute; margin:0; padding: 0 10px; color:#FFF; background-color:#000; border:1px solid #FFF; font-size:1.6em; font-family:monospace; text-align:center; width:78px; height:28px; -webkit-border-radius: 0; }
.oldie #question #puzzle-form #response { padding:4px 10px 0 10px; height:24px; font-size:1.4em; }
#question #puzzle-form .button { position:absolute; left:100px; margin:0; padding:0; width:82px; height:28px; color:#204167; background-color:#FFF; border:1px solid #FFF; font-family:BookmanMediumBold,Georgia,Times,Arial,Tahoma,Verdana,Helvetica,"Trebuchet MS",sans-serif; -webkit-border-radius: 0; }
#question a#skip { display:block; color:#FFF; text-decoration:underline; font-size: 1.4em; padding: 1em 0 0; }

#result { display:none;  position:relative; font-family:Arial,Tahoma,Verdana,Helvetica,"Trebuchet MS",sans-serif; }
#result.info { padding: 64px 70px; color:#FFF; }
#result.info p { color:#FFF; }
#result #correct { display:none; }
#result #incorrect { display:none; }
#result #your-email, #result #friend-email { position:relative; height: 52px; }
#result #your-email .text-field, #result #friend-email .text-field  { position:absolute; margin:0; padding: 0 5px; color:#FFF; background-color:#000; border:1px solid #FFF; font-size:1.6em; font-family:monospace; text-align:left; width:228px; height:28px; -webkit-border-radius: 0; }
.oldie #result #your-email .text-field, .oldie #result #friend-email .text-field { padding:4px 5px 0 5px; height:24px; font-size:1.4em; }
#result #your-email .button, #result #friend-email .button { position:absolute; left:240px; margin:0; padding:0; width:82px; height:28px; color:#204167; background-color:#FFF; border:1px solid #FFF; -webkit-border-radius: 0; }
#result #try-again { background: none repeat scroll 0 0 #002753;
    border: 1px solid #FFFFFF;
    bottom: 86px;
    display: inline-block;
    font-size: 1.6em;
    padding: 2px 10px 3px;
    position: absolute;
    right: 60px; 
    cursor: pointer;}
#result p.apply { font-size:1.2em; }
#result a, #result a:visited, #result a:hover { color:#FFF; text-decoration:underline; font-weight:bold; }

.contentText h1.puzzle-head { font-size: 1.8em; }




/* ------------ Useful Stuff ------------- */
.newline {clear:both; overflow:hidden; height:0px;}
.right {float:right;}
.left {float:left;}





