/*--------------------------------------------------------------------------

CareersTube - Sales Style Sheet

Version:	1.0
Author:		Danny Peplow
Website:	http://www.careerstube.com/

Additional Mentions
-------------------

FAMFAMFAM Icons
Mark James
http://www.famfamfam.com/lab/icons/silk/


*** Last Modify Date: 19/03/2009 ( Danny ) ***

--------------------------------------------------------------------------*/

/* Structure 

	=Global
	=Typography
	=Headings
	=Links
	=Access Keys / Jumps
	=Forms
	=LayoutStructure
		- header
		- navigation
		- p-content	
		- s-content
		- footer
	=Shared Styles
	=header
	=p-content ( insides )
	=s-content ( insides )
	=footer ( insides )

--------------------------------------------------------------------------*/


/* =Global 
--------------------------------------------------------------------------*/

* { margin: 0; padding: 0; } 

body { line-height: 1.4; background: #eeeeee; }

.clearme { clear: both; }
.hideme { display: none; } /* visibility: hidden; could be used here instead depends what you need */
.left { float: left; }
.right { float: right; }

acronym { speak: normal; }
abbr { speak: spell-out; }


/* =Typography
 *
 * Use this section for general type styles
--------------------------------------------------------------------------*/



/* =Headings
--------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 { font-family: "Trebuchet MS", Tahoma, Arial, Sans-Serif; color: #003386; }


/* =Links
 * 
 * LVHA ( :link / :visited / :hover / :active ) - important due to the way CSS handles cascade / ordering.
--------------------------------------------------------------------------*/

a { }
a:link { }
a:visited { }
a:hover, a:active, a:focus { }

a img { border: none; }


/* =Access Keys / Jumps
--------------------------------------------------------------------------*/


/* =Forms
--------------------------------------------------------------------------*/


/* =LayoutStructure
--------------------------------------------------------------------------*/

#sitecontainer { margin: 0 auto; width: 936px; }

#header 
{
	position: relative;
	width: 936px;
	background: none;
	padding: 0;
}
#header #header-inner { border-top: 13px solid #003386; padding: 0 0 5px; height: 99px; background: url(/img/sales/header_bg.jpg) no-repeat top left; }

#navigation 
{ 
	margin: 6px 19px;
	list-style: none;
}

#p-content { margin: 11px 0 10px 19px; float: left; width: 558px; min-height: 350px; display: inline; position: relative; }
#s-content { margin: 10px 19px 10px 0; float: right; width: 326px; display: inline; position: relative; }


/* =Shared Styles
 *
 * If you find your re-using the same styles on certain elements 
 * put them here
--------------------------------------------------------------------------*/

.small-print { font-size: 0.93em; margin: 0 0 4px 30px; color: #8B8B8B; }
.small-print a { font-size: 1em; text-decoration: underline; color: #8B8B8B; }
.small-print a:hover { text-decoration: none; }


/* =navigation
--------------------------------------------------------------------------*/


/* =contentcontainer
-------------------------------------------------------------------------*/

#contentcontainer { background: #fff url(/img/sales/contentcontainer-bg-top.gif) top left no-repeat; min-height: 500px; }


/* =header
--------------------------------------------------------------------------*/

#header { position: relative; }

#login, #more-info
{
	display: block; 
	width: 266px; 
	height: 28px; 
	position: absolute;
	right: 15px;
	top: 30px;
	background: url(/img/sales/login.gif) top left no-repeat;
	text-indent: -9999em;
}
#login:hover { background: url(/img/sales/login_on.gif) top left no-repeat; }

#more-info { background: url(/img/sales/login/more_info.gif) top left no-repeat !important; width: 273px !important; }
#more-info:hover { background: url(/img/sales/login/more_info_on.gif) top left no-repeat !important; }


/* =p-content
--------------------------------------------------------------------------*/

#banner { clear: both; margin-bottom: 12px; width: 558px; }
.carousel { margin-top: 15px; clear: both; }

.video-detail a.back  
{
	text-indent: -9999em; 
	background: url(/img/sales/back.gif) top left no-repeat; 
	display: block; 
	margin: 15px 0;
	height: 19px;
	width: 79px;
}

.video-detail a.view-all-videos  
{
	text-indent: -9999em; 
	background: url(/img/sales/all_videos.gif) top left no-repeat; 
	display: block; 
	margin: 15px 0;
	height: 19px;
	width: 79px;
}
.video-detail a.back:hover { background: url(/img/sales/back_on.gif) top left no-repeat; }
.video-detail a.view-all-videos:hover { background: url(/img/sales/all_videos_on.gif) top left no-repeat; }

.video-player { width: 448px; height: 380px; margin: 15px auto 20px auto; clear: both; }

/* Features */

body.sales-177 #p-content { width: 884px; }

body.sales-177 #p-content h1, 
body.sales-179 #p-content h1, 
body.sales-178 #p-content h1, 
body.sales-180 #p-content h1, 
body.sales-181 #p-content h1,
body.sales-183 #p-content h1,
body.sales-187 #p-content h1,
body.sales-184 #p-content h1 { font-size: 1.9em !important; }

body.sales-177 #p-content h2, 
body.sales-179 #p-content h2, 
body.sales-178 #p-content h2, 
body.sales-180 #p-content h2, 
body.sales-181 #p-content h2,
body.sales-183 #p-content h2,
body.sales-187 #p-content h2.tag-line,
body.sales-184 #p-content h2 { border: 0; padding: 0; margin: 0; color: #67ccf1; font-size: 1.7em !important; }
body.sales-177 #p-content h3 { border: 0; padding: 0; margin: 0; }


body.sales-177 ul#features { clear: both; float: left; width: 884px; margin: 25px 0; }

body.sales-177 ul#features li { clear: none; float: left; width: 392px; padding-right: 20px; }
body.sales-177 ul#features li h3 { margin: 0 0 4px 0; }

/* FAQ*/

#faqs { margin: 25px 0; width: 538px; padding-right: 20px; list-style-type: none; }

#faqs h3, #video-examples h2, .video-detail h2, .clients-videos h2 { font-size: 1.17em; border: 0; margin: 0 0 4px 0; padding: 0; }

#faqs li
{
	list-style-position: inside; 
	list-style-type: none; 
	background: url(/img/sales/faq_bullet.gif) top left no-repeat; 
	color: #6d6d6d;
	margin: 0 0 12px 0;
	padding: 0 0 0 30px;
}

/* Login */


body.sales-182 #p-content, 
body.sales-85 #p-content, 
body.sales-64 #p-content { width: 440px; }

h2.login { border: 0; font-size: 1.25em; font-weight: bold; color: #67CCF1; }

body.sales-182 #p-content .loginbox,
body.sales-184 #p-content .loginbox,
body.sales-85 #p-content .loginbox,
body.sales-96 #p-content .loginbox
{
	width: 440px; 
	background: url(/img/sales/login/top.gif) top left no-repeat; 
	padding: 10px 0; 
	clear: both; 
	float: left;
	margin: 0;
}
body.sales-182 #p-content .loginbox-content,
body.sales-184 #p-content .loginbox-content,
body.sales-85 #p-content .loginbox-content,
body.sales-96 #p-content .loginbox-content 
{ width: 422px; background: url(/img/sales/login/bottom.gif) bottom left no-repeat; padding: 0 9px;}

body.sales-182 #p-content .loginbox fieldset,
body.sales-85 #p-content .loginbox fieldset,
body.sales-96 #p-content .loginbox fieldset
{ width: 440px; margin: 0; padding: 0 0 12px 0; clear: both; }

.username { width: 196px; margin: 0 15px 0 0; }
.password { width: 196px; margin: 0 0 0 0; }

body.sales-182 #p-content .loginbox fieldset .username input, 
body.sales-182 #p-content .loginbox fieldset .password input,
body.sales-85 #p-content .loginbox fieldset .username input, 
body.sales-85 #p-content .loginbox fieldset .password input,
#login_form_text, #login_form_password { display: block; width: 193px; }

body.sales-182 #p-content .loginbox fieldset div.forgotten,
body.sales-85 #p-content .loginbox fieldset div.forgotten,
body.sales-96 #p-content .loginbox fieldset div.forgotten 
{ width: 330px; margin-left: 0; }

body.sales-182 #p-content .loginbox fieldset div.forgotten input.forgotten,
body.sales-85 #p-content .loginbox fieldset div.forgotten input.forgotten,
body.sales-96 #p-content .loginbox fieldset div.forgotten input.forgotten 
{ display: block; width: 320px; }

.username label, 
.password label, 
div.forgotten label, 
div.register-interest label 
{ display: block; width: 196px; }

body.sales-182 #p-content .loginbox fieldset #forgotten_form_submit,
body.sales-184 #p-content .loginbox fieldset #interest_form_submit,
body.sales-85 #p-content .loginbox fieldset #forgotten_form_submit,
body.sales-96 #p-content .loginbox fieldset #forgotten_form_submit
{
    margin: 25px 0 0 10px;
    float: left;
    width: 63px; 
    height: 19px;    
    background: url(/img/sales/login/submit.gif) no-repeat top left;
    border: none;
    text-indent: -9999em;
    cursor: pointer;
    clear: none;
}

body.sales-184 #p-content .loginbox fieldset #interest_form_submit 
{ margin: 0; position: absolute; bottom: 8px; left: 255px; }

body.sales-182 #p-content .loginbox div.rememberme,
body.sales-85 #p-content .loginbox div.rememberme,
body.sales-96 #p-content .loginbox div.rememberme 
{ width: 348px; clear: both; margin: 0; }

body.sales-182 #p-content .loginbox a.forgotten,
body.sales-85 #p-content .loginbox a.forgotten,
body.sales-96 #p-content .loginbox a.forgotten
{ margin: 0; }

label#remember-me { margin-right: 113px; }
#login_form_check { margin-top: 1px; margin-left: 1px; }


body.sales-182 #p-content .loginbox #login_form_submit,
body.sales-85 #p-content .loginbox #login_form_submit,
body.sales-96 #p-content .loginbox #login_form_submit
{ float: right; margin-right: 30px; display: inline; position: relative; }

body.sales-182 #s-content, body.sales-85 #s-content, body.sales-64 #s-content { width: 440px; margin-top: 35px; }
body.sales-182 #s-content h2.login, body.sales-85 #s-content h2.login { margin-bottom: 6px; }

#video-examples, .clients-videos { width: 558px; clear: both; float: left; margin: 25px 0; }

#video-examples li { width: 558px; float: left; clear: both; list-style: none; margin: 0 0 12px 0; }
#video-examples li a { float: left; width: 128px; height: 96px; margin: 0 12px 5px 0; }

#p-content #video-examples li h2 { width: 540px; float: none; clear: none; font-size: 1em !important; }

#video-examples li h2 a { float: none; margin: 0; padding: 0; color: #003386; text-decoration: none; font-size: 1.17em !important; }
#video-examples li h2 a:hover { text-decoration: underline; }

#video-examples li p { width: 540px; }

.clients-videos li { width: 242px; float: left; clear: none; list-style: none; margin: 0 26px 16px 0; overflow: hidden; }
.clients-videos li.alt { margin: 0 0 16px 0 !important; }

.clients-videos li a { float: left; width: 240px; height: 221px; margin: 0 12px 5px 0; border: 1px solid #eee; }
.clients-videos li a.client-link { width: auto !important; height: auto !important; border: 0 !important; }

.clients-videos li h2 { width: 240px; float: none; clear: both; margin: 0 0 -2px 0; }

.clients-videos li h2 a { float: none; margin: 0; padding: 0; color: #003386; text-decoration: none; }
.clients-videos li h2 a:hover { text-decoration: underline; }

.clients-videos li p { width: 240px; clear: both; }

body.sales-64 div.freeform, body.sales-85 div.freeform { margin-top: 12px; }

a.got-questions  
{
	float: left; 
	width: 282px; 
	height: 65px; 
	background: url(/img/sales/faq_help.jpg) top left no-repeat; 
	margin: -3px 0 10px 28px; 
	text-indent: -9999em;
}
a.got-questions:hover { background: url(/img/sales/faq_help_on.jpg) top left no-repeat; }

/* =s-content
--------------------------------------------------------------------------*/

#s-content { clear: none; }

a.tour { clear: both; display: block; text-indent: -9999em; width: 326px; height: 97px; background: url(/img/sales/tour.jpg) top left no-repeat; }
a.tour:hover { background: url(/img/sales/tour_on.jpg) top left no-repeat; }

a.consultation 
{
	clear: both; 
	display: block; 
	text-indent: -9999em; 
	width: 326px;
	height: 107px; 
	margin-bottom: 25px;
	background: url(/img/sales/consultation.jpg) top left no-repeat;
}
a.consultation:hover { background: url(/img/sales/consultation_on.jpg) top left no-repeat; }
h3.flashlink {margin-bottom: 5px;}
.flashbutton {margin-bottom: 15px;}

.feature-pod { width: 326px; clear: both; margin: 20px 0; padding: 0; background: url(/img/sales/features_pod_top.gif) top left no-repeat; }
.feature-pod-content { background: url(/img/sales/features_pod_bottom.gif) bottom left no-repeat; padding: 9px 15px; }

.feature-pod h2 { margin: 0; padding: 0 0 12px 0; color: #003386; font-size: 1.25em; }
/*.feature-pod h3 { margin: 0 0 12px 0; padding: 0; color: #67ccf1; font-size: 1.25em; font-weight: bold; }*/

.feature-pod ul { list-style-position: inside; }
.feature-pod ul li
{
	list-style-position: inside; 
	list-style-type: none; 
	background: url(/img/sales/featured_pod_star.png) top left no-repeat; 
	color: #6d6d6d;
	margin: 0 0 12px 0;
	padding: 3px 0 3px 30px;
	display: block;
	width: 266px;
}

.feature-pod a 
{
	margin-left: 126px;
	background: url(/img/sales/more_features.png) top left no-repeat; 
	display: block; 
	width: 177px;
	height: 32px; 
	text-indent: -9999em;
}
.feature-pod a:hover { background: url(/img/sales/more_features_on.png) top left no-repeat; }
ul#features li
{
	list-style-position: inside; 
	list-style-type: none; 
	background: url(/img/sales/featured_pod_star.png) top left no-repeat; 
	color: #6d6d6d;
	margin: 0 0 12px 0;
	padding: 0 0 0 30px;
}



.new-pod { width: 326px; clear: both; margin: 20px 0; padding: 0; background: url(/img/sales/new_pod_top.gif) top left no-repeat; }
.new-pod-content { background: url(/img/sales/new_pod_bottom.gif) bottom left no-repeat; padding: 9px 15px; }
.new-pod-content h2 { margin: 0; padding: 0 0 5px 0;}
.new-pod-content p { margin: 0; padding: 0 0 10px 0;}

.new-pod h2 { margin: 0; padding: 0 0 12px 0; color: #003386; font-size: 1.25em; }
/*.feature-pod h3 { margin: 0 0 12px 0; padding: 0; color: #67ccf1; font-size: 1.25em; font-weight: bold; }*/

.new-pod ul { list-style-position: inside; }
.new-pod ul li
{
	list-style-position: inside; 
	list-style-type: none; 
	background: url(/img/sales/featured_pod_star.png) top left no-repeat; 
	color: #6d6d6d;
	margin: 0 0 12px 0;
	padding: 3px 0 3px 30px;
	display: block;
	width: 266px;
}

.new-pod a 
{
	margin-left: 126px;
	background: url(/img/sales/more_features.png) top left no-repeat; 
	display: block; 
	width: 177px;
	height: 32px; 
	text-indent: -9999em;
}
.new-pod a:hover { background: url(/img/sales/more_features_on.png) top left no-repeat; }



ul#features li
{
	list-style-position: inside; 
	list-style-type: none; 
	background: url(/img/sales/featured_pod_star.png) top left no-repeat; 
	color: #6d6d6d;
	margin: 0 0 12px 0;
	padding: 0 0 0 30px;
}





body.sales-177 #s-content 
{
	clear: both; 
	width: 900px; 
	margin: 11px 0 10px 19px; 
	padding: 0; 
	float: left; 
	position: relative; 
	display: inline; 
	min-height: 130px !important;
}

body.sales-177 #s-content a { float: left; clear: none; margin: 0 21px 0 0; display: inline; position: relative; }

body.sales-177 #s-content a.tour { background: url(/img/sales/faq_features.jpg) bottom left no-repeat; width: 286px; height: 147px; }
body.sales-177 #s-content a.tour:hover { background: url(/img/sales/faq_features_on.jpg) bottom left no-repeat; }

body.sales-177 #s-content a.consultation { background: url(/img/sales/consultation_features.jpg) bottom left no-repeat; width: 286px; height: 147px; }
body.sales-177 #s-content a.consultation:hover { background: url(/img/sales/consultation_features_on.jpg) bottom left no-repeat;; }

body.sales-177 #s-content a.careerstube-action 
{
	display: block; 
	text-indent: -9999em; 
	width: 286px;
	margin: 0;
	height: 147px; 
	background: url(/img/sales/careerstube_in_action.jpg) 0 0 no-repeat;
}
body.sales-177 #s-content a.careerstube-action:hover { background: url(/img/sales/careerstube_in_action_on.jpg) 0 0 no-repeat; }


body.sales-177 #s-content a.convinced 
{
	background: url(/img/sales/tour_features.jpg) top left no-repeat; 
	width: 286px; 
	height: 147px; 
	margin: 0 0 0 0;
	text-indent: -9999em
}
body.sales-177 #s-content a.convinced:hover { background: url(/img/sales/tour_features_on.jpg) top left no-repeat; }

#return-home 
{
	display: block; 
	clear: both; 
	float: left; 
	width: 434px; 
	height: 97px; 
	background: url(/img/sales/login/homepage_btn.jpg) top left no-repeat;
	text-indent: -9999em;
}
#return-home:hover { background: url(/img/sales/login/homepage_btn_on.jpg) top left no-repeat; }



/* =footer
--------------------------------------------------------------------------*/

#footer { background: url(/img/contentcontainer-bg-bottom.gif) top left no-repeat; margin: 0; padding: 15px 0 80px 0; border: 0; clear: both; }

#footer #copyright { width: 300px; float: left; clear: none; }

#footer ul { float: right; width: 300px; clear: none; position: relative; right: auto; top: auto; text-align: right; }





h2.below-carousel {margin-top: -15px;}

.small {font-size: 11px;}
