/******************************************************
CSS styles for PublicExperience.com - rewritten by Anna
******************************************************/

body {
	background-color: #C4BBD1;
	padding: 0 3em; 
	font-family: 'trebuchet ms', helvetica, arial, sans-serif; 
	margin:0; 
	color:black;
}

div.bodytext {
	text-align: left; 
	padding: 1em 10ex 0 10ex;
}

/* Styles for the title */

.maintitle {
	float: left; 	
	padding-top:10px; 
	padding-bottom:30px; 
}

.maintitle a:hover {
 	color: #a0a0a0; 
	text-shadow: 1px 1px 2px #6F697A; 
}

/* The navigation bar*/

.nav {
	list-style: none;
	display: inline;
}

#navstrip {
	/* border-bottom:solid 3px #ffc33e;  
	padding-bottom: 2px; 
	margin-bottom: 2px; */
	width:100%;
	text-align:top;
}

div#navstrip ul li a {
          display:block;
          padding:2px 10px;
          background-color:#E0E0E0;
          color:#2E3C1F;
          text-decoration:none;
      }

      /* place the "current" pseudo class here */
div#navstrip ul li a.current {
          background-color:#432B6A;
          color:#FFFFFF;
      }

div#navstrip ul li a:hover {
          /* background-color:#BFB4D1;*/
 background-color:#efe9be;
          color:#FFFFFF;
      }

/* Hide things */

.hideme {
	display:none;
}

/* The cartoon: thumbnail and pop-up */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: 0px;
border: 1px dashed gray;
display: none;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
display: block;
top: -140px; /*position where enlarged image should offset horizontally */
left: -370px;
z-index: 51;

}

/*Second version of thumbnail CSS for about page (hacky) */

.thumbnail1{
position: relative;
z-index: 0;
}

.thumbnail1:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail1 span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: 0px;
border: 1px dashed gray;
display: none;
color: black;
text-decoration: none;
}

.thumbnail1 span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail1:hover span{ /*CSS for enlarged image on hover*/
display: block;
top: -140px; /*position where enlarged image should offset horizontally */
left: 400px;
z-index: 51;

}

/* Tabs for the experiences page */

/* begin css tabs */
 
ul#tabnav { /* general settings */
text-align: left; /* set to left, right or center */
margin: 1em 1em 1em 0; /* set margins as desired */
font: bold 1em 'trebuchet ms', helvetica, arial, sans-serif;  
border-bottom: 1px solid #888aa5; 
list-style-type: none;
padding: 6px 10px 3px 10px; /* THIRD number must change with respect to padding-top (X) below */
}
 
ul#tabnav li { /* do not change */
display: inline;
}
 
body#allposts li.tab1, body#busiest li.tab2, body#tagcloud li.tab3, body#recent_comments li.tab4 { /* settings for selected tab */
border-bottom: 1px solid #fff; /* set border color to page background color */
background-color: #fff; /* set background color to match above border color */
}
 
body#allposts li.tab1 a, body#busiest li.tab2 a, body#tagcloud li.tab3 a, body#recent_comments li.tab4 a { /* settings for selected tab link */
background-color: #fff; /* set selected tab background color as desired */
color: #000; /* set selected tab link color as desired */
position: relative;
top: 1px;
padding-top: 4px; /* must change with respect to padding (X) above and below */
}
 
ul#tabnav li a { /* settings for all tab links */
padding: 3px 4px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
border: 1px solid #888aa5; /* set border COLOR as desired; usually matches border color specified in #tabnav */
background-color: #c4bbd1; /* set unselected tab background color as desired */
color: #666; /* set unselected tab link color as desired */
margin-right: 0px; /* set additional spacing between tabs as desired */
text-decoration: none;
border-bottom: none;
}
 
ul#tabnav a:hover { /* settings for hover effect */
background: #fff; /* set desired hover color */
}
 
/* end css tabs */


/* Individual suggestions */

dt {
	padding-top: 3px;
}

dd {
	padding-bottom: 5px;
	/* border-bottom: 1px solid #990000; */
	border-bottom: 1px solid #432B6A; 
	padding-right: 10px;
	margin-bottom: 3px;
}

/* Alerts - show in red  [TODO - change to something more harmonious] */

.bigredbox {
    color: #ff0000;
    background-color: #ffcccc;
    border: solid 2px #990000;
    margin: 1em auto 0;
    width: 80%;
    padding: 10px;
    text-align: center;
}

/* Other messages - show in green [TODO - change to something more harmonious] */

.biggreenbox {
    color: #00ff00;
    background-color: #ccffcc;
    border: solid 2px #009900;
    margin: 1em auto 0;
    width: 80%;
    padding: 10px;
    text-align: center;
}

/* Form button styles */

input[type=submit]{
	font-family: 'trebuchet ms', helvetica, arial, sans-serif; 
	border:1px solid #999999;
	background:#EEEEEE;
}

input[type=text]{
	font-family: 'trebuchet ms', helvetica, arial, sans-serif; 
}

/*Left-hand column*/

div#maincol {
	clear:left;
	float:left;
	width:430px;
	overflow:hidden;
	background-color: white;
	padding-left: 2px;
	padding-right: 2px;
border-right: solid 2px #997D9D;
}

/* Right-hand column*/

div#inputBox {
	width:330px;
	float:right;
	padding: 0;
	padding-right: 15px;
	background-color:#FFFFFF;
}

/* Form inside right-hand column */

#inputBox form{
margin:-0.5em 0 1em 0;

}
#inputBox a#bigBox{
	display:block;
	width:6.5em;
	padding-right:10px;
	/* background: url(../images/bigbox.gif) center right no-repeat; */
}

#inputBox textarea, form#comment textarea{
	width:320px;
}

/* Footer styles */

.footerstrip { /* coloured line above footer */
	clear: both;
	margin-top: 2ex;
	/*border-top: solid 3px #ffc33e;*/
	border-top: solid 3px #736476;
}

#footer{
	padding:60px 0 10px 0;
	clear:both;
	text-align:center;
	float:none;
	width:100%;
}

#footer img{
	vertical-align:middle;
}

.footer span {
	color: #736476;
}


fieldset{
    display:block;
    margin:0;
    padding:0;
    border: solid 0 transparent; /* Opera 7.2x fix */
}

textarea{
	padding:2px;
	margin:0 0 10px 0;
}

#wrap {
	width: 800px;
	background-color: white;
	margin: 0 auto;
	margin-top: 1ex;
	padding: 1ex;
}	



p.enlarge{
        margin:-0em 0 0 0;
        padding:0;
        text-align:right;
}


/*box for signing up to email list - used on WIBBI page */
.boxout { 
	background-color: #EFE9BE; 
	color: #5f0036; 
	padding: 5px; 
	width: 67ex; 
	margin: auto;
	margin-top: 20px;
	margin-bottom: 20px;
}

/*box for signing up to email list - used on About and widget pages*/
.box_newslist { 
	background-color: #EFE9BE; 
	color: #5f0036; 
	padding: 5px; 
	width: 40ex; 
	margin: auto;
}

/*
.searchboxout {
	background-color: #ffc33e; 
	color: #5f0036; 
	margin: 0px;
	width: 100%; 
	text-align: middle;
	padding-top: -5px;
}
*/

/* First paragraph on home page */

.intropara {
	padding: 0 0.5ex;
	border-bottom: solid 3px #997D9D;
}


#twitter_div {
	width: 20em;
	float: right;
}

#comicbox {
	margin-left: 50px;
}


/*
MEMESPRING.CSS
This file is for useful reusable css 
*/

/* lists */
ul.form label {display:block; float:left; width:170px; padding-top:4px;}
ul.form label.radiolabel {display:inline; float: none;}
ul.form span.fauxlabel {display:block; float:left; width:160px;}
ul.form li {margin:5px 0;padding-bottom: 6px!important;}
ul.form input.textbox {width:165px;}
ul.form select {width:175px;}
ul.form input.textbox.small, ul.form select.small {width:80px;}
ul.form input.textbox.verysmall {width:30px;}
ul.form select.verysmall {width:45px;}
ul.form input.textbox.right {text-align:right;padding-right:0.2em;}

ul.collapse, ol.collapse {margin:0;padding:0;}
ul.collapse li, ol.collapse li {margin:0;padding:0;float:left;}
ul.collapse li, ol.collapse {list-style-type:none;}

ul.inline {margin:0;padding:0;}
ul.inline li {display:inline;margin:0;padding:0;}

ul.nobullets {list-style-type:none;margin:0;padding:0;}
ul.nobullets li {margin:0;padding:0;}

/* image replacement */
.hide {display:none;}

/* clear */
br.clear {clear:both}

/* controls */
fieldset {border:none; padding:0; margin:0;}

/* links */
a img {border:none;}

/* headings */
h1, h2, h3, h4, h5, h6 {margin:0;padding:0;}

/* form elements */
input.textbox.autopostback {background: white url('/images/return.png') no-repeat right 50%;}
input select, textarea {background:white}
input.textbox {width:180px;}
input.textbox.small {width:80px;}
input.textbox.verysmall {width:80px;}
input.textbox.right {text-align:right;padding-right:0.2em;}

/* alignment */
.alignright {text-align:right;}

/* tables */
table {border-collapse: collapse;}


/*
FROM IQUANGO.CSS
*/

/* header and link styles */

h1 {background:white; border-bottom:solid 3px #ffc33e; width:100%; height:83px;}

h2 { text-decoration: underline;}

a {color:#5E2966; text-decoration: none}

#divContent {margin-bottom:3em}
	
/* #frmSearch {margin-top:2em; background:#ffc33e; width:30em; margin:2em auto; padding:1em 0;}
#frmSearch label {display:block;padding-bottom:0.7em; font-weight:normal; font-size:1.2em}
#frmSearch input.text {padding:0.2em; font-size:1.1em; width:15em;}
#frmSearch input.button {height:2.5em; margin-bottom:0.2em; font-weight:bold}
#frmSearch small {font-size:0.7em; position:relative; left:-50px}

#frmSearch.small {margin-top:2em; font-size:0.7em; padding:0.4em 0 1em 0;}
#frmSearch.small label {padding-bottom:0.5em}
#frmSearch.small input.button {height:2em; margin-bottom:0em; font-weight:bold} */

#divRandomSearches {width:30em;text-align:left;margin:auto; border-top:dotted 1px #888;
	padding-top:0.5em;}
/* #divRandomSearches h3 {font-size:1em;}	 */
#divRandomSearches ul {font-size:0.8em; list-style: square;padding-left:1em; margin-left:0;margin-top:0.5em;}

div.resultsplit {width:44%;padding:2% 1% 1% 4%; float:left; text-align:left; font-size:0.9em}
/* div.resultsplit  h3 {font-size:1.3em} */

#divFooter {font-size:0.8em; border-top:dotted 1px #888;padding-top:0.3em; font-size:0.7em; clear:both;padding-bottom:3em}
#divFooter a {color:#333; margin-right:1em;}


.entry_0 { background: #eeeeee; }

.entry_1 { background: #eeeeff; }


.iquango_country_news_block {
	width: 10em;
	float: right;
	padding-left: 1ex;
}



.iquango_country_news_list {
	font-size: 75%;
}