/* ---------------------------------------------------------------

	English Stylesheet for KRCS
	Kuwait Red Crescent Society
	
	Developed by: KCCG (Kuwaiti Canadian Consulting Group)

--------------------------------------------------------------- */

/* ------ HTML Tags ------ */
body {
	font:12px arial,"trebuchet ms",verdana,arial,sans-serif;
	background:#D6D5EE;
	text-align:center;
	margin:0px;
	padding:0px;
}
div,p,td,span {
	direction:ltr;
}
h1,h2,h3,h4,h5,h6 {
	margin:0px;
	padding:0px;
}
a {
	color:#393484;
	text-decoration:none;
}
a:hover {
	color:#FFF;
	text-decoration:underline;
}
h2 {
	color:#990000;
	text-align:left;
	font:18px "trebuchet ms",verdana,arial,sans-serif;
}
h3 {
	font:bold 13px "trebuchet ms",verdana,arial,sans-serif;
}
h3.archive {
	font:14px "trebuchet ms",verdana,arial,sans-serif;
	color:#990000;
}
h3 a:hover {
	color:#990000;
}


/* ------ Various Class ------ */
.clear {
	clear:both;
}
img.imgheader{
	margin-bottom:20px;
}


/* ------ Layout ------ */
#container {
	width:720px;
	height:450px;
	margin:0px auto;
	text-align:left;
	position:relative;
	z-index:0;
	background:transparent url("../images/bg_contentarea.jpg") no-repeat bottom left;
}
#topcontent {
	background:transparent url("../images/bg_topcontent.jpg") no-repeat top left;
	width:687px;
	height:165px;
	position:absolute;
	z-index:1;
}
#wrap {
	position:relative;
	z-index:2;
	height:auto !important;
	height:1px;
}

/* Navigation */
#nav {
	margin-left:72px;
	padding-top:13px;
	position:relative;
	z-index:10000;
}
#webtitle {
	position:relative;
	z-index:1;
	background:transparent url("../images/bg_krcs.gif") no-repeat top left;
	width:413px;
	height:77px;
	text-indent:-9000px;
	top:20px;
	left:30px;
}
#webtitle h1 a,
#webtitle-int h1 a {
	display:block;
	width:413px;
	height:77px;
}
#content-area {
	position:relative;
	z-index:1;
	width:230px;
	left:35px;
	font:12px arial,"lucida sans",verdana,arial,sans-serif;
}
#content-area p {
	color:#333;
	line-height:18px;
	margin:0px;
	padding:0px;
	text-align:justify;
}

/* Photo */
#photo {
	position:absolute;
	bottom:-28px;
	right:5px;
	width:449px;
	height:329px;
	background:transparent url("../images/bg_photo.gif") no-repeat top left;
	z-index:2;
}
#photo .img-pict {
	position:absolute;
	top:32px;
	left:27px;
	z-index:1;
}

/* Footer */
#footer {
	width:720px;
	margin:0px auto;
	text-align:left;
	position:relative;
	z-index:0;
}
#footer p {
	margin:0px;
	padding:0px;
	color:#666 !important;
	margin-left:10px;
	font-size:10px;
	position:relative;
	top:-10px;
}
#footer p a {
	text-decoration:underline;
	color:#666 !important;
}



/* ------ Interior page ------ */
#container-interior {
	width:762px;
	margin:0px auto;
	position:relative;
	text-align:left;
	background:transparent url("../images/bg_krcs_interior.jpg") repeat-y top left;
	min-height:300px;
	height:auto !important;
	height:300px;
}
#interior-top {
	background:transparent url("../images/bg_interior_top.jpg") no-repeat top left;
	position:absolute;
	top:0px;
	left:0px;
	width:762px;
	height:212px;
}

#webtitle-int {
	position:relative;
	text-indent:-9000px;
	z-index:1;
	background:transparent url("../images/bg_krcs_interior.gif") no-repeat top left;
	top:25px;
	left:30px;
	height:68px;
	width:341px;
}

#nav-int {
	margin-left:115px;
	padding-top:24px;
	position:relative;
	z-index:10000;
	height:30px;
}

#page {
	position:relative;
	z-index:10;
	width:650px;
	left:35px;
	top:40px;
	padding-bottom:50px;
}
#page-content {
	padding-bottom:30px;
	font:13px arial,"trebuchet ms",verdana,arial,sans-serif;
	color:#535353;
}
#page-content,
#page-content p {
	font:13px arial,"trebuchet ms",verdana,arial,sans-serif;
	color:#333;
	line-height:20px;
	margin-bottom:10px;
	position:relative;
	z-index:1000;
}
h2.pagetitle {
	margin-bottom:20px;
	text-transform:uppercase;
}
#archive {
	background:#E4E1F4;
	padding:10px 0px;
	border:1px solid #CCC;
	margin-top:20px;
}
#archive-content {
	width:95%;
	margin:0px 10px;
}
#archive ul {
	margin:0px;
	padding:0px;
	margin-top:10px;
}
#archive ul li {
	list-style:none;
	width:150px;
	float:left;
	border-bottom:1px dotted #CCC;
}
ul.archive {
	margin:0px;
	padding:0px;
	margin-top:10px;
}
ul.archive li {
	width:250px;
	list-style:none;
	float:left;
	border-bottom:1px dotted #CCC;
}
ul.archive li a {
	padding:2px 0px;
}

/* ------ Top Content ------ */
#content-top {
	width:690px
	position:relative;
	margin:0px auto;
	text-align:left;
	z-index:10;
	margin-left:25px;
	margin-bottom:50px !important;
	margin-bottom:30px;
}
#welcome {
	width:350px;
	margin-left:10px;
	position:relative;
	margin-top:60px;
	z-index:100;
}
#welcome h2 {
	color:#990000;
}
#welcome p {
	font:12px arial,"trebuchet ms",verdana,arial,sans-serif;
	color:#535353;
	line-height:20px;
	margin-top:4px;
}
#photo-interior {
	position:absolute;
	top:120px;
	right:40px;
	z-index:100;
	background:transparent url("../images/bg_photos_int.gif") no-repeat top left;
	width:317px;
	height:253px;
}
#photo-interior img{
	position:relative;
	top:40px;
	left:26px;
}


/* ------ Content Middle ------ */
#content-middle {
	background:#E1DFF3;
	width:724px;
	text-align:left;
	border-bottom:8px solid #D7D3EF;
	margin:0px auto;
}
#middle {
	margin:0px auto;
	width:700px;
	padding:10px 0px !important;
	padding:5px 0px;
}
#middle h2 {
	margin-left:4px;
	margin-bottom:10px;
	text-transform:uppercase;
}
#middle h2 a {
	background:transparent url("../images/bg_news_icon.gif") no-repeat top left;
	padding-left:18px;
	padding-top:2px;
}
#content-middle ul {
	width:700px;
	margin:0px auto;
	margin-left:4px;
	padding:0px;
}
#content-middle ul li {
	list-style:none;
	float:left;
	width:220px;
	margin-right:10px;
}
.date {
	background:#D7D3EF url("../images/bg_date.gif") no-repeat 3px 4px;
	margin-top:15px;
	padding:3px 0px;
	border:1px solid #C9C6EA;
}
#middle li p {
	color:#4573A5;
	width:180px;
	padding-left:23px;
}

/* ------ Content Bottom ------ */
#content-bottom {
	width:700px;
	margin:0px auto;
	padding:20px 0px;
	position:relative;
	z-index:100;
}
#content-bottom h2 {
	margin-left:5px;
	text-transform:uppercase;
	background:transparent url("../images/bg_picture.gif") no-repeat 0px 1px;
	padding-left:18px;
}

ul.gallery {
	margin:0px;
	padding:0px;
	margin-left:5px;
	margin-top:10px;
	position:relative;
	z-index:1000;
	padding-bottom:10px;
}

ul.gallery li {
	list-style:none;
	float:left;
	margin-right:20px;
	background:none !important;
	padding:0px !important;
	position:relative;
	height:auto !Important;
	height:110px;
	min-height:110px;
}
/*
ul.gallery li img {
	padding:3px;
	border:1px solid #CCC;
	background:#FFF;
}
*/
.img-shadow {
float:left;
background: url("../images/shadowAlpha.png") no-repeat bottom right !important;
background: url("../images/shadow.gif") no-repeat bottom right;
margin: 10px 0 0 10px !important;
margin: 10px 0 0 5px;
position:relative;
}
.img-shadow img {
display: block;
position: relative;
background-color: #fff;
border: 1px solid #a9a9a9;
margin: -5px 5px 5px -5px;
padding: 3px;
}

/* Browse More */
#browse-more {
	margin-top:10px;
	padding-bottom:20px;
}
#browse-more h3 {
	font:14px "Arial Narrow",verdana,arial,sans-serif;
	color:#990000;
	margin-bottom:8px;
}



/* List Items */
ul.browse {
	font:12px/20px "arial narrow",verdana,arial,sans-serif;
	height:auto !important;
	height:20px;
	margin:0px;
	padding:0px;
	width:600px;
}
ul.browse li {
	list-style:none;
	float:left;
	width:270px;
	margin-right:8px;
}
ul.browse li a {
	background:transparent url("../images/bg_page.gif") no-repeat top left;
	padding-left:19px;
	display:block;
	border-bottom:1px solid #CCC;
}

#page-content ul {
	margin:8px 0px;
	padding:0px;
}
#page-content ul li {
	list-style:none;
	display:block;
	background:transparent url("../images/bg_list.gif") no-repeat 0px 3px;
	padding-left:15px;
	margin-bottom:3px;
	font-size:12px;
}

ul.news {
	font:12px/20px "trebuchet ms",verdana,arial,sans-serif;
	height:auto !important;
	height:20px;
	margin:0px;
	padding:0px;
	width:620px;
	margin-bottom:20px;
}
ul.news li {
	list-style:none;
	float:left;
	width:290px;
	margin-right:8px;
}
ul.news li a {
	background:transparent url("../images/bg_newspaper.gif") no-repeat center left;
	padding-left:19px;
	display:block;
}

/* ------ Sitemap ------ */
ul.sitemap {
	margin:0px;
	padding:0px;
	margin-top:15px;
}
ul.sitemap ul {
	margin:0px;
	padding:0px;
}
ul.sitemap li {
	list-style:none;
	font:11px/25px arial,sans-serif;
	display:block;
	height:auto !important;
	height:25px;
	padding:0px !important;
	background:none !important;
}
ul.sitemap li a {
	font:11px/25px arial,sans-serif;
	height:auto !important;
	height:25px;
	background:transparent url("../images/bg_page.gif") no-repeat 0px 3px;
	padding-left:19px;
	display:block;
	text-decoration:none;
	border-bottom:1px solid #CCC;
	font-weight:bold;
	color:#393484;
	text-transform:uppercase;
}
ul.level1 li a {
	background:transparent url("../images/bg_sitemap_l1.gif") no-repeat 14px 3px;
	padding-left:33px;
	font-weight:normal;
	color:#333;
	text-transform:capitalize;
}
ul.level2 li a {
	background:transparent url("../images/bg_sitemap_l2.gif") no-repeat 25px 3px;
	padding-left:43px;
	font-weight:normal;
	color:#666;
	text-transform:capitalize;
}
ul.sitemap a:hover {
	color:#333 !important;
	text-decoration:underline;
}



/* ------- Footer Interior ------- */
#footer-int {
	background:transparent url("../images/bg_interior_bottom.jpg") no-repeat top left;
	width:762px;
	height:125px;
	position:absolute;
	z-index:1;
	bottom:-30px;
	left:0px;
}
#footer-int p {
	position:absolute;
	bottom:-20px;
	left:15px;
}
#footer-int .social {
	position:absolute;
	bottom:-20px;
	right:10px;
}
#footer-int .social a {
	width:32px;
	height:32px;
	display:block;
	float:right;
	margin-left:8px;
}


/* ------ Navigation ------ */
#nav {
	margin-left:72px;
	padding-top:13px;
	position:relative;
	z-index:10000;
}
#nav ul,
#nav-int ul {
	margin:0px;
	padding:0px;
}
#nav li a,
#nav-int li a {
	color:#393283;
	display:block;
	font:12px/30px arial,verdana,arial,verdana,sans-serif;
	height:auto !important;
	height:30px;
	position:relative;
	z-index:10000;
	padding:0px 5px;
}
#nav li a:hover,
#nav-int li a:hover {
	color:#333;
	background:#CAC6EB;
}


/* ------ Javascript Hit ------ */
/* All form elements are within the definition list for this example */
dl {
	font:normal 13px/15px arial,Georgia,verdana,arial,sans-serif;;
    position: relative;
    width: 450px;
}
dt {
    clear: both;
    float:left;
    width: 150px;
    padding: 4px 0 2px 0;
    text-align: left;
}
dd {
    float: left;
    width: 250px;
    margin: 0 0 10px 0;
    padding-left: 6px;
}



/* The hint to Hide and Show */
.hint {
   	display: none;
    position: absolute;
    right: -250px;
    width: 200px;
    margin-top: -4px;
    border: 1px solid #c93;
    padding: 10px 12px;
    /* to fix IE6, I can't just declare a background-color,
    I must do a bg image, too!  So I'm duplicating the pointer.gif
    image, and positioning it so that it doesn't show up
    within the box */
    background: #ffc url("../images/pointer.gif") no-repeat -10px 5px;
	font:11px arial,verdana,sans-serif;
}

/* The pointer image is hadded by using another span */
.hint .hint-pointer {
    position: absolute;
    left: -10px;
    top: 5px;
    width: 10px;
    height: 19px;
    background:transparent url("../images/pointer.gif") left top no-repeat;
}

/* Poll */
#poll {
	position:relative;
	color:#333;
	display:block;
	font:13px Arial,Georgia,verdana,arial,sans-serif;
}
#poll h3 {
	margin-bottom:15px;
}
#poll .radio {
	position:relative;
	top:3px;
}
#poll span {
	position:relative;
	top:-7px;
	padding-left:3px;
}
.poll-line {
	padding:2px 0px;
}
.poll-question {
	margin-bottom:10px;
	
}
#poll-question {
	float:left;
	width:310px;
}
a.discussion {
	display:block;
}

#result-div {
	float:right;
	width:320px;
}

.albums {
	width:85px;
	height:85px;
	float:left;
	margin:10px;
	border:1px solid #CCC;
	position:relative;
}
.albums div.caption {
	font:12px georgia,verdana,sans-serif;
	text-align:center;
	position:absolute !important;
	padding:5px 0px;
	display:block;
	color:#000;
	width:85px !important;
	bottom:0px !important;
}


/* Superfish */
/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:60px;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
	
}

.sf-menu a {
	
	border-left:	1px solid #fff;
	border-top:		1px solid #CFDEFF;
	padding: 		.75em 2em;
	padding-left:8px !important;
	padding-right:8px !important;
	text-decoration:none;
	text-align:center;
	
	
}
.sf-menu a, .sf-menu a:visited  { 
	color:			#13a;
}
.sf-menu li {
	background:		none;
}
.sf-menu li li {
	background:		#CAC6EB;
}
.sf-menu li li li {
	background:		#CAC6EB;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#CAC6EB;
	outline:		0;
}
.sf-menu li li a {
	text-align:left !Important;
	color:#000 !Important;
	text-decoration:none;
}
.sf-menu li li a:hover {
	background:#00539A !Important;
	color:#FFF !Important;
	text-decoration:none !important;
}


/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}

/* Search */
#search {
	position:absolute;
	z-index:100;
	width:200px;
	right:40px;
	top:90px;
}
.imgsearch {
	top:3px;
	position:relative;
}
.search-result {
	border-bottom:1px solid #E0DFF1;
	padding-bottom:10px;
	margin-bottom:15px;
}
.search-result h3{
	font-size:15px;
}
p.search-content {
	margin-bottom:0px !important;
}
p.search-url {
	font-size:11px !important;
	margin:0px !Important;
	padding:0px !important;
	color:#127F4F !important;
}

p.welcometext {
	font-size:13px !important;
	top:30px;
}

#home-lang {
	position:absolute;
	right:50px;
	top:120px;
	z-index:1000;
}

ul.founder li {
	width:170px;
	float:left;
	margin:10px;
	height:auto !important;
	height:300px;
	min-height:300px;
	background:none !important;
	padding:0px !Important;
}
ul.founder li img {
	padding:4px;
	background:#FFF;
	border:1px solid #CCC;
	margin-bottom:10px;
}
ul.founder li div {
	text-align:center;
	font:14px arial,verdana,sans-serif;
}


/* Form Details */
.form-item {
	padding:4px 0px;
	border-bottom:1px solid #CCC;
}
.form-item label {
	width:80px;
	float:left;
}
.noborder {
	border:0px !important;
}

#details p, #details label {
	color:#333;
}

.loading-info p {
	padding:4px 0px;
	font-weight:bold;
	color:#990000;
	text-align:center;
	margin-bottom:8px;
	background:#D7D3EF;
	border-top:1px solid #C9C6EA;
	border-bottom:1px solid #C9C6EA;
}
textarea {
	font-size:12px;
	padding:4px;
}

#others {
	width:680px;
	margin:0px auto;
	padding:0px;
	background:#EFEEF6;
	position:relative;
	top:-35px;
}
.thelinks {
	background:#E1DFF3;
}
.thelinks-content {
	width:95%;
	margin:5px auto;
	padding:10px 0px;
}
.thelinks h3 {
	color:#990000 !important;
	font:bold 17px arial,verdana,sans-serif;
}
.thelinks p {
	font-size:14px;
}
.thelinks a.thelinks-source {
	float:left;
	width:105px;
}
.thelinks .source-link {
	width:300px;
	float:left;
	margin-right:10px;
}
.last-link {
	margin-right:0px !important;
	text-align:center;
}

.social {
	margin-left:10px;
	display:block;
}
.social a {
	margin-right:5px;
}