/* Generic Stylesheet for the SWFL360 Virtual Tours */

html, body, #wrapper {
	height:100%;
	margin: 0;
	padding: 0;
	border: none;
	text-align: center;
}

body {
	background-color: #333333;
	font-family: Verdana, sans-serif;
	font-size : 12pt;
	color: #F0EBD9;
	/* margin: auto;
	padding: 20px; */
}

#wrapper {
	margin: 0 auto;
	text-align: left;
	vertical-align: middle;
	width: 400px;
}

.center1 {
	display: table;
	width: 100%;
	height: 100%;
}

.center2 {
	width: 100%;
	height: 100%; 
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

#main  {
	position: absolute;
	margin: 10px auto 0px auto;
	padding: 3px;
	background-color: #222222;
}

#header,
#main,
#footer {
	margin: auto;
	text-align: center;
	position: relative;
}

#header,
#footer,
#main {
	width: 906px;
}

#header {
	margin-top: 5px;
}

#main form {
	width: 1400px;
	margin-left: -247px;
}

#small #main form {
	width: 1000px;
	margin-left: -147px;
}


#button-more,
#button-more-container-transp,
#button-more-container {
	width: 906px;
}

#small #header,
#small #footer,
#small #main {
	width: 700px;
}

#small #button-more,
#small #button-more-container-transp,
#small #button-more-container {
	width: 700px;
}

a {
	text-decoration: none;
	/* color: #696969; */
}

a img {
	border: 0;
}


a:hover {
	color: #FFFFFF;
}

h2,
p.title {
	font-size: 14pt;
	font-weight: normal;
	margin: 0px;
	text-align: center;
}

p.address {
	font-size: 12pt;
	font-weight: normal;
	margin: 0px;
}

p.test {     /* not enabled tours */
	font-size: 40pt;
	color: red;
	font-weight: normal;
	margin: 0px;
}


img.border,
#youtube,
.virtualTour{
	border: 5px solid  #222222;
	background-color: #222222;
	min-width: 300px;
	display: inline-block;
	margin: auto;
}

#youtube {
	margin: 0px auto auto auto;
}


#virtualTour_360Logo {
	position: absolute;
	bottom: 20px;
	left: 10px;
	z-index: 99;
}

#button-community {
	position: absolute;
	bottom: 20px;
	right: 10px;
	z-index: 99;
}

/****** Button above Tour *****/

#button-more {
	background-image: url('/images/spacer.png');  /* fix IE bug */
	background-repeat: no-repeat;
	background-position: center bottom;
	position: absolute;
	height: 27px;
	bottom: -32px;
	text-align: right;
	/*line-height: 215px; */
	z-index: 20000;
	padding: 0px 0px;
}

#small #button-more {
	padding: 0px;
}

#button-more a,
#button-below a {
	color: #F0EBD9;     /* #CD6633; */
	font-size: 12pt;
}

#button-more-text {
	position: absolute;
	height: 28px;
	width: 75px;
	right: 0px;
}

#button-more-text-transp {
	position: absolute;
	height: 28px;
	width: 75px;
	right: 0px;
	top: -5px;
	background-color: black;
	opacity: 0.4;
	filter: alpha(opacity=40);
}

#button-below {
	display: none;  /* only shows if enabled from custom css */
	margin-bottom: 5px;
	font-weight: bold;
}

/*    mouse-over does not work ... and not in Chrome anyway 
#button-more a + #button-more-container-transp,
#button-more a + #button-more-container-transp + #button-more-container {
	display: none; 
}

#button-more a:hover + #button-more-container-transp, 
#button-more a:hover + #button-more-container-transp + #button-more-container {
	display: inline;
}
*/

#button-more-container-transp {
	display: none; 
	position: absolute;
	bottom: 3px;
	left: -2px;
	background-color: #222222;
	height: 29px;   /*24px;*/
	opacity: 0.4;
	filter: alpha(opacity=40);
	margin: 0px;
	z-index: 20005;
}

#button-more-container {
	display: none; 
	position: absolute;
	bottom: 3px;
	left: 3px;
	height: 24px;
	/* right:10px; */
	text-align: right;
	line-height: 32px;
	margin: 0px;
	z-index: 20010;
}

#button-more-container-inner,
#button-more-container-inner-text,
#button-more-container-inner-sound {
	display: inline;
}

#button-more-container-inner {
	margin-right: 80px;
}

#button-more-container-inner-text {   
	margin-top: -3px;
}

#button-more-container a {
	color: #CD6633;
/*	color: #F0EBD9; */
}

#button-more-container img {
	height: 20px;
	line-height: 10px;
}

#button-more-container #button_size_large {
	background-image: url('/images/360_button_size_large_ivory.png'); 
	width: 27px;
}

#button-more-container #button_size_small {
	background-image: url('/images/360_button_size_small_ivory.png'); 
	width: 27px;
}

#button-more-container #button_speed_fast {
	background-image: url('/images/360_button_speed_fast_ivory.png'); 
	width: 40px;
}

#button-more-container #button_speed_med {
	background-image: url('/images/360_button_speed_med_ivory.png'); 
	width: 39px;
}

#button-more-container #button_speed_slow {
	background-image: url('/images/360_button_speed_slow_ivory.png'); 
	width: 27px;
}

#button-more-container #button-contact {
	background-image: url('/images/360_button_contact_ivory.png'); 
	width: 30px;
}

#button-more-container #button_addl_info {
	background-image: url('/images/360_button_addl_info_ivory.png'); 
	width: 15px;
}

#button-more-container #button_close_win {
	background-image: url('/images/360_button_close_win_ivory.png'); 
	width: 24px;
}

#button-more-container #button_property_info {
	background-image: url('/images/360_button_property_info_ivory.png'); 
	width: 32px;
}

#button-more-container #button_ecard {
	background-image: url('/images/360_button_ecard.png'); 
	width: 31px;
}

#button-more-container #button_map {
	background-image: url('/images/360_button_map.png'); 
	width: 23px;
}




#button-more-container #button_??? {
	background-image: url('/images/360_button_???_ivory.png'); 
	width: 00px;
}


#button-more-container a span {
	position: absolute;
	background-image: url('/images/360_button_title.png');
	background-repeat: no-repeat;
	background-position: center bottom;
	white-space: nowrap;
	color: #F0EBD9;
	font-size: 10pt;
	margin: 0px;
	bottom: 22px;
	padding: 3px 5px 12px 5px;
	display: none;
	line-height: 15px;  
}

#button-more-container a span.button-text {
	
}

#button-more-container a:hover span {
	display: inline;    
} 

#button-more-container a span.left30 {
	margin-left: -30px;
}

#button-more-container a span.left47 {
	margin-left: -47px;
}

#button-more-container a span.left50 {
	margin-left: -50px;
}

#button-more-container a span.left50-left {
	background-image:url('/images/360_button_title-50-left.png');
	background-position: left bottom;
	margin-left: -50px;
}

#button-more-container a span.left56 {
	margin-left: -56px;
}

#button-more-container a span.left58 {
	margin-left: -58px;
}

#button-more-container a span.left60 {
	margin-left: -60px;
}

#button-more-container a span.left65 {
	margin-left: -65px;
}

#button-more-container a span.left75 {
	margin-left: -75px;
}

#button-more-container a span.left80 {
	margin-left: -80px;
}


/****** Button above Tour *****/
#button-container {
	width: 99.6%;
	height: 60px;
	background-color: #444;
	display: table;	  /* does not work in IE.7 :-( */
	table-layout: fixed;
	margin: 10px 2px 0px 2px; 
}

#button-container ul {
 	/* display: table-row; */
	display: table;
	-webkit-margin-before: 0em;
	-webkit-margin-after: 0em;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
	-webkit-padding-start: 0px;
	list-style-type: none; 
	height: 60px;
	width: 100%; 
	margin: 0px;
	padding: 0px;
}

#button-container ul li{
	position: relative;
	display: table-cell; 
	width: auto; 
	height: 60px;
	vertical-align: middle; 
	font-size: 10pt;
	border-left: 1px solid #333333;
	padding: 0px;
	text-align: center;
}

#button-container li:first-child {
	border-left-width: 0px;
}

#button-container a {
	display: block;
	line-height: 12px;
	padding: 0px 3px 3px 3px;
}

#button-container a:hover {
	color: #CD6633;
}

.photo {
	color: #F0EBD9;
}

.tour {
	color: #CC9933;   /*#E4CCA0; */
}

.button_bkgr_tours {
	background-image: url('/images/360_button_bkgr_tours_ivory.png');  
	background-repeat: no-repeat;
	background-position: 0px 0px;
	min-width: 51px;
}

.button_bkgr_photos {
	background-image: url('/images/360_button_bkgr_photos_ivory.png');  
	background-repeat: no-repeat;
	background-position: 0px 0px;
	min-width: 59px;
}


/***** Slide Show Nav *****/

#slide-show-nav {
	width: 470px;
	position: absolute;
	top: -39px;
	left: 225px;
	margin: 0px auto;
	padding: 4px;
}
#small #slide-show-nav {
	left: 124px;
}

#slide-show-nav-inner {
	position: relative;
	margin: auto;
	top: -22px;
	font-size: 10pt;
	font-weight: bold;
}	

#slide-show-nav-transp {
	background-color: black;
	opacity: 0.4;
	filter: alpha(opacity=40);
	height: 24px;
}

p.small {
	margin-top : 0px;
	font-size: 8pt
}

/***** POP-UP's *****/

#box-property {
	visibility: hidden;
}

#box-contact {
	visibility: hidden;
}

.box,
#box-footer {
	background-color: #333333;
}


.box {
	/* display: block; */
	visibility: hidden;

	position: absolute;
	width: 360px;
	min-height: 150px;
	left: 250px;
	top: 150px;
	background-image: url('/images/360_box_ivory.png'); 
	background-repeat: no-repeat;
	background-position: 0px 0px;
	z-index: 30000;
	padding: 45px 35px 40px 35px;
	text-align: left;

}

#box-map {
	visibility: hidden; 
	display: none; 
}


#box-footer {
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 430px;	
	height: 40px;
	background-image: url('/images/360_box_footer_ivory.png'); 
	background-repeat: no-repeat;
	background-position: top left;
}

#small .box {
	left: 140px;
	top: 50px;
}

.box a {
	color: #CD6633;
}

.box h2 {
	margin-bottom: 10px;;
}

#box-x{
	position: absolute;
	right: 23px;
	top: 37px;
	background-image: url('/images/360_box_x_orange.png');  
	background-repeat: no-repeat;
	background-position: top left;
	width: 39px;
	height: 39px;
}

.box iframe {
	height: 300px;
	width: 360px;
}
	
/* Viewer */

.virtualTour {
	position: relative;
}
.virtualTour-virtualTour {
	height: 600px;
	width: 800px;
	overflow: hidden;
}
.virtualTour-thumbnails {
	bottom: -120px;
	height: 120px;
	left: 0;
	position: absolute;
	overflow: hidden;
	width: 100%;
}
.virtualTour-thumbnails * {
	margin: 0;
	padding: 0;
}
.virtualTour-thumbnails ul {
	list-style: none;
	height: 130px;
	width: 10000px;
}
.virtualTour-thumbnails ul li {
	float: left;
	list-style: none;
	margin: 5px 5px 5px 0;
	position: relative;
}
.virtualTour-thumbnails a {
	background-color: #FFF;
	display: block;
	float: left;
	padding: 2px;
	position: relative; 
}
.virtualTour-thumbnails a:hover {
	/*background-color: #FF9 !important;*/
	opacity: 1 !important;
}
.virtualTour-thumbnails img {
	background-color: #FFF;
	display: block;
	max-width: 120px;
	max-height: 120px;
}
.virtualTour-thumbnails-active {
	/*background-color: #9FF;*/
	opacity: 1;
}
.virtualTour-thumbnails-inactive {
	opacity: .5;
}

/* fix for flash tour */
#virtualTour-flash {
	padding-top: 5px;
}


/*
.virtualTour-thumbnails a {
	width: 120px;
	padding: 2px;
	border: 1px solid #B0B0B0;
	text-align: center;
}
.virtualTour-thumbnails img {
	max-width: 120px;
	margin: 0px auto;
}*/


.virtualTour-controller {
	/*background: url(controller.png) no-repeat;*/
	height: 42px;
	left: 50%;
	margin: -21px 0 0 -119px;
	overflow: hidden;
	position: absolute;
	top: auto;
	bottom: 10px;
	width: 238px;
	z-index: 10000;
}
.virtualTour-controller * {
	margin: 0;
	padding: 0;
}
.virtualTour-controller-hidden { 
	opacity: 0;
}
.virtualTour-controller-visible {
	opacity: 1;
}
.virtualTour-controller a {
	cursor: pointer;
	display: block;
	height: 18px;
	overflow: hidden;
	position: absolute;
	top: 12px;
}
.virtualTour-controller a.active {
	background-position: 0 18px;
}
.virtualTour-controller li {
	list-style: none;
}
.virtualTour-controller li.first a {
	background-image: url(controller-first.gif);
	left: 33px;
	width: 19px;
}
.virtualTour-controller li.last a {
	background-image: url(controller-last.gif);
	left: 186px;
	width: 19px;
}
.virtualTour-controller li.next a {
	background-image: url(controller-next.gif);
	left: 145px;
	width: 28px;
}
.virtualTour-controller li.pause a {
	/*background-image: url(controller-pause.gif);*/
	left: 109px;
	width: 20px;
}
.virtualTour-controller li.play a {
	background-position: 20px 0;
}
.virtualTour-controller li.play a.active {
	background-position: 20px 18px;
}
.virtualTour-controller li.prev a {
	background-image: url(controller-prev.gif);
	left: 65px;
	width: 28px;
}

.virtualTour.vertical {
	margin-right: 130px;
}
.virtualTour.vertical .virtualTour-thumbnails {
	top: 0px;
	height: 100%;
	width: 130px;
	right: -130px;
	left: auto;
}
.virtualTour.vertical .virtualTour-thumbnails ul {
	height: 10000px;
	width: 130px;
}

.virtualTour.standard .virtualTour-virtualTour {
	height: 300px;
	width: 500px;
}
.virtualTour.standardOld .virtualTour-virtualTour {
	height: 250px;
	width: 450px;
}
.virtualTour.max .virtualTour-virtualTour {
	height: 600px;
	width: 900px;
}
.virtualTour.maxOld .virtualTour-virtualTour {
	height: 500px;
	width: 800px;
}
.virtualTour .virtualTour-thumbnails {
	display: none;
}
/* #virtualTour_360Logo {
	position: absolute;
	bottom: 2px;
	left: 2px;
}
*/