Stylesheet for bandscape

elements.css

/* 
     bandscape CSS
     author: Artur Sapek 
*/

html, body{
	height:100%;
	margin:0px;
	overflow:hidden;
	background:#F5F5F6;
	font-family:Arial;
	-webkit-font-smoothing: antialiased;
}
#container{
	width:1200px;
	height:100%;
	margin:0px auto;
}
#header{
	height:62px;
	width:100%;
	background:#FFF;
	position:absolute;
	top:0px;
	z-index:1000;
}
#header a.n, #header a.n:visited{
	font-size:18px;
	font-family:Arial;
	text-decoration:none;
	color:#B2C2E1;
	margin-right:30px;
	position:relative;
	left:-30px;
}
#header .city{
	font-size:18px;
	font-family:Arial;
	text-decoration:none;
	margin-right:30px;
	position:relative;
	left:-30px;
}
#header a.n:hover{
	color:#C8D6ED;
}
#header_shadow{
	height:4px;
	width:100%;
	background:url('/media/img/shadow.png') repeat-x;
	position:absolute;
	top:62px;
	z-index:1001;
}
#header_container{
	width:1200px;
	margin:0px auto;
	height:62px;
	z-index:1000;
}
#logo{
	position:relative;
	left:-45px;
	top:9px;
}
.subheading{
	margin-bottom:7px;
	font-size:18px;
}
/* MAP */

#map_container{
	width:580px;
	height:100%;
	background:#E6E7E8;
	float:left;
	overflow:hidden;
	z-index:1;
}
#map{
	position:relative;
	background:url("/media/img/abstract_map/streets.png");
	z-index:2;
	cursor:all-scroll;
}
#about_container{
	width:1200px;
	background:#FFF;
	height:100%;
}

/* HUB */
#hub_elements{
	margin-top:0px;
}
#hub_elements:after{
	content:url('/media/img/empty150.gif');
	height:150px;
}
#hub_container{
	width:620px;
	height:100%;
	float:right;
	position:relative;
	overflow:hidden;
}
#hub{
	width:620px;
	height:100%;
	margin-top:62px;
	top:0px;
	background:#FFF;
	position:relative;
	overflow-y:scroll;
	overflow-x:hidden;
	padding-right:15px;
}

#filters_container{
	background:rgba(0,0,0,0.15);
	background-repeat:repeat-x;
	height:54px;
	width:620px;
	position:absolute;
	top:62px;
	z-index:2000;
}

/* FOOTER */
#footer_container{
	width:100%;
	height:46px;
	background:#F5F5F6;
	position:absolute;
	bottom:0px;
	z-index:999;
}
#footer{
	width:1200px;
	margin:0px auto;
	cursor:default;
	text-align:center;
}
#footer div{
	display:inline-block;
	margin:16px;
	font-size:12px;
	color:#c1c5c8;
}
#footer div:hover{
	color:#A0A3A5;
}
#footer_shadow{
	height:6px;
	width:1200px;
	background:url('/media/img/shadow bottom.png') repeat-x;
	margin:0px auto;
	position:relative;
	top:-52px;
	z-index:1001;
}

/* VMARKER */

.vm_element{
	position:absolute;
	cursor:pointer;
}
.vm_icon{
	z-index:51;
}
.vm_venuename{
	-webkit-font-smoothing: antialiased;
	font-size:18px;
	border: 0px;
	padding:4px;
	padding-left:4px;
	font-family:Helvetica;
	white-space: nowrap;
	z-index:-5;
	background:rgba(0,0,0,0.75);
	color:#FFF;
	z-index:1002;
}
.vm_hoverarea{
	width:20px;
	height:20px;
	z-index:56;
}
.vm_square{
	width:16px;
	height:16px;
	z-index:49;
}
.vm_arro{
	z-index:50;
}
._vm_Neumos{
	background: rgba(53,54,57,0.8);
}
._vm_NeptuneTheater{
	background: rgba(160,193,171,0.8);
}
._vm_MooreTheater{
	background: rgba(192,105,86,0.8);
}
._vm_LittleRedHen{
	background: rgba(255,255,255,0.8);
}
._vm_CafeRacer{
	background: rgba(111,182,139,0.8);
}
._vm_SeamonsterLounge{
	background:rgba(50,50,50,0.8);
}
._vm_BlueMoonTavern{
	background:rgba(83,160,216,0.8);
}
._vm_QCafe{
	background:rgba(24,108,165,0.8);
}
._vm_ChopSuey{
	background:rgba(140,140,140,0.8);
}
._vm_LucidJazzLounge{
	background:rgba(171,202,143,0.8);
}
._vm_FunHouse{
	background:rgba(60,122,190,0.8);
}
._vm_HighDive{
	background:rgba(167,188,198,0.8);
}
._vm_TractorTavern{
	background:rgba(126,115,106,0.8);
}
._vm_ShowboxattheMarket{
	background:rgba(181,177,166,0.8);
}

/* HUB ELEMENTS */

	/* NEIGHBORHOOD GROUP */
	
.neighborhood_heading{
	font-size:16px;
	padding:6px 2px 2px 20px;
}
.neighborhood_group{
	margin-top:20px;
}

	/* SHOW LISTINGS */
	
.show_listing{
	width:604px;
	border-top:1px solid #D3D3D3;
	padding:6px 8px 5px 8px;
	margin-top:3px;
}
._sl_heading{
	margin-left:10px;
	font-size:20px;
	padding-bottom:8px;
}
._sl_info{
	font-size:12px;
	color:#9B9B9B;
	padding:1px 0px 0px 10px;
}
._sl_price{
	color:#264C21;
	background:#9CD397;
	padding:3px;
	cursor:default;
}
._sl_age{
	color:#A33124;
	background:#EFADA3;
	padding:3px;
	cursor:default;
}
._sl_grey{
	color:#9B9B9B;
}

	/* BATHTUB I MEAN BANDTAB */

.bandtab_all{
	padding-right:6px;
	padding-bottom:2px;
	display:inline-block;
	cursor:default;
}
._bt_clickable:hover .bandtab_bandname{
	background:#f8abc4;
	cursor:pointer;
}
.bandtab_all:hover span._sl_grey{
	color:#d2527b;
}
.bandtab_wrapper{
	float: left; 
	display: inline; 
	white-space:nowrap;
	height:60px;
}
.bandtab_bandname{
	background:#EFEEEE;
	height:60px;
	padding-right:10px;
}
.bandtab_bandnamespan{
	padding: 9px;
	margin-left:5px;
	padding-bottom: 0px;
	font-family: Arial; 
	color: #000;
	font-size: 20px
}
.bandtab_genrespan{
	padding-top: 0px; 
	font-family: Arial; 
	color: #000; 
	font-size: 14px; 
	display: block;
}
.bandtab_album{
	display:inline-block;
	width: 60px;
	height: 60px;
	float:left;
	cursor:pointer;
}
._bt_grey{
	color: #A0A09F;
}

/* BANDFOCUS */

.focus_container{
	width:604px;
	padding:6px 8px 5px 8px;
	margin-top:7px;
	cursor:default;
}
.focus_main{
	padding:14px;
	width:576px;
	background:#EFEEEE;
	height:100px;
	position:relative;
}
#focus_peers, #focus_upcoming{
	margin:26px 14px 14px 14px;
	width:576px;
	position:relative;
	border-bottom:1px solid #D3D3D3;
	padding-bottom:6px;
}
.focus_bandname, .focus_venuename{
	font-size:26px;
}
.focus_cover{
	width:100px;
	height:100px;
	float:left;
}
.focus_vicon{
	position:absolute;
	top:20px;
	left:20px;
}
.focus_subhead{
	font-size:14px;
	display:block;
}
.focus_address{
	font-size:12px;
	color:#414141;
	margin-top:2px;
	display:block;	
	cursor:pointer;
}
.focus_address:hover{
	color:#000;
}

.focus_address:hover:after{
	content:' - get directions';
	background:none;
}
.focus_listen{
	position:absolute;
	right:12px;
	top:20px;
}
.focus_info{
	position:absolute;
}
.focus_listento{
	font-size:12px;
}
.focus_listenlink{
	position:relative;
	top:5px;
	font-size:14px;
	padding:3px;

	color:#FFF;
	text-decoration:none;
}
._ll_bandcamp{
	background:#6696A7;
}
._ll_bandcamp:hover{
	background:#7BADBA;
}
._ll_reverbnation{
	background:#414042;
}
._ll_reverbnation:hover{
	background:#515151;
}
._ll_facebook{
	background:#3C589D;
}
._ll_facebook:hover{
	background:#4A69A5;
}
._ll_lastfm{
	background:#CC323D;
}
._ll_lastfm:hover{
	background:#D84154;
}
._ll_soundcloud{
	background:#F15D27;
}
._ll_soundcloud:hover{
	background:#F37028;
}
._ll_myspace{
	background:#1E1B1C;
}
._ll_myspace:hover{
	background:#3D393A;
}
._bf_dark{
	color:#303030;
}
._bf_grey{
	color:#8C8C8C;
}


/* ABOUT PAGE */

#about{
	margin-top:62px;
}
#aboutShadow{
	height:6px;
	width:1200px;
	margin:0px auto;
	background:rgba(0,0,0,0.04);
	position:absolute;
	top:62px;
	z-index:1001;
}
#aboutimg{
	position:absolute;
	z-index:800;
}
#mission{
	font-size:20px;
	position:absolute;
	top:470px;
	padding-left:100px;
	width:1000px;
	line-height:1.5;
	cursor:default;
}
.arturbeskutz{
	font-size:16px;
	display:inline-block;
	white-space:nowrap;
	padding-right:20px;
}
.arturbeskutz span{
	font-size:12px;
	position:relative;
	top:-8px;
}
.arturbeskutz a, .arturbeskutz a:visited{
	color:#000;
	text-decoration:none;
	padding:5px;
}
.arturbeskutz a:hover{
	color:#303030;
}
.arturbeskutz a span, .arturbeskutz a:visited span{
	color:#8FA2CC;
	padding:5px;
}
.arturbeskutz a:hover span{
	color:#ADBEDB;
}

/* YOU WANT YOUR SIDE, MR. SWAG? */

/* TIME CONTROL */
.timeControl_container{
	position:relative;
	top:100px;
	left:-10px;
	white-space: nowrap;
	display:inline-block;
	float:left;
	z-index:2001;
}

.timeControl_all{
	margin:8px;
	z-index: 300;
	cursor:default;
	padding: 4px 4px 14px 6px;
	background: #FFF;
	height:20px;
}

.timeControl_city_container, .timeControl_maptime_container{
	position:relative;
	float:left;
	cursor:pointer;
}
.timeControl_maptime_content{
	background-color:#E6476C;
	font-family:Arial;
	padding:6px;
	font-size:14px;
	color:#F9F9F9;	
	border-bottom: 2px solid #9D2A5D;
	height:16px;
}
.timeControl_city_content{
	background-color:#8380BD;
	font-family:Arial;
	padding:6px;
	font-size:14px;
	color:#F9F9F9;	
	border-bottom: 2px solid #484887;
}
.timeControl_city_content:hover{
	background:#908fc4;
	border-bottom: 2px solid #5A5B97;
}
.timeControl_maptime_content:hover{
	color:#FFF;
	padding:6px 6px 10px 6px;
}
.timeControl_regText{
	font-family:Arial;
	font-size:14px;
	float:left;
	padding: 6px;
}
.timeControl_dropdown_container{
	position:absolute;
	left:0px;
	top:34px;
	display:block;
}
.timeControl_dayOption_content{
	background-color:rgba(255,255,255,.7);
	font-family:Arial;
	padding:6px 6px 8px 6px;
	font-size:14px;
	color:#161616;	
}
.timeControl_dayOption_content:hover{
	cursor:pointer;
	background-color:#EA5E89;
	font-family:Arial;
	padding:6px;
	cursor:pointer;
	color:#F9F9F9;	
	border-bottom: 2px solid #A33E72;
}
.timeControl_city_popup{
	font-family:Arial;
	padding:10px;
	color:#000;
	width:250px;
	height:65px;
	background:#FFF;
	position:absolute;
	top:40px;
	border-top:1px solid #D8D8D8;
	right:16px;
	white-space:normal;
}
.timeControl_city_popup h1{
	font-size:24px;
	font-weight:normal;
	position:absolute;
	top:20px;
	right:36px;
	padding:0px;
	margin:0px;
}
.timeControl_city_popup_betaonly{
	color:#595959;
	font-size:12px;
	position:absolute;
	bottom:20px;
	left:17px;
}
.timeControl_city_popup_betaonly a, .timeControl_city_popup_betaonly a:visited{
	color:#778BBF;
	text-decoration:none;
}
.timeControl_city_popup_betaonly a:hover{
	color:#8FA2C9;
	text-decoration:underline;
}

	/* ALTERATIONS */
	
.timeControl_content_drained{
	background-color:#FFF;
	font-family:Arial;
	padding:6px 6px 12px 6px;
	font-size:14px;
	cursor:pointer;
	color:#000;	
}
.timeControl_maptime_content:hover, .timeControl_content_drained:hover{
	background-color:#EA5E89;
	color:#FFF;
	border-bottom: 2px solid #A33E72;
}
.timeControl_content_drained:hover{
	padding:6px 6px 10px 6px;
}

/* SPECIFY TIMECONTROL */

.specifyControl_textbox{
	-webkit-font-smoothing: antialiased;
	font-family:Arial;
	width:25px;
	font-size: 14px;
	padding:6px;
	position:relative;
	bottom:2px;
	color:#FFF;
	border:none;
}
.specifyControl_textbox_selected{
	border-bottom:2px solid #9d3f75;
	background:#E96E95;
}
.specifyControl_textbox_set{
	border-bottom:2px solid #972c5f;
	background:#de4b6d;
}

/* SEARCH */

input#search{
	-webkit-font-smoothing: antialiased;
	font-family:Arial;
	background:#FFF;
	border:1px solid #DDDDDD;
	width:310px;
	font-size:18px;
	padding:5px 2px 5px 2px;
	outline:none;
}
#searchbox_container{
	float:right;
	position:relative;
	right:-45px;
	margin-top:20px;
	z-index:2000;	
}
.searchbox_grey{
	color:#AAAAAA;
}
.search_results{
	padding:15px 0px 0px 8px;
}
#searchbox_close{
	background:url('/media/img/sprites/searchClose.png') no-repeat;
	cursor:pointer;
	width:15px;
	height:15px;
	position:absolute;
	top:11px;
	right:5px;
}
#search_details{
	background:url('/media/img/shadow_top_dark.png') repeat-x;
	color:#FFF;
	width:610px;
	padding:5px;
	font-size:12px;
}
.searchbox_close:hover{
	background-position:0px -15px;
}