@charset "utf-8";

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

Name: Mimi Maldonado
Final Project: style.css

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

body{ 
	color: #2E332D; 
	background: #EFEDEE url('../img/bg_img11.png') repeat fixed top; /*bg_img03.png*/
	font-family: "Meiryo", "Meiryo UI", "Kozuka", "Hiragino", "Hiragino Kaku Gothic ProN", "Lucida Sans", "open-sans", Segoe UI, Arial;
	padding: 0 0 0px 0;
}
#wrapper {
	width: 1024px;
	height: auto;
	margin: 0px auto;
	background: #EFEDEE url('../img/LR-todoor-bnw.jpg') no-repeat center center; /*bg_img03.png*/
	box-shadow: 0px 10px 20px 5px #828282;
	background: #ffffff; 
	opacity: 0.95;
	border: 1px transparent solid;
}
#inside{
	padding: 150px 20px 0 20px; /*#D4E6CE;*/ 
	margin: 0 auto; 
	width: 1000px; 
	height: auto; /*border-radius: 20px; padding: 10px 20px;*/
	clear: both;
}
#content{
	padding: 25px; 
	height: auto;
	margin: 0;
}
#header{
		position: fixed;
		width: 1044px;
		height: 160px;
		text-align: center;
		font-family: "Lucida Sans", Arial, sans-serif;
		color: #FFFfff;
		background-color: #ffffff;
		margin: -10px -10px 0px -10px;
		box-shadow: 0px 5px 4px -1px #EFEDEE;
		opacity: 0.985;
		z-index: 5;
		/*border-radius: 0 0 15px 15px;*/
		/*padding: 0px 30px 0px 30px;*/}
#header h1 { 
		font-size: 40pt;
		color: #909090;
		margin: 20px 0 25px 0;
		padding: 0;
		font-family: "Tempus Sans ITC", "Lucida Sans", "open-sans", "Segoe UI", Arial, san-serif; /*, "Ravie", "MV Boli", "Matura MT Script Capitals", "Brush Script Std", "Magneto"*/
		text-shadow: 2px 2px 7px gray; /*5px 7px 5px #EFEDEE*/
		text-align: center;
		
	/*margin-bottom: -2px;*/}
a {text-decoration: none; color: #909090;}


a:hover {
	color: #9ECEFF;  /*#CAE2F9 #DBEAF9 pink*/
}
a:active {color: purple;}
#nav {	margin: 0px 0px 10px 130px;
		padding: 0;
		list-style-type: none;
		clear: both;}

#nav li {	float: left;
	font-family: "Courier New", serif;
	height: 40px;
	padding-top:30px;
	padding-right: 50px;
	/*border: 1px solid green;*/
	vertical-align: center;
	margin-top: -30px;
	margin-left: 0px;
	text-align: center;
	font-size: 20pt;
}
.visiting {
	font-weight: bold;
}
.visiting:hover {
	color: #909090;
}
.nav_home:hover{
	background: transparent url(../img/nav_1.png) no-repeat top right;
}
.nav_room:hover{
	background: transparent url(../img/nav_2.png) no-repeat top right;
}
.nav_price:hover{
	background: transparent url(../img/nav_3.png) no-repeat top right;
}
.nav_schedule:hover{
	background: transparent url(../img/nav_4.png) no-repeat top right;
}
.nav_access:hover{
	background: transparent url(../img/nav_5.png) no-repeat top right;
}
.nav_contact:hover{
	background: transparent url(../img/nav_6.png) no-repeat top right;
}
#footer { 
	height: 200px;
	background-color: #909090;
	color: #fdfbfd; 
	margin: 0px -10px -20px -10px;
	padding: 20px;
	clear: both;	 				  
}		  
#footer a { color: #ffffff; }
#footer a:link { color: #ffffff; }
#footer a:hover {
	color: #9ECEFF;  /*#CAE2F9 #DBEAF9 pink*/
}
#footer a:active {color: purple;}
#copyright{
	font-size: small;
	font-style: italic;
	text-align: center;
	margin-top: 180px;
}
#copyright h5{
	margin: 5px 0 0 0;
}
#footerDiv1{
	float: left;
	width: 250px;
	height: 160px;
	border-right: 3px groove white;
	padding: 0 10px 5px 10px;
}
#footerDiv1 h4{
	margin: 0 0 10px 0;
	font-size: medium;
	font-family: "Tempus Sans ITC", "Lucida Sans", "open-sans", "Segoe UI", Arial, san-serif;
}
#footerDiv1 p{
	margin: 0;
	font-size: .80em;
}
#footerDiv1 ul li{
	margin: 0 50px 0 0;
	float: left;
}
#footerDiv2{
	float: left;
	width: 250px;
	height: 160px;
	padding: 0 10px 5px 20px;
	margin: 0;
}
#footerDiv2 h4{
	margin: 5px 0 2px 0;
	font-size: medium;
}
#footerDiv2 ul, #footerDiv2 li{
	margin: 0;
	font-size: small;
}
#footerDiv2 li a{
	color: white;
}
#lastmodi{
	text-align: center;
	padding: 25px 0 0 0;
	margin-bottom: -70px;
	font-size: .80em;
}
.floatright { padding-top: 5px;
				padding-right: 20px;
				 float: right; }  
h1, h2, h3, h4{
	
}
.blue_link:link{
	color: blue;
}
.blue_link:hover{
	color: white;
}
#descRoomImg{
	height: 233px;
}
.notes{
	width: 800px;
	padding: 0 20px;
	background: #EDDAE3;
	height: 0px;
	overflow:hidden;
	margin-top: 50px;
	margin-bottom: 50px;
}

.cellafter{
	margin-top: -50px;
}
#droppara{
	float: left;
	margin: 20px;
}
.cell{
	display:block;
	float: left;
	height: 30px;
	width:250px;
	margin: 0px;
	background-color: #C6E2FF; /*#F9D1D8 #EDDAE3;*/
	padding-top:10px;
	text-align: center;
	border: 1px #EFefef solid;
}
.cell1{
	display:block;
	float: left;
	height: 30px;
	width:250px;
	margin: 0px;
	background-color: #AFCDEA; /*#F9D1D8 #EDDAE3;*/
	padding-top:10px;
	text-align: center;
	border: 1px #EFefef solid;
}
.cell1_1{
	display:block;
	float: left;
	height: 30px;
	width:250px;
	margin: 0px;
	background-color: #D0DFED;
	padding-top:10px;
	text-align: center;
	border: 1px #EFefef solid;
}
#pricebox1{
	width: 800px;
	height:270px;
	margin: 0px auto;
	padding: 0px;
	clear:both;
}
#pricebox2{
	width: 800px;
	height: 200px;
	margin: 10px auto 50px auto;
	padding: 0px;
}

#cancelwrap{
	display: block;
	width: 350px;
	height: 200px;
	margin:0;
	padding: 0px;
	float:left;
}
.cell2{
	display:block;
	float: left;
	height: 30px;
	width:150px;
	margin: 0px;
	background-color: #F9D1D8; /*#EDDAE3;*/
	padding-top:10px;
	text-align: center;
	border: 1px #EFefef solid;
}
#cancelblank{
	display:block;
	width: 280px;
	height: 200px;
	margin: 0px 0px 0 -1550px;
	border: 1px #EFefef solid;
	float:right;
}
.clear
{	clear: both;
	overflow: hidden;
	height: 0;
}
#rokkaku .clear{
	clear: both;
	overflow: hidden;
	height: 0;
}
.clear-line
{	margin: 0 20px;
	height: 0;
	}

#blank{
	width: 100px;
	height: 250px;
}
img{
	border: none;
}

#rokkaku{
	width: 900px;
	height: auto;
	margin: 0px 0 40px 0;
	padding: 0px 20px 10px 20px;
}
.box1 img{
	margin: 0 10px -5px -20px;
}
.box1{
	display: block;
	width: 240px;
	height: 250px;
	float: left;
	margin: 20px 10px;
	text-align: center;
	background-color: #EFEDEE;
	color: #989898; /*#989898*/
	box-shadow: 0px 5px 4px -1px #828282;
	padding: 0 20px 20px 20px;
	background: transparent url(../img/bg_img01.png) no-repeat bottom left;
}
.box4{
	width: 600px;
	height: auto;
	margin: 0px 150px;
	clear: both;
}
.box2{
	display: block;
	width: 250px;
	height: 250px;
	float: left;
	margin: 10px 20px 10px 100px;
	text-align: center;
	background-color: #EFEDEE;
	color: #989898;
	box-shadow: 0px 5px 4px -1px #828282;
	padding: 0 20px 20px 20px;
}
.box3{
	display: block;
	width: 250px;
	height: 250px;
	float: left;
	margin: 10px 100px 10px 20px;
	text-align: center;
	background-color: #EFEDEE;
	color: #989898;
	box-shadow: 0px 5px 4px -1px #828282;
	padding: 0 20px 20px 20px;
}

#descRoomImg{
	display: block;
	float: left; 
	width: 547px; 
	height: 364px;
	margin: 0;
}
#frmReg {
	width:800px;
	margin: 30px auto 0 auto;
	border-radius: 10px;
	background: #C6E2FF url(../img/bg_img12.png) no-repeat top left;
	opacity: 0.8;
	border: 1px solid green;
}
#message_help{
	text-align: left;
	margin: -30px 20px 20px 20px;
	width: 350px;
	font-size: small;
}
#schedule_date{
	background: white;
	opacity: 0.8;
	border-radius: 10px;
	width: 750px;
	margin: 20px auto;
}
.field{
	text-align:right;
	margin-bottom: 10px;
	width: 400px;
}

.field2{
	text-align:left;
	margin-bottom: 10px;
	width: 400px;
}
.fieldbtn{
	text-align:right;
	width: 370px;
	margin: 20px;
}
.linebr{
	width: 380px;
	margin: 20px;
}
.registerBtn{
	text-align:right;
	margin-top: 10px;
}		

span.help {
  color:#660000;
  font-style:italic;
  margin-left: 10px;
}
#comment{
	width: 500px;
	height: 200px;
	overflow: scroll;
}

.bold{
	font-weight: bold;
}	

#descRoom{
	display: block;
	float: left;
	width: 750px;
	margin: 0;
	padding: 0 130px 0 20px;
	border-radius: 10px;
	background: #9ECEFF url(../img/mmr_piano-only_small.png) no-repeat bottom right;
	opacity: 0.8;
}

#descBottom{
	display: block;
	width: 900px;
	margin: 10px auto;
	padding: 10px;
	text-align:  center;
}

.page-up {	
	text-align: right;
	padding-right: 5px;
	clear: both;
	float: right;
}	

/************************************/
/***********Booking Page*************/
/************************************/

#booking-form, #contact-form{
	height: auto;
	padding: 0 20px;
}

form{
	width: 850px;
	height: auto;
	background: transparent url(../img/bg_img01.png) repeat top left;
	padding: 10px 20px 20px 20px;
	margin: 0 auto;
	
	-moz-border-radius: 25px;/* Firefox */
	-webkit-border-radius: 25px; /* Safari and Chrome */
	border-radius: 25px;/* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */
	/*behavior: url(ie-css3.htc);*/ /* This lets IE know to call the script on all elements which get the 'box' class */
}
fieldset{
	margin: 0 0 20px 0;
}
form table{
}/*width: 700px;*/
form table td{
	background-color:#D7E3EF;/*#C9E4FF*/ 
	border: 2px #f2f0f0 solid;
	padding: 5px;
	font-size: small;
}
form textarea{
	width: 500px;
	height: 150px;
	text-align: left;
	padding: 0;
}
input{
	font-family:"open-sans", Segoe UI, Helvetica, sans-serif, Arial, 'Meiryo UI', 'メイリオ', '小塚ゴシックPro';
}
.formtitle{
	font-weight:bold;
	padding-left: 10px;
	/*background-color:#FFD6ED;*/
}
.thankyou-note{
	font-size: medium;
	text-align: center;
	font-weight: bold;
	font-family: "Meiryo", "Kozuka", "Hiragino", "Hiragino Kaku Gothic ProN", "Lucida Sans", "MS Mincho";
	
}
#topThanksMsg{
	text-align: center;
	clear: both;
}
#error_msg{
	padding: 5px;
	background: yellow;
	/*opacity: 0.5;*/
	border-radius: 5px;
	height: auto;
	margin: 5px 60px;
}
.form_errors{
	list-style: none;
	color: red;
}
#space{
	height: 20px;
}
.redlink{
	color: #A60B21; /*#FC85C1   #FC85C1 #8B0138*/
}

/************************************/
/***********Access Page*************/
/************************************/

#zoomImg{
	width: 800px;
	height: 450px;
	margin: 0 auto;
}
#zoomImg p { position:absolute; top:5px; right:28px; color:blue; font:bold 13px/1 "Meiryo";}

/* these styles are for the demo, but are not required for the plugin */
.zoom {
	position: relative;
}
/* magnifying glass icon */
.zoom:after {
	content:'';
	display:block; 
	width:33px; 
	height:33px; 
	position:absolute; 
	top:0;
	right:0;
	background:url(../img/icon.png);
}

.zoom img {
	display: block;
}

.zoom img::selection { background-color: transparent; }

#content2{
	margin: 40px 20px 20px 20px;
}
#content2Indent{
	margin: 0 20px;
}
#content2 h2, #content2 p{
	display: inline;
}
#content2 .h2_inline{
	display: block;
	margin: 20px 0;
}

#sitemap{
	width: 850px;
	height: auto;
	display: block;
	margin: 0 auto 25px auto;
	padding: 20px;
	border-radius: 10px;
	background: #9ECEFF url(../img/bg_img01.png) repeat top left;
	opacity: 0.9;
}
#sitemap a {
	color: #545454;
}
#sitemap a:link { color: #545454; }
#sitemap a:hover {
	color: #2D96C6;  /*#9ECEFF #CAE2F9 #DBEAF9 pink*/
}
#sitemap a:active {color: purple;}