﻿/*  -------------------------------------------------------------------
    Import Specific lib ----------------------------------------------- */
	
	@import './lib/global.css';
	
/*  -------------------------------------------------------------------
	Shell ------------------------------------------------------------- */
    
	body {
		background: #2F2C23 url("../img/bg_body_x.gif") top left repeat-x; 
		color: #2b2921;
		font-family: Arial, Helvetica, sans-serif;
		margin-bottom: 40px;
		text-align: center; /* IE6 Fix */
	}	
	 
    #container { 
		background: #2F2C23 url("../img/bg_content_y.gif") top center repeat-y;
		margin: 0 auto; 
		text-align: left;
		width: 946px;
    }
	
	#wrapper { 
		background: url("../img/bg_wrapper.gif") no-repeat top center;
    }	
	
/*  -------------------------------------------------------------------
	Header ------------------------------------------------------------ */
	
	#header { 
		width: 100%; height: 130px;
		position: relative; 
	}
		#logo img { display: none; }
		#logo { 
			display: block;
			position: absolute;
	        top: 18px; right: 29px;
			width:170px; height: 70px;
		}
		
		#header h1 { text-indent: -3000em; }
		#header h1 a { 
			display: block;
			position: relative;
	        top: 28px; left: 15px;
			width: 510px; height: 32px;
		}
		
		#header p {
			color: #aead9a;
			font-family: "Trebuchet MS", Helvetica, sans-serif;
			font-size: 13px;
			margin: 36px 0 0 22px;
			width: 700px;
		}
	
	#sun {
		background: url("../img/bg_sun.gif") top left no-repeat;
		display: block;
		position: absolute;
		top: 0px; right: -140px;
		width: 140px; height: 349px;
	}
	
	/* Utilities */
	ul.utilities {
        margin:0; padding:0;
        position: absolute;
        top: 100px; right: 15px;
    }
	
	ul.utilities li {
        float: left;
		list-style: none;
		margin:0; padding:0;
        margin-right: 14px;
    }

    ul.utilities li a {
    	color: #fff!important;
	    font-family: "Trebuchet MS", Helvetica, sans-serif;
		background: url("../img/bullet_utilities.gif") center left no-repeat;
		font-size: 12px;
		padding-left: 14px;
    }


/*  -------------------------------------------------------------------
    Content ----------------------------------------------------------- */
		 
	#content {
		margin-left: 15px;
		position: relative;
		top: 0; left: 0;
		width: 912px; 
	} 
		
	#content h2 {
		background: url("../img/bg_h2.jpg") top left no-repeat;
		display: block;	
		margin: 37px 0 0 0;
		text-indent: -3000em;
		width: 100%; height: 75px;  
	}
		/* Custom Style h2 */
		#content h2.h2_2 { background-image: url("../img/h2_2.jpg"); }
		#content h2.h2_3 { background-image: url("../img/h2_3.jpg"); }
		#content h2.h2_4 { background-image: url("../img/h2_4.jpg"); }
		#content h2.h2_5 { background-image: url("../img/h2_5.jpg"); }
		
		#content h2.h2_404 { background: url("../img/h2_404.jpg") top left repeat-x; width: 912px!important; }
		#content h2.h2_500 { background: url("../img/h2_500.jpg") top left repeat-x; width: 912px!important; }
		#content h2.h2_model { background: url("../img/h2_model.jpg") top left repeat-x; width: 912px!important; }

	/* Left column */
	#main {  
		background-color: #d0d0bd;
		float: left;
		width: 608px; 
	}
	#main.fullColmun { width: 912px; }
		
		#main .padding { padding: 25px; }
		
		#main img {
			background: url("../img/img_shadow.jpg") left bottom no-repeat;
			border: none;overflow:hidden;
			margin: -30px 0 0px 12px; padding: 0px 20px 12px 10px;
		}
		
		#div-read { 
			clear: left;
			display: none; 
			margin: 0; padding: 0;
			padding-top: 15px;
			*padding-top: 0; /*IE7*/
		}
		
		#main a.b_read {
			clear: left;
			color: #35342b;
			background: url("../img/bg_read.gif") bottom center no-repeat;
			display: block;
			font-family: "Trebuchet MS", Helvetica, sans-serif;
			font-weight: bold;
			margin: 0 auto; padding:15px 0 20px 0; 
			*padding-top: 0; /*IE7*/
			text-align: center;
			width: 221px;
		}
		/*#main a.b_read:hover { text-decoration: none;  background-position: 50% 110% ; }*/
			
		
	/* Right column or Sidebar */
	#sidebar {  
		background: #898976 url("../img/bg_right_y.gif") top left repeat-y;
		float: right;
		position: relative;
		width: 304px;
	}
		#sidebar .padding { padding: 8px 25px; }
		
		#sidebar #video { margin-top: 12px; }
		
		#sidebar p { margin-bottom: 3px; }
		
		#sidebar a {
			color: #fff;
			font-family: "Trebuchet MS", Helvetica, sans-serif;
			font-size: 12px;
		}	
			#sidebar a.b_learn {
				background: url("../img/bullet_right_double.gif") center left no-repeat;
				font-size: 13px;
				padding-left: 20px;	
				padding-right: 20px;
			}
			#sidebar  a.b_learn:hover { background-position: center right; }		
		
		#sidebar ul, #sidebar li { 
			list-style: none;
			margin: 0; padding: 0;
		}
		
		#sidebar li {
			background: url("../img/bullet_right.gif") 0 6px no-repeat;
			line-height: 15px;
			margin-bottom: 6px; padding-left: 14px;
			position: relative;
		}
	
		#sidebar ul li a, #sidebar ul li a:visited, #sidebar ul li a:active {
			font-size: 13px;
		} 
		
		#sidebar  h3 {
			background: bottom left no-repeat;
			display: block;	
			margin: 0; padding: 0;
			padding-top: 20px;
			margin-bottom: 6px; 
			text-indent: -3000em;
			width: 100%; height: 22px; 
		}
		
		#sidebar  h3.h3_links { background-image: url("../img/h3_links.gif"); }
		#sidebar  h3.h3_video { background-image: url("../img/h3_video.gif"); }
		#sidebar  h3.h3_complementary { background-image: url("../img/h3_complementary.gif"); }
		#sidebar  h3.h3_learn { background-image: url("../img/h3_learn.gif"); height: 46px; }

	/*  Column
		----------------------------------------------- */
		.column { float:left; position: relative; }
		.last { float: right; }
		
		/* Use these classes to set how wide a column should be. */
		.w-33 { width: 33%; }
		.w-50 { width: 50%; }
		.w-100 { width: 100%; }

/*  -----------------------------------------------------------------------
    Navigation ------------------------------------------------------------ */

	/*  Main Nav
		----------------------------------------------- */
		ul.menu {
			position: absolute; 
			top: -32px; left: 0; 
			width: 608px;		
		}
		
		ul.menu , ul.menu li  {
			list-style: none;
			margin: 0; padding: 0; 
		}
		
		ul.menu li {
			display:inline;
			text-indent:-3000em;
			margin:0; padding:0;
		}

		ul.menu li a {
			background: top left no-repeat;
			display: block;
			float: left;
			position: relative;
			width: 118px; height: 69px; 
			text-decoration: none;
			z-index: 1;
		}
		
		ul.menu li.m_1 a { background-image: url("../img/m_1.jpg"); width: 101px; }
		ul.menu li.m_2 a { background-image: url("../img/m_2.jpg"); width: 103px; }
		ul.menu li.m_3 a { background-image: url("../img/m_3.jpg"); width: 119px; }
		ul.menu li.m_4 a { background-image: url("../img/m_4.jpg"); width: 135px; }
		ul.menu li.m_5 a { background-image: url("../img/m_5.jpg"); width: 150px; }
		
		ul.menu li a:hover { background-position: 0 -69px!important; }
		
		/* Menu Selected */ 
		ul.menu li a.selected { z-index: 99; }
		ul.menu li a.selected span { background: top left no-repeat; position: absolute; top: -13px; height: 82px; }
		ul.menu li.m_1 a.selected span { background-image: url("../img/m_1_s.jpg"); width: 114px; left: -8px; }
		ul.menu li.m_2 a.selected span { background-image: url("../img/m_2_s.jpg"); width: 117px; left: -5px; }
		ul.menu li.m_3 a.selected span { background-image: url("../img/m_3_s.jpg"); width: 134px; left: -3px; }
		ul.menu li.m_4 a.selected span { background-image: url("../img/m_4_s.jpg"); width: 146px; left: -2px; }
		ul.menu li.m_5 a.selected span { background-image: url("../img/m_5_s.jpg"); width: 156px; left: -6px; }
		
		
	/*  Sub Navigation
		----------------------------------------------- */
		#subNav {
			background: #8A8A76 url("../img/bg_right_x.gif") bottom left repeat-x;
			clear: both;
			height: 39px;
		}
		
		#subNav div.sidebar_corner {
			background: url("../img/bg_right_xy.gif") top left no-repeat;
			display: block;
			float: left;
			width: 24px; height: 39px;
		}
		
		ul.subMenu, ul.subMenu li { 
			margin: 0; padding: 0;
			list-style: none;
		}
		
		ul.subMenu {
			float: left;
			width: 608px;
		}
		
		ul.subMenu li {
			background: top left no-repeat;
			display: inline; 
			float: left;
			height: 39px;
		}
		
		ul.subMenu li a {
			float: left;
			width: 250px; height: 39px;
			text-decoration: none;
			text-indent: -3000em;
		}
		
		ul.subMenu li a.b_previous { float: right; }
		
		/* Button Previous */
		ul.subMenu li.sm_2_previous { background-image: url("../img/sm_2_previous.jpg"); width: 301px; }
		ul.subMenu li.sm_3_previous { background-image: url("../img/sm_3_previous.jpg"); width: 301px; }
		ul.subMenu li.sm_4_previous { background-image: url("../img/sm_4_previous.jpg"); width: 301px; }
		ul.subMenu li.sm_5_previous { background-image: url("../img/sm_5_previous.jpg"); width: 301px; }		
		
		/* Button Next */
		ul.subMenu li.sm_2_next { background-image: url("../img/sm_2_next.jpg"); width: 307px; }
		ul.subMenu li.sm_3_next { background-image: url("../img/sm_3_next.jpg"); width: 307px; }
		ul.subMenu li.sm_4_next { background-image: url("../img/sm_4_next.jpg"); width: 307px; }
		ul.subMenu li.sm_5_next { background-image: url("../img/sm_5_next.jpg"); width: 307px; }
	
/*  -------------------------------------------------------------------
    Popin ------------------------------------------------------------- */
	
	#overlay { background-color: #000; }
	
	#popin {
		margin-left: -255px;
		text-align: left;
		top: -500px; left: 50%;
	}

	.popin {
        background-color: #d0d0bd; 
        border: 1px solid #898976;
        overflow: hidden;
        width: 510px;
	}

		.popin .popin_content {
			padding: 24px;
		}
		
		#popin a.b_close {
			background: url("../img/b_close.gif") center right no-repeat;
			color: #444035;
			cursor: pointer;
			float: right;	
			font-family: "Trebuchet MS", Helvetica, sans-serif;
			font-size: 12px;
			position: absolute;
			top: 15px; right: 24px;
			padding-right: 14px;
		}


/*  -------------------------------------------------------------------
    Form Setup --------------------------------------------------------- */
	
	fieldset {  border: none!important; margin-bottom: 15px; } 
	label {
		color: #000; 
		/*display: block;*/
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px;
		font-weight: normal; 
	} 
	form ul, form ol { margin: 0; padding: 0; position: relative; } 
	form li {
		list-style: none;
		margin: 0; padding: 0;
		margin-bottom: 4px; 
	}
		
		/* Form Elements 
		----------------------------------------------- */	
		textarea, select, input { 
			background: #fff;
			border: 1px solid #c8c8b8;
			color: #312d2e; 
			padding: 2px 4px; 
		}
		
		/* Hover, Focus
		----------------------------------------------- */
		input.hover, textarea.hover { background: #FEFEC2; } 
		input.focus, textarea.focus { border: 1px solid #000!important; background: #fff!important; }
		
		/* STF
		----------------------------------------------- */
		#frm_stf { width: 100%; }
		#frm_stf legend { 
			padding-bottom: 10px;
			*margin-left: -7px!important; /*IE7*/
		}
		#frm_stf legend em {
			background: top left no-repeat;
			display: block;
			height: 30px;
			text-indent: -3000em;
		}		
			#frm_stf legend.t_share1 em { background-image: url("../img/t_share1.gif"); width: 254px; }
			#frm_stf legend.t_share2 em { background-image: url("../img/t_share2.gif"); width: 160px; }
			#frm_stf legend.t_share3 em { background-image: url("../img/t_share3.gif"); width: 160px; }
		
		#frm_stf li {
			float: left;
			margin-right: 2%;
			width: 48%; border: 1px solid #D0D0BD; 
		}
		#frm_stf li.last { float: right; margin-right: 0; }
		
		#frm_stf br { margin:0!important; }
		#frm_stf input { width: 212px; height: 1.29em; }
		#frm_stf textarea { width: 212px; height: 8.94em; margin:0!important; }
		
		#b_submit { 
			background: #5f5f4f url("../img/bullet_bottom.gif") 28% 52% no-repeat;
			border: 1px solid #c8c8b8; 
			color: #fff;
			cursor: pointer;
			display:block;
			font-family: "Trebuchet MS", Helvetica, sans-serif;
			font-size: 11px; 
			font-weight: normal;
			margin: 0; padding: 2px 0px;
			width: 100%!important; height: 2.1em!important;
		}
		
		/* Share Icons */
		ul#share_btn { margin: 0; padding: 0; }
		ul#share_btn li { 
			display: inline;
			list-style: none;
			margin: 0; padding: 0; 
			margin-right: 32px;
			width: 32px;
		}
		ul#share_btn li a { 
			background: top left no-repeat;
			display: block;
			float: left;
			text-indent: -3000em;
			width: 32px; height: 32px;
		}
		ul#share_btn li a:focus { outline: 1px #000 dotted!important; }

			ul#share_btn li a.b_facebook { background-image: url("../img/ico_facebook.gif");  }
			ul#share_btn li a.b_myspace { background-image: url("../img/ico_myspace.gif"); }
			ul#share_btn li a.b_delicious { background-image: url("../img/ico_delicious.gif"); }
			ul#share_btn li a.b_twitter { background-image: url("../img/ico_twitter.gif"); }
			
/*  -------------------------------------------------------------------
    Bottom & Footer --------------------------------------------------- */

	#bottom { 
		background: #423F31 url("../img/bg_footer_x.gif") bottom left repeat-x;
		clear: both; 
		padding: 30px 20px 10px 20px;
	}
	
		#bottom a {
			color: #fff;
			font-family: "Trebuchet MS", Helvetica, sans-serif;
			font-size: 12px;
		}	
			#bottom  a.b_learn {
				background: url("../img/bullet_bottom_double.gif") center left no-repeat; 
				font-size: 13px;
				padding-left: 20px;	
				padding-right: 20px;
			}
			#bottom  a.b_learn:hover { background-position: center right; }	
		
		span.sep { 
			color: #9db2c6; 
			padding: 0px;
		}
		
		#bottom ul, #bottom li { 
			list-style: none;
			margin: 0; padding: 0;
		}
		
		#bottom li {
			background: url("../img/bullet_bottom.gif") 0 5px no-repeat;
			line-height: 15px;
			margin-bottom: 6px; padding-left: 14px;
			position: relative;
		}
		
		#bottom ul li a, #bottom ul li a:visited, #bottom ul li a:active {
			font-size: 13px;
		} 
	
		#bottom p {
			color: #aead9a;
			font-family: "Trebuchet MS", Helvetica, sans-serif;
			font-size: 12px;
			margin-bottom: 3px;
		}
		
		#bottom p.footer-links { clear: left; padding-top: 20px; }
		#bottom p.copyright { font-size: 12px; }
				
	#footer { 
		clear: both; 
		background: url("../img/bg_footer_b.gif") bottom left no-repeat; 
		width: 946px; height: 21px; 
	}	


/*  -------------------------------------------------------------------
    Custom Pages ------------------------------------------------------ */

	/*  Home
		----------------------------------------------- */
		#p_1 #wrapper { background: url("../img/bg_wrapper_home.gif") no-repeat top center;	}
		#p_1 ul#menu { background: transparent!important; margin-top: 15px!important; }
		
		#p_1 #header .hide { display: block; }
		#p_1 ul.utilities { top: 125px; left: 24px; }
		#p_1 #content { background-color: transparent; }	
		#p_1 #flash_home { margin-top: 15px; }
			

