/* Guidebook Mobile Light CSS */
/* Target platform - Blackberry 5.0 */
/* Written by - Pete Lada - Guidebookapp.com */
/* This is going to be quick and dirty, just need quick bb5.0 support */

/* Globals
-----------------------------------------------------------------------------------------------------------*/

*{
	font-family:"Helvetica Neue", "Helvetica", Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6, p, ul {
	padding:0;
	margin:0;
}
h1{
	font-size:1.2em;
}
h2{
	font-size:1.2em;
}



p{
	font-size:1em;
	padding:10px;
}
.clearfix,
.clear{
	clear:both;
	display:block;
}
.ui-center{
	text-align:center;
}

.ui-sub-text{
	font-size:.8em;
}
.ui-visible{
	display:block;
}

.ui-only-text{
	padding: 10px;
}



/* Structure
-----------------------------------------------------------------------------------------------------------*/

body, html{
	margin:0;
	padding:0;
	background-color:#f5f5f5;
}

.container{
	width:100%;
	height:100%;
}

.header{

}

.sub-header{

}

/* Header
-----------------------------------------------------------------------------------------------------------*/

.header{
	background:#f3f8fa;
	background-image: -moz-linear-gradient(top, 
							#fff, 
							#e6eff2);
	background-image: -webkit-gradient(linear,left top,left bottom,
			color-stop(0, 	#fff),
			color-stop(1, 	#e6eff2));
	/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#fff', EndColorStr='#e6eff2')";*/
	padding:10px;
	border-bottom:1px solid white;
	position:relative;
}
.header h1{
	color:#42a0d9;
	text-shadow:0 1px 0 white;
}
.header .ui-logo{
	background-image:url(../images/mobile/logo.png);
	background-repeat:no-repeat;
	background-position:left;
	text-indent:-9999px;
	min-height:32px;
}

/* Header navigation button
-----------------------------------------------------------------------------------------------------------*/

.header .ui-header-button-holder{
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	border-left:1px solid white;
	box-shadow:inset 1px 0 0 #ddd;
}

.header .ui-header-navigation-button{
	background-color:#64A1D9;
	display:block;
	font-weight:bold;
	color:white;
	text-decoration:none;
	border:1px solid #3F9AD1;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	text-align:center;
	font-size:12px;
	margin:10px;
	outline-width:0;
	padding:8px;
	box-shadow:0 1px 0 white;
	text-shadow:0 -1px 0 #3F9AD1;
}

.header .ui-header-navigation-button.thin{
	margin:7px;
}

/* Sub-header
-----------------------------------------------------------------------------------------------------------*/

.sub-header{
	background:#337eaa;
	color:white;
	text-shadow:0 1px 0 #19628c;
	padding:10px;
	position:relative;
	border-top:1px solid #286488;
	border-bottom:1px solid #164d72;
}
.ui-bar{
	height:5px;
	background-image:url(../images/mobile/header_bgd.png);
	background-position:bottom left;
	border-top:1px solid #0e5296;
}
.sub-header h2{
	
}
.sub-header .ui-sub-text{
	color:#8ecaee;
	display:block;
	margin-bottom:2px;
	text-shadow:none;
}
.sub-header .ui-sub-text-right{
	position:absolute;
	right:10px;
	bottom:10px;
}
.sub-header .ui-guide-icon{
	float:left;
	width:4.5em;
	margin-right:10px;
}

.sub-header .sub-header-info{
	min-height:15px;
}

/* Sub-Header Navigation
-----------------------------------------------------------------------------------------------------------*/
.ui-navigation-button{
	position:absolute;
	left:8px;
	background:		transparent 
					url(../images/mobile/arrow-gray-left.png)
					left center
					no-repeat;
	width: 23px;
	height: 23px;
	display:block;
	text-indent:-9999px;
	top:10px;
}
.ui-navigation-button-next{
	left:auto;
	right: 8px;
	top:10px;
	background-image:url(../images/mobile/arrow-gray-right.png);
}

/* Upgrade Alert
-----------------------------------------------------------------------------------------------------------*/

.upgrade-note{
	padding:10px;
	font-size:.8em;
	background-color:#f8f5e0;
	color:#878047;
	border-bottom:1px solid #e5e1c8;
	text-align:center;
}
.upgrade-note a{
	color:#494520;
}

/* List
-----------------------------------------------------------------------------------------------------------*/

.ui-list{
	list-style:none;
}
.ui-list a{
	display:block;
	padding:10px;
	text-decoration:none;
	color:black;
	font-weight:bold;
	background-image:url(../images/mobile/table_row_arrow.png);
	background-position:98% 50%;
	background-repeat:no-repeat;
}
.ui-list li{
	border-bottom:1px solid #ccc;
	background-color:white;
}
.ui-list li a:hover{
	background-color:#f5f5f5;
}
.ui-list li a:active{
	background-color:#f0f0f0;
}
.ui-list-icon{
	width:3em;
	float:left;
	margin-right:10px;
	border:none;
	display:block;
}
.ui-list .ui-sub-text{
	color:#aaa;
	display:block;
	font-weight:normal;
}
.ui-list .ui-fill{
	height:100%;
	display:block;
	padding:.6em 75px .6em 15px;
}
.ui-list .ui-list-divider{
	padding:.3em 10px;
	background-color:#d6d6d6;
	background-image: -moz-linear-gradient(top, 
					#e1e1e1,
					#cacaca);
	background-image: -webkit-gradient(linear,left top,left bottom,
			color-stop(0, 	#e1e1e1),
			color-stop(1, 	#cacaca));
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#e1e1e1', EndColorStr='#cacaca')";
	color:#6e6e6e;
	text-shadow:0 1px 0 white;
	font-weight:bold;
	font-size:10px;
	box-shadow:inset 0 1px 0 #ebebeb;
	border-bottom:1px solid #a7a7a7;
}

.ui-row-highlight{
	border-left:4px solid #f4e727;
}
.ui-row-highlight a{
	padding-left:6px;
}

.guide-list .title{
	padding-top:13px;
}
.guide-list li .ui-list-icon{

}


/* HD/"retina" images 
-----------------------------------------------------------------------------------------------------------*/

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min--moz-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 240dpi) {
	
	.ui-list a{
		background-image:url(../images/mobile/table_row_arrow_2x.png);
		-moz-background-size: 10px 15px;
		-o-background-size: 10px 15px;
		-webkit-background-size: 10px 15px;
		background-size: 10px 15px;
	}
	
	.header .ui-logo{
		background-image:url(../images/mobile/logo_2x.png);
		-moz-background-size: 125px 32px;
		-o-background-size: 125px 32px;
		-webkit-background-size: 125px 32px;
		background-size: 125px 32px;
	}
	
	.ui-bar{
		background-image:url(../images/mobile/header_bgd_2x.png);
		-moz-background-size: 320px 84px;
		-o-background-size: 320px 84px;
		-webkit-background-size: 320px 84px;
		background-size: 320px 84px;
	}
	
	.ui-navigation-button{
		background-image:url(../images/mobile/arrow-gray-left_2x.png);
		-moz-background-size: 12px 15px;
		-o-background-size: 12px 15px;
		-webkit-background-size: 12px 15px;
		background-size: 12px 15px;
		background-position:left;
	}
	.ui-navigation-button-next{
		background-image:url(../images/mobile/arrow-gray-right_2x.png);
		-moz-background-size: 12px 15px;
		-o-background-size: 12px 15px;
		-webkit-background-size: 12px 15px;
		background-size: 12px 15px;
		background-position:right;
	}
	
}

/* Details
-----------------------------------------------------------------------------------------------------------*/

.ui-description{
	font-size:1em;
	line-height:1.5em;
	background-color:#f5f5f5;
}

.ui-details-image img{
	display:block;
	width:100%;
	max-width:640px;
}	

.ui-description ul{
	margin-left: 40px;
	padding: 0 10px 10px 10px;
}

.ui-description h1,
.ui-description h2,
.ui-description h3, 
.ui-description h4,
.ui-description h5,
.ui-description h6{
	color:#777;
	padding:10px 10px 0 10px;
}


/* Attachments
-----------------------------------------------------------------------------------------------------------*/

#attachments{
	padding:10px;
	border-top:1px solid #ccc;
	-webkit-box-shadow:inset 0 1px 0 white;
}

.attachment-pod{
	margin-bottom:20px;
}
.attachment-pod:last-child{
	margin-bottom:5px;
}

.attachment-pod h5{
	color:#999;
	font-size:1em;
	margin-bottom:10px;
}

.attachment-pod .pod-inner{
	background-color:white;
	border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:0 2px 2px rgba(0,0,0,.05);
}

.attachment-pod a{
	color:black;
	text-decoration:none;
	display:block;
	padding:10px;
}

.attachment-pod .title{
	font-size:.9em;
	font-weight:bold;
	margin:0;
	padding:0;
}

.attachment-pod .subtitle{
	font-size:12px;
	color:#999;
	margin:0;
	margin-top:5px;
	padding:0;
}

.attachment-pod .pod{
	border-bottom:1px solid #eee;
	background-color:transparent;
}
.attachment-pod .pod:last-child{
	border-bottom:none;
}

.attachment-pod img{
	display:none;
}


/* Ratings
-----------------------------------------------------------------------------------------------------------*/

#ratings{
	border-bottom:1px solid #ccc;
	box-shadow:0 1px 0 white;
	-webkit-box-shadow:0 1px 0 white;
	padding:10px;
}

#ratings h5{
	font-size:11px;
	color:#999;
	margin-bottom:5px;
}

#ratings h5 span{
	font-weight:normal;
}

#ratings #stars img{
	width:16px;
	height:16px;
}



/* Form Elements
-----------------------------------------------------------------------------------------------------------*/

.ui-form{
	padding:5px;
	border-bottom:1px solid #ccc;
	background-color:#eeefef;
}

.ui-form input{
	padding:.3em;
	color:#666;
	font-size:1em;
	border:1px solid #ccc;
	-webkit-border-radius:20px;
	padding-left:10px;
	border-top-color:#999;
	outline-width:0;
}

.ui-form .ui-full-width{
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
}

/* Button Container
-----------------------------------------------------------------------------------------------------------*/ 
.ui-button-container{
	padding:5px;
	border-bottom:1px solid #ccc;
	background-color:#eeefef;
	text-align:center;
}
.ui-button-container-inner{

}

/* Buttons
-----------------------------------------------------------------------------------------------------------*/ 
.ui-button{
	background-color:white;
	display:inline-block;
	font-weight:bold;
	color:black;
	text-decoration:none;
	border:1px solid #ccc;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	text-align:center;
	font-size:1em;
	margin:0;
	float:left;
	outline-width:0;
}
.ui-button span{
	display:block;
	padding:10px;
}
.ui-button:hover{
	background-color:#f9f9f9;
}
.ui-button-selected,
.ui-button-selected:hover{
	background:			#666;
	background-image: -moz-linear-gradient(top, 
					#666,
					#555);
	background-image: -webkit-gradient(linear,left top,left bottom,
			color-stop(0, 	#666),
			color-stop(1, 	#555));
	/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#666666', EndColorStr='#555555')";*/
	color:white;
	border-color:#555;
	text-shadow:0 -1px 0 #444;
}
.ui-split-one .ui-button{
	width:99.5%;
}
.ui-split-two .ui-button{
	width:40%;
}
.ui-split-three .ui-button{
	width:33%;
}
.ui-split-three .ui-button:nth-child(1){
	border-radius:10px 0 0 10px;
	-webkit-border-radius:10px 0 0 10px;
	-moz-border-radius:10px 0 0 10px;
}

.ui-split-three .middle{
	border-left:none !important;
	border-right:none !important;
	border-radius:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
}
.ui-split-three .ui-button:nth-child(3){
	border-radius:0 10px 10px 0;
	-webkit-border-radius:0 10px 10px 0;
	-moz-border-radius:0 10px 10px 0;
}

/* Buttons
-----------------------------------------------------------------------------------------------------------*/

.map-image-contained{
	width:100%;
	display:block;
}


/* Banner
-----------------------------------------------------------------------------------------------------------*/

#banner{
	text-align: center;
	padding:5px;
	background-color:#c9c9c9;
	border-top:1px solid #aaa;
}
#banner img{
	width:100%;
	display:block;
}
#banner a{
	border:0;
}

/* UI Input
-----------------------------------------------------------------------------------------------------------*/

.ui-form{
	display:block;
	padding:10px;
}
.ui-input{
	display:block;
}



/* Photos
-----------------------------------------------------------------------------------------------------------*/

.ui-image-holder{
	position:relative;
}

.ui-image-holder .caption{
	position:absolute;
	bottom:0;
	right:0;
	left:0;
	padding:10px;
	background-color:rgba(0,0,0,.5);
	color:white;
	text-shadow:0 0 1px rgba(0,0,0,.5);
	font-size:13px;
}

.ui-photo-grid tr td{
	width:33%;
}

.ui-photo-grid tr a{
	display:block;
}

.ui-photo-grid tr a img{
	width:100%;
	display:block;
}