@CHARSET "UTF-8";

#page {margin:auto;width:900px;background-image: url('../img/workflow4people.jpg');background-repeat:no-repeat;}
#page {border:0px dotted red;}

#masthead {float:left;border:0px dotted green;width:100%}
#masthead img {float:left;}
#masthead div {float:left;}
div#bannertext {padding:0px 0px 0px 410px;margin:0px;height:110px;}
#masthead div h1 { font-size: 48px;margin:5px;padding-bottom:0px;text-align:center;}
#masthead div h2 { font-size: 18px;text-align:center;}
#tweets-bar {float:left;width:300px;clear:left;height:300px;margin-right:10px;color:#666;}
#news-bar {float:left;width:300px;clear:left;height:400px;margin-right:10px;color:#666;}

#narrowbody {float:left;width:580px;margin-right:10px;}
#narrowbody div {color:#666;}
#widebody {float:left;width:900px;}
body,h1,h2 {font-family : Arial, Helvetica, sans-serif;color:#68a;}
h1 {font-size:18px;margin-top:5px;}
h2 {font-size:16px;text-align:left;}
body {font-size:14px;}


.wf4pblue {color:#68a;}
.wf4pred {color:#D20;}
.footer {font-size:11px;text-align:center;color:#68a;clear:both;margin-top:10px;padding-top:10px;}


div.menubar {float:left;border:0px dotted black;height:30px; padding-left:0px;margin-left:0px;clear:both;width:100%;padding-bottom:0px;margin-bottom:0px; border-top:1px solid #888;border-bottom: 1px solid #888; border-right: 1px solid #888; background-color:#eee;}
div.menubar ul {padding:0px;margin-left:0px;margin-top:0px;}
div.menubar ul li {display:block;border-right:1px solid #888;border-top:0px solid #888;border-bottom: 0px solid #888;margin-left:0px;height:25px;float:left;wwidth:100px;padding-left:0px;}
div.menubar ul li.first {border-left:1px solid #888;}
div.menubar ul li {font-size:10px;font-weight:bold;color:#D20;}
div.menubar ul li:hover {background-color:#68a;cursor:pointer;color:#DDD !important;}
div.menubar ul li a {height:100%;vertical-align:middle;padding: 0 6px;text-decoration:none;color:#D20;margin:1px;aaheight:25px;line-height:25px;}

div.menubar ul li {background-color:#eee; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=88);-moz-opacity:0.88;}


div.menubar ul li:hover a {color:#DDD !important;}
div.menubar ul li.selected a {color:#DDD;}

div.menubar ul li.selected {background-color:#68A;color:#888;}

img.arrow {float:right;border:none;margin-left:10px;}

/*JUITTER PLUGIN CSS*/
#tweets{} /*Juitter container*/
#tweets .twittList{color:#666;margin:0;padding:0;font-size:80%;} /* UL that will contain the list of tweets */
/* Bellow the list of tweets "<li>" */
#tweets .twittLI{list-style:none;background:#fff;margin:0;padding:5px 0 0 0;border-bottom:dashed 1px #ccc;padding:3px;clear:both;height:55px;} 
#tweets .twittList A{color:#68a;} /*Links inside the tweets list */
/* Bellow the CSS for the avatar image  */
#tweets .juitterAvatar{float:left;border:solid 1px #CCC;background:#FFF;margin-right:5px;padding:2px;width:48px;;height:48px;}
#tweets .jRM{float:right;clear:both} /*read it on twitter link*/
#tweets .extLink{} /*CSS for the external links*/
#tweets .hashLink{} /*CSS for the hash links*/
/*end of Juitter CSS*/



/*
 * News CSS
 */

ul.news {color:#666;margin:0;padding:0;font-size:80%;} /* UL with newslist  */
ul.news li {list-style:none;background:#fff;margin:0;padding:5px 0 0 0;border-bottom:dashed 1px #ccc;padding:3px;clear:both;height:55px;background-image:url('../img/workflow4people-oneguy.jpg');background-repeat:no-repeat;padding-left:50px;} 
ul.news li a{color:#68a;} /*Links inside the news list */