/******************************************************
	Title:    Kamenitza
	Author:   Martin Metodiev
	Company:  Mag Studio
	Updated:  21/05/2009
	Style:    MUSIC FAN Stylesheet
******************************************************/



/******************************************************
	LIST OF CONTENTS

		Global styles:		:	Common


		Layout:				:	Body
							:	Header
							:	Footer


		Layout elements:	:	Top line
							:	Logo
							:	Mag Studio


		Navigation:			:	Main menu


		Page elements:		:	Gallery list
							:	Photo & Video Elements
							:	Comments


		Inner Pages:		:	Home
							:	News and events
							:	Stars list
							:	Stars article
							:	Videos
							:	Photos

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





/* ************************ GLOBAL STYLES */

/* .................... Common */
	div.main div.main_top_holder ul.gallery_list:after,
	div.main div.main_top_holder div.slider:after,
	form#comments_form div.security:after,
	div.main div.main_top_holder div.comment_form_box:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}
/* ........................... */





/* ******************************* LAYOUT */

/* ...................... Body */
	body {
		background: #182f1b url(../images/site_images/backgrounds/bgr_page_musicfan.png) center top repeat-x;
	}
/* ........................... */


/* .................... Header */
	div#header {
		background: url(../images/site_images/backgrounds/musicfan_bgr_page_header.jpg) center top no-repeat;
	}
/* ........................... */


/* ................... Sidebar */
	div#sidebar div.music_banner {
		padding-bottom: 20px;
		background: url(../images/site_images/backgrounds/sidebar_breakline.png) bottom center no-repeat;
	}
/* ........................... */


/* .................... Footer */
	div#footer {
		background: url(../images/site_images/backgrounds/musicfan_bgr_page_footer.png) center bottom no-repeat;
	}
/* ........................... */





/* ********************** LAYOUT ELEMENTS */

/* .................. Top line */
	div.top_line a {
		color: #fbd500;
	}

	div.top_line a.forum {
		border-right: 1px solid #fbd500;
	}
/* ........................... */


/* ...................... Logo */
	div.musicfan_logo {
		width: 19.3em; /*193px*/
		height: 12em; /*120px*/
		margin: 10px 0px 0px 3px;
	}

			div.musicfan_logo a img {
        display: block;
				width: auto;
        height: 100%;
        margin: 0 auto;
			}
/* ........................... */


/* ................ Mag Studio */
	div#footer div.magstudio {
		background: none;
	}
/* ........................... */





/* *************************** NAVIGATION */

/* ................. Main menu */
	div.main_menu ul li a.active,
		div.main_menu ul li a:hover {
			background: url(../images/site_images/backgrounds/musicfan_menu_item_left.gif) left top no-repeat;
		}

		div.main_menu ul li a.active span,
			div.main_menu ul li a:hover span {
				background: url(../images/site_images/backgrounds/musicfan_menu_item_right.gif) right top no-repeat;
			}
/* ........................... */





/* ************************ PAGE ELEMENTS */

/* .............. Gallery list */
	div.main div.main_top_holder ul.gallery_list,
		div.main div.main_top_holder ul.gallery_list li {
			list-style: none;
			margin: 0px;
			padding: 0px;
		}

	div.main div.main_top_holder ul.gallery_list {
		margin: 0px -11px;
		padding: 0px 11px;
	}

		div.main div.main_top_holder ul.gallery_list li {
			float: left;
			width: 25.45em; /*280px*/
			margin: 0px 16px 10px 0px;
		}

			div.main div.main_top_holder ul.gallery_list li div {
				width: 10em; /*110px*/
				height: 8.64em; /*95px*/
				float: left;
			}

				div.main div.main_top_holder ul.gallery_list li div a {
					display: block;
					width: 9.91em; /*109px*/
					height: 8.55em; /*94px*/
					background: url(../images/site_images/backgrounds/gallery_border.png) left top no-repeat;
					padding: 1px 0px 0px 1px;
				}

					div.main div.main_top_holder ul.gallery_list li div a:hover {
						background-position: -115px top;
					}

					div.main div.main_top_holder ul.gallery_list li div a img {
						width: 103px;
						height: 78px;
						border: 0px;
					}

			div.main div.main_top_holder ul.gallery_list li h3 {
				float: left;
				margin: 0px 0px 0px 5px;
				padding-bottom: 0px;
				width: 14em; /*154px*/
			}

				div.main div.main_top_holder ul.gallery_list li h3 a {
					color: #9aba7e;
					text-decoration: none;
				}

					div.main div.main_top_holder ul.gallery_list li h3 a:hover {
						text-decoration: underline;
					}

			div.main div.main_top_holder ul.gallery_list li span {
				color: #b8c1b0;
				font-size: 0.91em; /*10px*/
				margin-left: 3px;
				line-height: 1.4em; /*14px*/
			}
/* ........................... */


/* .... Photo & Video Elements */
	div.main_header a.anchor {
		visibility: hidden;
		height: 0px;
		width: 0px;
		font-size: 0pt;
		text-decoration: none;
	}

	div.main div.main_top_holder div.item_info {
		margin: 0px 2px;
	}

		div.main div.main_top_holder div.item_info span.date {
			display: block;
		}

		div.main div.main_top_holder div.item_info h3 {
			margin: 0px;
		}

	div.main div.main_top_holder div.slider {
		margin: 10px auto 0px;
		width: 53.18em; /*585px*/
		height: 8.64em; /*95px*/
	}

		div.main div.main_top_holder div.slider a.slide {
			float: left;
			width: 4.091em; /*45px*/
			height: 4.55em; /*50px*/;
			background-image: url(../images/site_images/backgrounds/slider_btns.gif);
			background-repeat: no-repeat;
			margin-top: 15px;
		}

		div.main div.main_top_holder div.slider a.prev {
			background-position: left top;
		}

			div.main div.main_top_holder div.slider a.prev:hover {
				background-position: left bottom;
			}

		div.main div.main_top_holder div.slider a.next {
			background-position: right top;
		}

			div.main div.main_top_holder div.slider a.next:hover {
				background-position: right bottom;
			}

		div.main div.main_top_holder div.slider div {
			width: 472px;
			height: 8.64em; /*95px*/
			overflow: hidden;
			float: left;
			margin: 0px 12px 0px 10px;
			position: relative;
		}

			div.main div.main_top_holder div.slider div ul,
				div.main div.main_top_holder div.slider div ul li {
					list-style: none;
					margin: 0px;
					padding: 0px;
				}

			div.main div.main_top_holder div.slider div ul {
				width: 909.09em; /*10000px*/
				height: 8.64em; /*95px*/
				position: relative;
			}

				div.main div.main_top_holder div.slider div ul li {
					width: 118px;
					height: 100%; /*95px*/
					float: left;
					text-align: center;
					background: url(../images/site_images/backgrounds/gallery_border.png) 6px top no-repeat;
					padding-top: 1px;
				}

				div.main div.main_top_holder div.slider div ul li.active,
				div.main div.main_top_holder div.slider div ul li:hover {
					background-position: -109px top;
				}

					div.main div.main_top_holder div.slider div ul li img {
						width: 103px;
						height: 78px;
						border: 0px;
						display: inline;
					}
/* ........................... */


/* .................. Comments */
		div.main_header div.main_header_holder h2 span.comments_count {
			font-weight: normal;
		}

	div.main div.main_top_holder ol.comments,
		div.main div.main_top_holder ol.comments li {
			list-style: none;
			margin: 0px;
			padding: 0px;
		}

	div.main div.main_top_holder ol.comments {
		margin-top: -20px;
	}

		div.main div.main_top_holder ol.comments li {
			background-image: url(../images/site_images/backgrounds/hr_line.gif);
			background-position: bottom center;
			background-repeat: repeat-x;
			margin: 0px -11px;
			padding: 10px 11px 0px;
		}

		div.main div.main_top_holder ol.comments li.even {
			background-color: #1C3621;
		}

			div.main div.main_top_holder ol.comments li span.info {
				display: block;
				font-size: 0.82em; /*9px*/
				color: #b8c1b0;
				margin-bottom: 10px;
			}

				div.main div.main_top_holder ol.comments li span.info strong {
					font: bold 1.22em Tahoma, Geneva, sans-serif; /*11px*/
					color: #fbd500;
				}

	div.main div.main_top_holder div.comment_form_box {
		padding-top: 2px;
		clear: both;
		margin: 0px -11px;
	}

		div.main div.main_top_holder div.comment_form_box div.border {
			background: url(../images/site_images/backgrounds/hr_line.gif) center top repeat-x;
			margin-top: 10px;
			padding: 10px 11px 0px;
		}

			form#comments_form {
				width: 36.36em; /*400px*/
				margin: 0px auto;
			}

						form#comments_form div.textfield div input.textfield {
							width: 35.18em; /*387px*/
						}

				form#comments_form div.textarea {
					background: url(../images/site_images/backgrounds/textarea_line.png) center top repeat-y;
				}

					form#comments_form div.textarea div {
						background: url(../images/site_images/backgrounds/textarea_top.png) center top no-repeat;
					}

						form#comments_form div.textarea div div {
							background: url(../images/site_images/backgrounds/textarea_bottom.png) center bottom no-repeat;
						}

							form#comments_form div.textarea div div textarea {
								background: none;
								border: 0px;
								font: normal 1em Tahoma, Geneva, sans-serif;
								color: #B8C1B0;
								height: 10.91em; /*120px*/
								padding: 6px;
								width: 35.18em; /*387px*/
							}

				form#comments_form div.textfield,
				form#comments_form div.textarea {
					margin: 10px 0px 15px;
					width: 100%;
				}

				form#comments_form div.security {
					float: left;
					margin-top: 10px;
				}

					form#comments_form div.security img {
						float: left;
						border: 0px;
						width: 60px;
						height: 25px;
						margin-right: 5px;
					}

					form#comments_form div.security div.textfield {
						float: left;
						width: 8.64em; /*95px*/
						margin: 0px;
					}

							form#comments_form div.security div.textfield div input.textfield {
								width: 7.55em; /*83px*/
							}

					form#comments_form div.btn input.btn {
						font-weight: normal;
					}
/* ........................... */





/* ************************** INNER PAGES */

/* ...................... Home */
	div.main_box_header div.main div.music_info_box,
	div.main_box_header div.main div.events_info_box {
		height: 34.55em; /*380px*/
	}

	div.main_header div.main div.music_forum_list {
		min-height: 8.73em; /*96px*/
	}

		div.main_header div.main div.music_forum_list ul,
			div.main_header div.main div.music_forum_list ul li {
				list-style: none;
				margin: 0px;
				padding: 0px;
			}

		div.main_header div.main div.music_forum_list ul {
			float: left;
			width: 24.54em; /*270px*/
			padding-right: 26px;
		}

			div.main_header div.main div.music_forum_list ul li {
				background: url(../images/site_images/icons/list_dot.gif) left 6px no-repeat;
				clear: both;
				float: left;
				margin-bottom: 5px;
				padding-left: 8px;
				width: 23.82em; /*262px*/
			}

				div.main_header div.main div.music_forum_list ul li a {
					color: #9aba7e;
					text-decoration: none;
				}

					div.main_header div.main div.music_forum_list ul li a:hover {
						text-decoration: underline;
					}
/* ........................... */


/* .......... News and events  */
	div.news_or_events {
		margin-bottom: 10px;
	}

	div.news_or_events,
		div.news_or_events div.dropdown_box {
			width: 18.18em; /*200px*/
		}
/* ........................... */


/* ................ Stars list */
	div.main div.main_top_holder ul.stars_list li div h3.news {
		margin-top: 3px;
	}
/* ........................... */


/* ............. Stars article */
	div.star_info {
		float: left;
		width: 26.91em; /*296px*/
	}

		div.star_info dl {

		}

			div.star_info dl dt,
			div.star_info dl dd {
				margin-bottom: 6px;
			}

			div.star_info dl dt {
				padding-right: 3px;
				float: left;

			}

			div.star_info dl dd {
				color: #B8C1B0;
			}
/* ........................... */


/* .................... Videos */
	div.main div.main_top_holder div.video_player {
		margin: 0px auto 10px;
		width: 53.18em; /*585px*/
		height: 43.91em; /*483px*/
	}
/* ........................... */


/* .................... Photos */
	div.main div.main_top_holder div.photo_box {
			margin: 0px auto 10px;
			width: 53.18em; /*585px*/
			height: 40em; /*440px*/
	}

		div.main div.main_top_holder div.photo_box img {
			width: 585px;
			height: 440px;
			border: 0px;
		}
/* ........................... */