/* Imports
-------------------------------------------------------------- */


/* Resets
-------------------------------------------------------------- */
* { margin: 0; padding: 0; }
a { outline: none; }
img { border: none; }

/* Typography
-------------------------------------------------------------- */
h1, h2, h3 { font-weight: bold;  }
h1 { font-size: 18px; text-transform: uppercase; letter-spacing: -1.5px; margin-bottom: 10px; }
h2 { font-size: 18px; font-family:  }


/* Some Classes
-------------------------------------------------------------- */
.clear {clear: both; }
.small { font-size: 10px; }
.bold { font-weight: bold; }
.grey { color: #ccc; line-height: 14px; }
.noborder { border: none; }
.textmid { vertical-align: middle; color: #fff; }
.highs { color: #fff; }
.top-mgn { margin-top: 20px; }
.center { text-align: center; }
.itals { font-style: italic; font-family: Times, serif;  }

/* HTML Elements
-------------------------------------------------------------- */
html, body { font-size: 12px; font-family: Helvetica, Arial, sans-serif; background: url(../imgs/bg-body.gif) top left repeat-x #fff; height: 100%; }
p { margin: 0 0 10px; color: #333; }
a { color: #ff1a00; text-decoration: none; }
a:hover { color: #72be44; text-decoration: none; }

/* Main Menu
-------------------------------------------------------------- */
ul#pagenav { list-style: none; }
ul#pagenav li { display: inline; }
ul#pagenav li a { text-indent: -9999px; display: block; height: 108px; float: left;  }

ul#pagenav li a.l { background: url(../imgs/nav-l.gif) no-repeat bottom center; width: 95px; }
ul#pagenav li a.i { background: url(../imgs/nav-i.gif) no-repeat bottom center; width: 65px; }
ul#pagenav li a.v { background: url(../imgs/nav-v.gif) no-repeat bottom center; width: 106px; }
ul#pagenav li a.e { background: url(../imgs/nav-e.gif) no-repeat bottom center; width: 105px; }

ul#subnav { list-style: none; margin: 5px 0 0 30px; }

ul#cloud { list-style: none; }
ul#cloud li { display: inline; }
ul#cloud li a { text-indent: -9999px; display: block; height: 98px; float: left; }
ul#cloud li a.joincloud { background: url(../imgs/join-cloud.gif) no-repeat bottom center; width: 256px; }

/* Menu Hovers
-------------------------------------------------------------- */
ul#pagenav li a.l:hover, ul#pagenav li a.i:hover, ul#pagenav li a.v:hover, ul#pagenav li a.e:hover, ul#cloud li a.joincloud:hover { background-position: top center; }


/* Menu Hovers
-------------------------------------------------------------- */
body#learn ul#pagenav li a.l, body#inspire ul#pagenav li a.i, body#value ul#pagenav li a.v, body#enjoy ul#pagenav li a.e { background-position: top center; }


/* Page Elements
-------------------------------------------------------------- */

#wrapper { width: 960px; height: 100%; }

#header { width: 500px; height: 180px; float: right; }
#header .nav { width: 330px; height: auto; position: absolute; left: 650px; top: 0; padding-top: 20px; }
#header ul.menu li  { display: inline; list-style: none; text-align: center; float: left; margin: 0 10px; }

#maincontent { width: 380px; height: 455px; padding: 0 20px; position: absolute; top: 150px; left: 180px; }
#maincontent .alpha { width: auto; height: auto; padding: 10px; }
#maincontent .contact { width: 200px; height: auto; margin: 50px auto; }
#graphic { width: 310px; height: 455px; padding: 20px; position: absolute; top: 149px; left: 580px; text-align: center; }

#sidebar { width: 184px; min-height: 850px; height: 100%; background: url(../imgs/bg-sidebar.png) top right repeat-y; z-index: 2; float: left; }
* html #sidebar { height: 100%; }

#sidebar .logo { width: auto; height: auto; padding: 20px 10px;  }

#footer { width: 760px; height: 150px; position: absolute; top: 720px; left: 195px; }
#footer .foots {  float: left; width: 300px;  }
#footer ul.footlinks li  { list-style: none; display: inline; border-left: 1px solid #ccc; padding: 0 10px; }
#footer ul.footlinks li a { color: #72be44; }
#footer ul.footlinks li a:hover { color: red; }
#footer .net { float: right; width: 300px; text-align: center; }


/* Easy Scroll
-------------------------------------------------------------- */

#easyscroll { width: 350px; }	
#easyscrollnav, #easyscrollnav li { height: 28px; line-height: 28px; margin:0; padding:0;  }	
#easyscrollnav { margin: 2px 0; border-top: 1px solid #ccc; position: absolute; bottom: 60px; }
#easyscrollnav li { list-style:none; float: left; margin-right: 10px; padding:0 10px; color:#333; cursor: pointer; }
#easyscrollnav li.over { color:#999; text-decoration: underline; }

/* Jscroll
-------------------------------------------------------------- */

.scroll-pane 		{ width: 350px; overflow: auto; padding-right: 10px; height: 260px; }
.jScrollPaneContainer 	{ position: relative; overflow: hidden; z-index: 1; }
.jScrollPaneTrack 		{ position: absolute; cursor: pointer; right: 0; top: 0; height: 100%;
						  background: url(../imgs/scrollbar.gif) top center repeat-y; padding: 1px; }
.jScrollPaneDrag	{ position: absolute; background: url(../imgs/scroll.png) center center no-repeat;
					  cursor: pointer; overflow: hidden; }