/* @group gallery */

#gallery {
	position: relative;
	padding-top: 2px;
	width: 400px;
	margin: 0px auto 20px auto;
	background: url(../img/progress_bg.png) repeat-x 0 0;
}

#gal-progress {
	text-align: center;
	line-height: 6px;
	margin-top: 6px;
	margin-bottom: 20px;
	width: 400px;
}

#gal-progress .selected,
.slide-01 #gal-progress #gal-pro-slide-01 .unselected,
.slide-02 #gal-progress #gal-pro-slide-02 .unselected,
.slide-03 #gal-progress #gal-pro-slide-03 .unselected,
.slide-04 #gal-progress #gal-pro-slide-04 .unselected,
.slide-05 #gal-progress #gal-pro-slide-05 .unselected,
.slide-06 #gal-progress #gal-pro-slide-06 .unselected,
.slide-07 #gal-progress #gal-pro-slide-07 .unselected,
.slide-08 #gal-progress #gal-pro-slide-08 .unselected {
	display: none;
}

.slide-01 #gal-progress #gal-pro-slide-01 .selected,
.slide-02 #gal-progress #gal-pro-slide-02 .selected,
.slide-03 #gal-progress #gal-pro-slide-03 .selected,
.slide-04 #gal-progress #gal-pro-slide-04 .selected,
.slide-05 #gal-progress #gal-pro-slide-05 .selected,
.slide-06 #gal-progress #gal-pro-slide-06 .selected,
.slide-07 #gal-progress #gal-pro-slide-07 .selected,
.slide-08 #gal-progress #gal-pro-slide-08 .selected {
	display: inline;
}

#gal-progress li {
	display: inline;
	padding: 0 1px;
}

#gal-slides li {
	display: none;
}

.slide-01 #gal-slides li#slide-01,
.slide-02 #gal-slides li#slide-02,
.slide-03 #gal-slides li#slide-03,
.slide-04 #gal-slides li#slide-04,
.slide-05 #gal-slides li#slide-05,
.slide-06 #gal-slides li#slide-06,
.slide-07 #gal-slides li#slide-07,
.slide-08 #gal-slides li#slide-08 {
	display: block;
}

#gallery p.slide {
	border: 1px solid #626262;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	background: #747373 url(../img/iphone_bg.jpg) no-repeat center center;
	height: 430px;
	height: 550px;
}

#gallery #gal-slides li p.slide img {
	margin-top: 113px;
	margin-left: 85px;
}

#gallery div.legend {
	margin-top: -5px;
	padding: 14px 19px 15px;
	border: 1px solid #ddd;
	background-color: #e5e5e5;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}

#gallery div.legend h3 {
	margin-bottom: 5px;
	color: #333;
}

#gallery div.legend p {
	font-size: 11px;
	margin: 0;
	color: #666;
}

#gallery div.legend p a:link, #gallery div.legend p a:visited {
	color: #666;
}

#gallery a.prev-slide,
#gallery a.next-slide {
	position: absolute;
	top: 0;
	width: 35px;
	height: 27px;
	text-indent: 150%;
	overflow: hidden;
	white-space: nowrap; 
	background-image: url(../img/nav-gallery.png);
}

#gallery a.prev-slide {
	left: -3px;
}

#gallery a.prev-slide:active {
	background-position: 0 -27px;
}

#gallery .first a.prev-slide {
	background-position: 0 -54px;
	cursor: default;
}

#gallery a.next-slide {
	right: 0;
	background-position: -35px 0;
}

#gallery a.next-slide:active {
	background-position: -35px -27px;
}

#gallery .last a.next-slide {
	background-position: -35px -54px;
	cursor: default;
}