/* CSS for Mustafov.com */ 
html, body{ 
 margin:0; 
 padding:0; 
 background: url(images/bg.jpg) white 0 0 repeat-x;
 min-height:660px;
 height:100%; } 
 
#pagewidth{ 
 background: url(images/headerbg.jpg) transparent 0 0 repeat-x;  
 width:900px;
 height: 100%; 
 height: 20px; } 

#wrapper  {
 width:900px;
 height: 100%;
 font: normal 12px Arial, Helvetica, sans-serif;
 color:#333333;}
 
#wrapper p {
	margin: 0;
	line-height: 1.2;
	padding-bottom: 7px;}
	
#twocols{
 width:900px; 
 float:left; 
 position:relative; 
 display: inline;
 clear: both;
 margin-top: 19px;
 background: url(images/bodybg.jpg) 0 0 white repeat-y;}

#leftcol{
 width:470px; 
 float:left; 
 clear:left;
 position:relative; 
 margin-top: 15px;
 display: inline; }
 
#rightcol{
 width:420px; 
 height: 100%;
 float:right; 
 clear:right;
 position:relative;
 text-align: left; }
 
#footer_images {
 height:120px; 
 width:900px;
 background:url(images/btm_images.jpg) transparent 0 0 no-repeat; 
 float: left;
 top: -15px;
 position: relative;
 padding-bottom: 0px; }
 
#footer {
 position: relative;
 height:80px; 
 width: 900px;
 float: left;
 background:url(images/ftrbg.jpg) #E3E3E3 repeat-x; } 

.footer {
 font: normal 11px Arial, Helvetica, sans-serif;
 color:black;
 text-align: center;}

#footer p {margin:0; padding:0;} 
#footer .footer {padding-top: 20px;}
 
/* BEGIN HYPERLINKS
---------------------------- */
a, a:link,
a:visited {
	color: #98293a;
	border: none;
	text-decoration: none;}

a:hover {
	text-decoration: underline;
	color:#cc0000;}

a:focus, a:active, 
 a img, a:focus img, a:hover img {
	outline: none;
	text-decoration: underline;}
 
/* -- Left column -- */
#leftcontent {
	position: relative;
	display: inline;
	clear: both;
	float: left;
	width: 470px;
	height:100%;}

.Lcontent {
	position: relative;
	margin: 0;
	float: left;
	clear: left;
	width: 240px;}
	
.Rcontent {
	position: relative;
	margin: 0;
	display: block;
	float: right;
	clear: right;
	width: 228px;
	height: 420px;}

#leftcontent img.right {
	padding-right: 5px;
	float:right;}
	
#leftcontent img.left {
	padding-left: 4px;
	float: left;} 

/* -- Main menu -- */
ul#leftmenu {
	position: relative;
	display: block;
	margin: 0;
	float: right;
	width: 210px;
	height:168px;} 
	
.Rcontent ul#leftmenu {
	position: relative;
	padding-top: 170px;
	margin:0;}
	
ul#leftmenu li {	
	display: block;
	float: right;
	clear: right;
	height: 24px;
	width: 200px;
	list-style: none;
	margin: 0;	
	padding: 0;}
	
* html ul#leftmenu li a {
	height: 24px;
	line-height: 100%;
	overflow: hidden;}

ul#leftmenu li a {
	background-position: 0 0;
	background-repeat: no-repeat;
	display: block;
 	height: 24px;
	overflow: hidden;
	padding: 0;
	width: 200px; }
	
ul#leftmenu li#btn1 {background: url(images/btn1_welcome.gif) no-repeat 0 0;}
ul#leftmenu li#btn2 {background: url(images/btn2_about.gif) no-repeat 0 0;}
ul#leftmenu li#btn3 {background: url(images/btn3_publications.gif) no-repeat 0 0;}
ul#leftmenu li#btn4 {background: url(images/btn4_ccicbr.gif) no-repeat 0 0;}
ul#leftmenu li#btn5 {background: url(images/btn5_awards.gif) no-repeat 0 0;}
ul#leftmenu li#btn6 {background: url(images/btn6_gallery.gif) no-repeat 0 0;}
ul#leftmenu li#btn7 {background: url(images/btn7_contacts.gif) no-repeat 0 0;}

ul#leftmenu li#btn1 a {background-image:url(images/btn1_welcome.gif);}
ul#leftmenu li#btn2 a {background-image: url(images/btn2_about.gif);}
ul#leftmenu li#btn3 a {background-image: url(images/btn3_publications.gif);}
ul#leftmenu li#btn4 a {background-image: url(images/btn4_ccicbr.gif);}
ul#leftmenu li#btn5 a {background-image: url(images/btn5_awards.gif);}
ul#leftmenu li#btn6 a {background-image: url(images/btn6_gallery.gif);}
ul#leftmenu li#btn7 a {background-image: url(images/btn7_contacts.gif);}

ul#leftmenu li a:hover, ul#leftmenu li a:active, ul#leftmenu li a:focus,
ul#leftmenu li a.current {background-position: -200px 0;}

/* -- Right column -- */
#rightcol .rightcontent {padding: 10px 20px;}

.rightcontent {
	float: left;
	position: relative;
	margin: 0;
	text-align: left;
	width:380px;}
	
.date {
	position: relative;
	float: right;
	clear: right;
	width: auto;
	border-left: 1px solid #cccccc;
	font-size: 11px; 
	text-align:right;
	color: #000;}	
#rightcol .date {padding:15px 20px 5px 5px;}
		
#rightcol img {
	margin: 0 auto;
	padding: 20px 0 20px 15px;	
	float: left;}
		
		
 /* *** Float containers fix:
 http://www.csscreator.com/attributes/containedfloat.php *** */ 
.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  


 
 /*printer styles*/ 
 @media print{ 
/*hide the left column when printing*/ 
#leftcol{display:none;} 

/*hide the right column when printing*/ 
#rightcol{display:none;} 
#twocols, #maincol{width:100%; float:none;}
}