/******************************************************************************
 
 Init.css
 After this file is done, community_base has all required 
 functionality to share with it's child themes.
 
 We start with some base tags. See: 
 http://www.w3.org/TR/CSS21/cascade.html#specificity
 
******************************************************************************/

/* TODO: Figure out what CSS rules go in init.css and what doesn't.  */
/* Thinking that margin/padding stays here, color's don't.           */


/* TODO: i18n rules */
/* html:lang(fr-ca) { quotes: '« ' ' »' }
html:lang(de) { quotes: '»' '«' '\2039' '\203A' }
:lang(fr) > Q { quotes: '« ' ' »' }
:lang(de) > Q { quotes: '»' '«' '\2039' '\203A' } */


/* Full Height Stuff */
body.character .pagecontent { min-height: 450px; }

strong { font-weight: bold; }

nav > ul li { display: inline-block; }
ul li:first-child { margin-left: 0; }
ul li:last-child { margin-right: 0; }

body > #userbar { 
	width: 100%;
	min-width: 295px;
  min-height: 30px;
  line-height: 30px;
	padding: 0 1em;
}
body > nav > span,
#userbar nav > .not-logged-in,
#userbar nav > .logged-in,
#userbar nav > .no-cookies { display: none; }
#userbar nav > .browser { display: inline; }

body > #userbar a { color: white; margin: 0 .5em; }
body > #userbar a:hover { color: #ccc; }

body > div.vb { width: auto; }

body > div > div > header { margin: 1em auto; padding: 0 20px; width: 980px; clear: both; }

/* set default wireframe look */ 
section {
  background: #dedede;
  border: 3px solid black;
}
body > div > div > footer { 
	padding: 0 7px 5px;
}
section.raw { border: none; padding: 0; background: transparent; }
body > div > div > footer {
	width: 940px;
  margin: 10px auto;
  font-size: 11px;
	line-height: .6111em; 
}
body > div > aside > ul > li { display: inline; }

/* Form Stuff */
fieldset { position: relative; padding: 0; }
select {
   background: #dedede;
   padding: 0.2em 0.3em;
   margin: 0;
   border: 1px solid #666;
}
fieldset > legend { font-weight: bold; font-size: 1.6667em; line-height: 1.1111em; padding: .2777em 0 .2777em 0; }
legend + .popup { position: relative; top: -.5em; }

/******************************************************************************

  Now we VERY carefully introduce some VERY specific classes and ids...

******************************************************************************/

/* Base popup class */
/* TODO: shrink containing element */
.popup {
	extends: dl;
	position: relative;
}
.popup a:hover { color: black; }
.popup dt { font-size: 10px; }
.popup dd { display: none; }
.popup:hover > dd { display: block; }

/* WBID popup */
.popup > dd.wbid {
	extends: .popup:hover > dd;
	position: absolute; 
  top: 0px; 
  left: -518px; 
  width: 500px;
  padding: .5em 1em;
}

/* Base wrap/overlay classes */
.wrap { extends: div; display: none; }
.wrap.active {
	display: block;
	width: 100%;
	min-height: 100%;
	height: 100%;
	background: black;
	position: absolute;
	top: 0;
	left: 0;
}
.overlay { width: 50%; margin: 250px auto 0; text-align: center; }

#csrf-label { display: none; }

.form .expired { width: 700px; text-align: center; }

/* Base messaging */
.info { display: none; }
.info.active { display: block; }
.warning { color: #faa; }

/* Pull up FB buttons */
.fb_iframe_widget { position: relative; top: -2px; }

.tablefloat { display: table; border-spacing: 0px 0px; margin: 0; padding: 0; }

.relative-wrap { position: relative; }

nav.menu li {
	display: block;
}
fieldset { border: none; }
dd,dt { margin: 0; padding: 0; }

.breadcrumb li{ display: inline; }
.breadcrumb li:after{ content: "\25B8"; display: inline-block; padding: 0 6px 0 10px;}
.breadcrumb li:last-child:after{content: "";}

/* Clearfix */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
 
.clearfix:not(#toolbar .clearfix) {
  display: inline-block;
}
 
html[xmlns] .clearfix {
  display: block;
}
 
* html .clearfix {
  height: 1%;
}

/** Core Drupal style that ends up being used on some non-drupal pages **/
.element-invisible {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
}