@charset "UTF-8";
/* CSS Document */


/*************** BURHAN ************************/


body				{ font-family:Helvetica; font-size:11px; color:333333; 	margin-left:0px; margin-top:0px; background:#4098bc url(../images/background.jpg) repeat-x;	}

td					{ font-family:Helvetica; font-size:11px; color:333333;	}

/*Optional for Delicious #pagination{text-align:center;clear:both;margin:0 0 .5em 0;padding:2.5em 0 1em 0;border-top:1px solid #DDD;}*/
#pagination{clear:both;margin:0 0 .5em 30px;padding:2.5em 0 1em 0; font-size:14px;}
#pagination a{border:1px solid #999;text-decoration:none;background:white;color:#0066CC}
#pagination a:hover{background:#3774D0;color:white;}
#pagination a,#pagination span{padding:0.3em 0.5em;}
#pagination a.pn{border:1px solid #fff;}
#pagination a.pn b{font-weight:normal;}
#pagination a.pn:hover{border:1px solid #999;}
#pagination p{color:#999;}

.commentbox{
background-color: #ececec;
width: 450px;
padding: 10px;
}

.commentfooter{
background: url(../images/arrow.gif) 20px 0 no-repeat; /*20px 0 equals horizontal and vertical position of arrow. Adjust as desired (ie: 20px -5px).*/
padding-left: 58px;
padding-top: 1px;
margin-bottom: 2em;
font-size: 90%;
color: #4A4A4A;
}

td					{ font-family:Helvetica; font-size:11px; color:333333; text-align:justify;	}

.login-input {
border:1px solid #999999;
color:#999999;
font-size:10px;
width:100px;
}

h1					{	font-size:20px; font-weight:normal; text-transform:uppercase;	color:#000000;	}
h2					{	font-size:16px; font-weight:bold; text-transform:uppercase;	color:#2375bc;	}
h3					{	font-size:14px; font-weight:bold; text-transform:uppercase;	color:#000000;	}




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


#padding-10			{	padding:5px 10px;	}
#padding-15			{	padding:5px 15px;	}
#padding-20			{	padding:5px 20px;	}

#main-menu-background	{	background:url(../images/main-menu-bg.jpg) repeat-x; vertical-align:middle;	}

#mini-table-top		{	background:url(../images/mini-tbl-top.png) no-repeat bottom left; display:block; width:182px; height:8px; line-height:8px;	}
#mini-table-bottom	{	background:url(../images/mini-tbl-bottom.png) no-repeat top left; display:block; width:182px; height:9px; line-height:9px;	}
#mini-table-bg		{	background: url(../images/mini-tbl-bg.png) no-repeat top left; padding:8px 10px; 	}

#big-table-top		{	background:url(../images/big-tbl-top.png) no-repeat top left; display:block; width:544px; height:8px; line-height:8px;	}
#big-table-bottom	{	background:url(../images/big-tbl-bottom.png) no-repeat top left; display:block; width:544px; height:9px; line-height:9px;	}
#big-table-bg		{	background: url(../images/big-tbl-bg.png) no-repeat top left; padding:8px 10px; 	}


#calendar-td-1		{	background-color:#e8f3f7; text-transform:uppercase;	padding:5px 10px; font-weight:bold;	}
#calendar-td-2		{	background-color:#d3eaf4; text-transform:uppercase;	padding:5px 10px; font-weight:bold;	}


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

.bold				{	font-weight:bold;	}
.italic				{	font-style:italic;	}
.bold-italic		{	font-weight:bold; font-style:italic;	}

.calendar-date		{	color:#929292; }
.calendar-title		{	color:#155c93; }

#weather {font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
        font-size: 14px;
        margin-top: .5em; color: #666; }
/*******************************************************************************************************************/

a:link, a:visited	{	color:#155c93;	text-decoration:none;	}
a:hover, a:active	{	color:#000000;	}

a.main-menu:link, a.main-menu:visited	{	color:#999999; font-size:11px;	text-decoration:none; font-weight:bold; padding:0px 20px; text-transform:uppercase;	}
a.main-menu:hover, a.main-menu:active	{	color:#FFFFFF;	}

a.side-menu:link, a.side-menu:visited	{	color:#999999; text-decoration:none; font-weight:bold; padding:2px 10px; text-transform:uppercase; border-left:#eeeeee 3px solid; display:block;	}
a.side-menu:hover, a.side-menu:active	{	color:#000000; border-left:#FF9900 3px solid;	}

a.calendar-title:link, a.calendar-title:visited	{	color:#155c93; font-size:11px;	text-decoration:none; 	}
a.calendar-title:hover, a.calendar-title:active	{	color:#000000;	}


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

.stepcarousel{
position: relative; /*leave this value alone*/
border: 0px solid black;
overflow: scroll; /*leave this value alone*/
width: 500px; /*Width of Carousel Viewer itself*/
height: 180px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 10px; /*margin around each panel*/
width: 500px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}
 
div.belt div.panel div#padding-20 img{
padding-left:10px;
 } 
/****************************** END OF BURHAN WORK*********************************************/

a.read-more:hover, a.read-more:active {
background-color:#762328;
color:#FFFFFF;
}
style_common.css 
a.read-more:link, a.read-more:visited {
background-color:#202020;
color:#FFFFFF;
font-weight:bold;
padding:3px 10px;
text-decoration:none;
width:30px;
}

.title {
color:#762328;
font-size:14px;
}

#content-images img {
padding-bottom:5px;
padding-right:10px;
}
.imgfirst {
float:left;
}


.clear {

clear:both;
}

table.calendar td {
	padding: 2x;
	
}

table.calendar a.calendarlinks		{	color:#D7D4DB; background-color:#2375BC;	font-weight:bold; padding:2px;  display:inline; text-decoration:none; 	}


table.calendar a.calendarlinks:hover 	{	color:#FFFFFF; background-color:#E8D113; 	}

#calendar-details	{
		display:block;
		float:right;
		width:200px;
		padding:15px;
		background-color:#EEEEEE;
		border-left:#CCCCCC 1px solid;
		margin-left:10px;
		}

/******** START ENU ITEM *********************/
.urbangreymenu{
width: 190px; /*width of menu*/
}

.urbangreymenu a {

width:160px;
}

.urbangreymenu a.headerbar:link, a.headerbar:visited{
font: bold 13px Verdana;
color: white;
background: #606060 url(../images/arrowstop.gif) no-repeat 8px 6px; /*last 2 values are the x and y coordinates of bullet image*/
text-transform: uppercase;
padding: 7px 0 0px 31px; /*31px is left indentation of header text*/
margin-bottom: 2px; /*bottom spacing between header and rest of content*/
display:block;
text-decoration:none;
}



.urbangreymenu a.headerbar:hover, a.headerbar:active{
font: bold 13px Verdana;
color: white;
background: #000000 url(../images/arrowstop.gif) no-repeat 8px 6px; /*last 2 values are the x and y coordinates of bullet image*/
margin-bottom: 2px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 7px 0 0px 31px; /*31px is left indentation of header text*/
}


.urbangreymenu ul{
list-style-type: none;
margin: 0px;
padding: 0px;
margin-bottom: 0px; /*bottom spacing between each UL and rest of content*/
}

.urbangreymenu ul li{
padding-bottom: 0px; /*bottom spacing between menu items*/
margin-bottom:0px;
margin:0px;
width:160px;

}

.urbangreymenu ul li a{
font: normal 12px Arial;
color: black;
background: #E9E9E9;
display: block;
padding: 5px 0;
line-height: 17px;
padding-left: 8px; /*link text is indented 8px*/
text-decoration: none;
margin-bottom:2px;
}

.urbangreymenu ul li a:visited{
color: black;
}

.urbangreymenu ul li a:hover{ /*hover state CSS*/
color: white;
background: black;
}

.urbangreymenu ul li a:active{ /*hover state CSS*/
color: white;
background: black;
}

a.urbangreymenu:link, a.urbangreymenu:visited{
font: bold 13px Verdana;
color: white;
background: #606060; /*last 2 values are the x and y coordinates of bullet image*/
display:block;
margin-bottom: 2px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 7px 0 0px 31px; /*31px is left indentation of header text*/
text-decoration:none;
}

a.urbangreymenu:hover, a.urbangreymenu:active{
font: bold 13px Verdana;
color: white;
background: #000000; /*last 2 values are the x and y coordinates of bullet image*/
display:block;
margin-bottom: 0px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 7px 0 0px 31px; /*31px is left indentation of header text*/
}
/********** END MAIN MENU **************/



/* added by khaled 17-05-2008 */

.cssform p{
width: 550px;
clear: left;
margin: 0;
padding: 5px 0 8px 0;





/* border-top: 1px dashed gray; */

}

.cssform p.small {
width: 100%;
clear: left;
margin: 0;
padding: 5px 0 -5px 0;

}

.cssform label.small {

width: 100px;

}
.cssform label{




font-weight: bold;

 /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column () to create some right margin*/


/* newly added by khaled */
font: 11px Tahoma, Geneva, Arial, Helvetica, sans-serif;
 color: #444444;
 background-color: transparent;

}

.cssform label em{
margin-top:-10px;
}



.cssform label em img{
vertical-align: text-top;

}


.cssform p{


padding-left: 155px;//width of left column containing the label elements



/* border-top: 1px dashed gray; */

}

.cssform p.small {


padding-left: 105px;//width of left column containing the label elements



/* border-top: 1px dashed gray; */

}

.submitbutton {
margin-left:155px;
cursor:pointer;
border:outset 1px #ccc;
background:#999;
color:#666;
font-weight:bold;
padding: 1px 2px;
background:url(media/formbg.gif) repeat-x left top;
}

p.errors {

font-size:16px;
color:#990000;
text-decoration:underline;
font-weight:bold;
}

.submitbuttonsmall {

margin-left:100px;
cursor:pointer;
border:outset 1px #ccc;
background:#999;
color:#666;
font-weight:bold;
padding: 1px 2px;
background:url(media/formbg.gif) repeat-x left top;
}

.cssform label{

float: left; margin-left: -155px;


}


.cssform label.small {

float: left; margin-left: -105px;


}

.cssform label em{
float:right;
margin-right: 1px;
}


.text{ /*width of text boxes. IE6 does not understand this attribute*/
width: 145px;
/* newly added by khaled */
background-color: #FFFFFF;
color: #000000;
border:#999999 1px solid;
}

.cssform textarea{
width: 250px;
height: 150px;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

.cssform fieldset {

border:1px solid #762328;
}

.cssform legend  {

 padding: 0.2em 0.5em;
  border:1px solid #F5F5F5;
  color:#CFA245;
  font-size:120%;
  font-family: Tahoma;
  
}


#mytable table {
 font-size:0.9em;
 font-family: Arial, Helvetica, verdana sans-serif;
 background-color:#fff;
 border-collapse: collapse;
 width: 100%;
 overflow:auto;
}
#mytable caption {
 font-size: 25px;
 color: #1ba6b2;
 font-weight: bold;
 background: url(header_bg.jpg) no-repeat top left;
 padding: 10px;
 margin-bottom: 2px;
}
#mytable thead th {
 border-right: 1px solid #fff;
 color:#fff;
 text-align:center;
 padding:2px;
 text-transform:uppercase;
 height:25px;
 background-color: #AAAAAA;
 font-weight: normal;
}
#mytable tfoot {
 color:#1ba6b2;
 padding:2px;
 text-transform:uppercase;
 font-size:1.2em; 
 font-weigth: bold;
 margin-top:6px;
 border-top: 6px solid #e9f7f6;
}
#mytable tbody tr {
 background-color:#fff;
 border-bottom: 1px solid #f0f0f0;
}
#mytable tbody td {
 color:#414141;
 padding:5px;
 
}
#mytable tbody th {

 padding:2px;
}
#mytable tbody td a, #mytable tbody th a {
 color:#006699;
 text-decoration:none;
 font-weight:normal; 
 display:block;
 background: transparent url(links_yellow.gif) no-repeat 0% 50%;
 padding-left:15px;
}
#mytable tbody td a:hover, #mytable tbody th a:hover {
 color:#006699;
 text-decoration:none;
}

#mytable .tableDescr {
	/* font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #AAAA55;
	text-align: right;
	vertical-align: middle;
	font-weight: normal; */
}

#mytable .odd {
background-color:#E4D4B1;



}

#mytable img {
display:block;
    margin-left: auto;
    margin-right: auto;
			}

#mytable .descrOverflow {
	/* text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	width: 250px; */
}


/* HINT BOX */

.hint {
   	display: none;
    position: absolute;
    margin: 30px;
    width: 100px;
    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;
}

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


#publications-table td {
background-color:#E6E3D2;
padding:10px;
}
/* -------------------- */
/* END OF THUMBS 				*/
/* -------------------- */

div.thumb {
margin: 10px;
border: 1px solid #A0ACC0;
height: auto;
text-align: center;
}	
.thumb img{
display: inline;
margin: 5px;
border: 1px solid #A0ACC0;
}
.thumb a:hover img {border: 1px solid black;}
.photocattitle {text-align: center; font-weight: bold;}
.phototitle {
text-align: center;
font-weight: normal;
width: 99px;
margin: 0 3px 3px 3px;
}


#upload{
	margin:30px 200px; padding:15px;
	font-weight:bold; font-size:1.3em;
	font-family:Arial, Helvetica, sans-serif;
	text-align:center;
	background:#f2f2f2;
	color:#3366cc;
	border:1px solid #ccc;
	width:150px;
	cursor:pointer !important;
	-moz-border-radius:5px; -webkit-border-radius:5px;
}
.darkbg{
	background:#ddd !important;
}
#status{
	font-family:Arial; padding:5px;
}
ul#files{ list-style:none; padding:0; margin:0; }
ul#files li{ padding:10px; margin-bottom:2px; width:200px; float:left; margin-right:10px;}
ul#files li img{ max-width:180px; max-height:150px; }
.success{ background:#99f099; border:1px solid #339933; }
.error{ background:#f0c6c3; border:1px solid #cc6622; }

/* -------------------- */
/* END OF THUMBS 				*/
/* -------------------- */


/* SEXY BOX ************/

.img_container {
height:130px;
}
.img_container ul {
display:block;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
}

.img_container ul li {
float:left;
margin:10px;
width:100px;
}

/* END OF SEXY BOX **************************************/


/* GALLERY CSS ****************************************/

.credits {
	width: 280px;
	margin: 0 auto 20px;
	text-align: center;
	border-bottom: solid 1px #ccc;
	padding: 0 0 8px 0;
	font: 130%/110% Garamond, Georgia, serif;
}
.credits em {
	color: #999;
}
.credits a {
	color: #333;
	text-decoration: none;
	text-transform: uppercase;
}
.credits a:hover {
	text-decoration: underline;
}
img {
	border: none;
}
 
 /* added by Khaled FEATURED ATTRACTIONS ON HOMEPAGE */
 
 .featuredimg {

/* This centers the image */
display: block;
margin-left: auto;
margin-right: auto;

/* This adds the border */
padding:8px;
border:solid;
border-color: #dddddd #aaaaaa #aaaaaa #dddddd;
border-width: 1px 2px 2px 1px;
background-color:white;
}
 
/* ---------- gallery styles start here ----------------------- */
/* ---------- gallery styles start here ----------------------- */
/* ---------- gallery styles start here ----------------------- */
.gallery {
	list-style: none;
	margin: 0;
	padding: 0;
}
.gallery li {
	margin: 10px;
	padding: 0;
	float: left;
	position: relative;
	width: 212px;
	height: 175px;
}
 
.gallery a {
	text-decoration: none;
	
	color: #999;
}
.gallery a:hover {
	color: #000;
	text-decoration: underline;
}
.gallery img {
	border: none;
	padding: 14px 12px 12px 50px;
}
.gallery em {
	width: 193px;
	height: 25px;
	display: block;
	position: absolute;
	top: 2px;
	left: 2px;
	background: url(../images/watercolor-mask.png) no-repeat;
	text-align: center;
	font: italic 100%/100% Georgia, "Times New Roman", Times, serif;
	padding-top: 140px;
}


/* the GALLERY FOR THE MEMBERS */
.themembergallery {
	list-style: none;
	margin: 0;
	padding: 0;
}
.themembergallery li {
	padding: 10px;
	margin: 0;
	float: left;
	position: relative;
	width: 150px;
	height: 130px;
}
.themembergallery img {
	background: #fff;
	border: solid 1px #ccc;
	padding: 5px;
}
.themembergallery li:hover img {
	border-color: #999;
}
.themembergallery em {
	width: 102px;
	background: url(../images/bubble.gif) no-repeat;
	padding: 3px 0 6px;
	display: none;
	position: absolute;
	top: -2px;
	left: 50px;
	font-style: normal;
	text-align: left;
}
.themembergallery a {
	text-decoration: none;
	color: #000;
}
.themembergallery a:hover em {
	display: block;
}

dt { font-weight:bold; }
/**************************************************************/