/*============================================================================================*/
/* 1. SITE STRUCTURE */
/*============================================================================================*/

/* #Site Header
================================================ */
header{background:#de9438 url(/img/bg_header.png) repeat-x left top;border-bottom:1px solid #de9438;height:90px;width:100%;z-index:1000;position:fixed;top:0;left:0;}
#logo{ background-color:#c6b294; box-shadow:0 1px 3px rgba(0,0,0,.3); -moz-box-shadow:0 1px 3px rgba(0,0,0,.3); text-align:center; -webkit-box-shadow:0 1px 3px rgba(0,0,0,.3);}
#logohttps { background-color:#c6b294; box-shadow:0 1px 3px rgba(0,0,0,.3); -moz-box-shadow:0 1px 3px rgba(0,0,0,.3); text-align:center; -webkit-box-shadow:0 1px 3px rgba(0,0,0,.3);}

/*#logo a{ background:url(/img/logo_1.png) no-repeat 0 0; display:block; height:98px; margin:10px auto 15px; text-indent:-9999px; width:180px;}*/

#logo a { 
background: url(/img/logo_1.png), url(/img/logo_bg.png); 
background-repeat: no-repeat, no-repeat; 
background-position: center 10px, 0 0; 
display: block; 
height: 123px; 
margin: 0px auto; 
text-indent: -9999px; 
width: 220px;
}
#logohttps a { 
background: url(https://miura.websitewelcome.com/~innofthe/img/logo_1.png), url(https://miura.websitewelcome.com/~innofthe/img/logo_bg.png); 
background-repeat: no-repeat, no-repeat; 
background-position: center 10px, 0 0; 
display: block; 
height: 123px; 
margin: 0px auto; 
text-indent: -9999px; 
width: 220px;
}

ul#lang{ color:#ede4d5; float:right; font-size:14px; font-weight: bold; margin-top:20px; margin-right: 10px; text-transform:none;}
ul#lang a{ color:#ede4d5; text-decoration:none;}
ul#lang a:hover{ color:#fff;}
ul#lang li{ background: none right center no-repeat; float:left; float:top; margin-left:10px; padding-right:10px;}
ul#lang li:last-child{ background:none; padding-right:0;}
#wxWrap{ float:right; margin-top:9px; width:170px;}
#wxIntro{ color:#ede4d5; display:inline-block; font:12px/20px Helvetica,Arial; padding-top:9px; vertical-align:top;}
#wxIcon{ background:url('http://l.yimg.com/a/lib/ywc/img/wicons.png') no-repeat 61px 0; display:inline-block; height:24px; margin:1px 6px 0 0px; overflow:hidden; width:43px; }
#wxIcon2{ display:inline-block; height:34px; margin:1px 6px 0 8px; overflow:hidden; width:34px;}
#wxTemp{ color:#ede4d5; display:inline-block; font:18px/28px Arial,Verdana,sans-serif; margin-left:4px; padding-top:5px; vertical-align:top;}

#nav-page a{ color:#000000; text-decoration:none; font-weight: bold;}
#nav-page a:hover{ color:#333333;}
/*ul#nav-page li{ border-right: 1px solid #333333; float: left; margin-right:10px; padding-left:10px;}
ul#nav-page li:first-child{ background:none; padding-left:0;}*/

div.mobile { visibility: hidden; display: none;}
div.desktop { visibility: visible; display: block;}
span.mobile { visibility: hidden; display: none;}
span.desktop { visibility: visible; display: block;}
ul.mobile { visibility: hidden; display: none;}
ul.desktop { visibility: visible; display: block;}
a.mobile { visibility: hidden; display: none;}
a.desktop { visibility: visible; display: inline-block;}
img.mobile { visibility: hidden; display: none;}
img.desktop { visibility: visible; display: block;}

select.mobileMenu{ color:#444; font:14px 'PT Sans Narrow', sans-serif; margin: 15px auto 0 auto; padding: 0px; } 

/* #Site Footer
================================================ */
footer{ background:#624c2b url(/img/bg_footer.png) repeat-x left top; color:#ede4d5; padding: 0 0 0 0; width:100%; }
div.mobile-footer { text-align: center; visibility: invisible; display: none; }
#nav-footer a{ color:#ede4d5; text-decoration:none; font-weight: bold; }
#nav-footer a:hover{ color:#fff;}
ul#nav-footer li{ background:url(/img/menu_footer_divider.png) left center no-repeat; float: left; margin-right: 10px; padding-left: 10px;}
ul#nav-footer li:first-child{ background:none; padding-left:0;}
.copy{ font-size: 0.7em; float: right; text-align: right; }
div.social-footer { visibility: hidden; display: none; margin: 5px 0px; }

/* #Content
================================================ */
/*#slidecaption{ background:#fff; bottom:2%; box-shadow:0 1px 5px rgba(0,0,0,.5); font-size:2.20em; line-height:16px; -moz-box-shadow:0 1px 5px rgba(0,0,0,.5); padding:15px; position:absolute; right:1%; text-align:right; -webkit-box-shadow:0 1px 5px rgba(0,0,0,.5);}
#slidecaption span{ color:#999; display:block; font-size:0.50em; margin-top:10px;}
#prevslide, #nextslide{ bottom:40px; height:43px; margin-top:-21px; opacity:0.6; position:absolute; width:43px;}
#prevslide{ background:url(/img/back.png); left:10px;}
#nextslide{ background:url(/img/forward.png); right:10px;}
#prevslide:active, #nextslide:active{ margin-top:-19px;}
#prevslide:hover, #nextslide:hover{ cursor:pointer;}
#banner_home{ background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.3); -moz-box-shadow:0 1px 3px rgba(0,0,0,.3); position:relative; top:-27px; -webkit-box-shadow:0 1px 3px rgba(0,0,0,.3); margin-bottom:0px;}*/

#slidecaption{ background:#fff; bottom:2%; box-shadow:0 1px 5px rgba(0,0,0,.5); font-size:2.20em; line-height:16px; -moz-box-shadow:0 1px 5px rgba(0,0,0,.5); padding:15px; position:absolute; right:1%; text-align:right; -webkit-box-shadow:0 1px 5px rgba(0,0,0,.5);}
#slidecaption span{ color:#999; display:block; font-size:0.50em; margin-top:10px;}
#prevslide, #nextslide{ bottom:40px; height:43px; margin-top:-21px; opacity:0.6; position:absolute; width:43px;}
#prevslide{ background:url(/img/back.png); left:10px;}
#nextslide{ background:url(/img/forward.png); right:10px;}
#prevslide:active, #nextslide:active{ margin-top:-19px;}
#prevslide:hover, #nextslide:hover{ cursor:pointer;}
#banner_home{ background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.3); -moz-box-shadow:0 1px 3px rgba(0,0,0,.3); position:relative; top:-27px; -webkit-box-shadow:0 1px 3px rgba(0,0,0,.3); margin-bottom:20px;}

.ie8 #banner_home, .ie7 #banner_home { border:0px solid #ededed; }

ul#follow li{float:left;margin-right:10px;}
ul#follow li a{display:block;height:36px;text-indent:-9999px;width:37px;}
ul#follow li a#tw{background:url(/img/sprite_social.png) no-repeat 0 0;}
ul#follow li a:hover#tw{background:url(/img/sprite_social.png) no-repeat 0 -42px;}
ul#follow li a#rss{background:url(/img/sprite_social.png) no-repeat -47px 0;}
ul#follow li a:hover#rss{background:url(/img/sprite_social.png) no-repeat -47px -42px;}
ul#follow li a#vimeo{background:url(/img/sprite_social.png) no-repeat -94px 0;}
ul#follow li a:hover#vimeo{background:url(/img/sprite_social.png) no-repeat -94px -42px;}
ul#follow li a#fb{background:url(/img/sprite_social.png) no-repeat -141px 0;}
ul#follow li a:hover#fb{background:url(/img/sprite_social.png) no-repeat -141px -42px;}


/*============================================================================================*/
/* 2. PAGES AND CONTENT */
/*============================================================================================*/

/* #Home
================================================ */
#banner_home .four.columns{ text-align:right;}
#banner_home .four.columns a.button_red{ margin:12px;}
.bg_gray{ background: #ede4d5 url(/img/big_shadow.png) center 1px no-repeat; border-bottom:1px solid #e6e6e6; border-top:1px solid #e6e6e6;}
#back{ display:none;}

/*============================================================================================*/
/* 3. MISC */
/*============================================================================================*/
.picture{ position:relative;}
.picture em{ background:url(/img/shadow_1.png) no-repeat center top; display:block; height:10px; margin-bottom:10px; margin-top:-3px; width:100%}
.magnify{ background:url(/img/zoom_1.png) no-repeat 10px 10px; display:none; height:92%; left:0; position:absolute; top:0; width:100%; z-index:999;}

.ie8 .picture em{ background:url(/img/shadow_1.png) no-repeat center top; display:block; height:10px; margin-bottom:10px; margin-top:-2px; width:100%}
.ie7 .picture em{ background:url(/img/shadow_1.png) no-repeat center top; display:block; height:10px; margin-bottom:10px; margin-top:1px; width:100%}

ul.list_3 li{ background:url(/img/tick_1.png) no-repeat left 3px; line-height:16px; padding-left:20px;}
ul.list_4 li{ background:url(/img/arrow_2.png) no-repeat 3px 5px; line-height:18px; padding-left:20px;}
ul.list_5 li{ background:url(/img/arrow_3.png) no-repeat 5px 7px; line-height:18px; padding-left:20px;}
ul.list_6 li{ background:url(/img/arrow_4.png) no-repeat 4px 6px; line-height:18px; padding-left:20px;}
ul.room_facilities{ padding-bottom:20px;}
ul.room_facilities li{ display:block; float:left; height:30px; margin:0 10px 10px 0; text-indent:-9999px; width:30px;}
ul.room_facilities li a{ cursor:pointer; display:block; height:30px; width:30px;}
ul.room_facilities li.lcd a{ background:url(/img/icons_room.png) no-repeat -1px 0;}
ul.room_facilities li.wifi a{ background:url(/img/icons_room.png) no-repeat -50px 0;}
ul.room_facilities li.safe a{ background:url(/img/icons_room.png) no-repeat -97px 0;}
ul.room_facilities li.bath a{ background:url(/img/icons_room.png) no-repeat -144px 0;}
ul.room_facilities li.loundry a{ background:url(/img/icons_room.png) no-repeat -192px 0;}
ul.room_facilities li.parking a{ background:url(/img/icons_room.png) no-repeat -242px 0;}
ul.room_facilities li.breakfast a{ background:url(/img/icons_room.png) no-repeat -288px 0;}
ul.room_facilities li.dinner a{ background:url(/img/icons_room.png) no-repeat -335px 0;}

.facilities_desc{ background-color:#f9f9f9; border:1px solid #ededed; padding:12px; margin-bottom: 0; line-height: 1.25em; }
.facilities_desc ul li { border-bottom:1px solid #e8e8e8;}
.facilities_desc ul li:last-child { border-bottom: none; }


/*============================================================================================*/
/* 4. MEDIA QUERIES */
/*============================================================================================*/

/* Smaller than standard 960 (devices and browsers) ========================================= */
@media only screen and (max-width: 959px) { 
ul#lang li{ display: block; clear: both; float: none; background: none; margin:0 auto; padding:0 auto;}
/*#logo a{ background:url(/img/logo_3.png) no-repeat 0 0; display:block; height:77px; margin:15px auto; text-indent:-9999px; width:141px;}*/

#logo a{ 
background: url(/img/logo_3.png), url(/img/logo_bg.png);  
background-repeat: no-repeat; 
background-position: center; 
display:inline block; 
height:107px; 
margin:0px auto; 
text-indent:-9999px; 
width: 100%;}
} 
#logohttps a{ 
background: url(https://miura.websitewelcome.com/~innofthe/img/logo_3.png), url(https://miura.websitewelcome.com/~innofthe/img/logo_bg.png);  
background-repeat: no-repeat; 
background-position: center; 
display:inline block; 
height:107px; 
margin:0px auto; 
text-indent:-9999px; 
width: 100%;}
} 

/* Tablet Portrait size to standard 960 (devices and browsers) ================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {
ul#lang li{ display: inline block; clear: both; float: none; background: none; margin:0 auto; padding:0 auto;}
ul#lang li:last-child{ background:none; padding:0;}
/*#logo a{ background:url(/img/logo_2.png) no-repeat 0 0; display:block; height:55px; margin:15px auto; text-indent:-9999px; width:100px;}*/

/*#logo-test a{ 
background: url(/img/logo_2.png), url(/img/logo_bg.png);  
background-repeat: no-repeat; 
background-position: center; 
display:inline block; 
height:85px; 
margin:0px auto; 
text-indent:-9999px; 
width:172px;}*/

#logo a { 
background: url(/img/logo_3.png), url(/img/logo_bg.png); 
background-repeat: no-repeat, no-repeat; 
background-position: center 10px, 0 0; 
display: block; 
height: 102px; 
margin: 0px auto; 
text-indent: -9999px; 
width: 171px;
}
#logohttps a { 
background: url(https://miura.websitewelcome.com/~innofthe/img/logo_3.png), url(https://miura.websitewelcome.com/~innofthe/img/logo_bg.png); 
background-repeat: no-repeat, no-repeat; 
background-position: center 10px, 0 0; 
display: block; 
height: 102px; 
margin: 0px auto; 
text-indent: -9999px; 
width: 171px;
}

}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) { 
div.desktop { visibility: hidden; display: none;}
div.mobile { visibility: visible; display: block;}
span.desktop { visibility: hidden; display: none;}
span.mobile { visibility: visible; display: block;}
ul.desktop { visibility: hidden; display: none;}
ul.mobile { visibility: visible; display: block;}
a.desktop { visibility: hidden; display: none;}
a.mobile { visibility: visible; display: inline-block;}
img.desktop { visibility: hidden; display: none;}
img.mobile { visibility: visible; display: inline-block;}

.flex-caption { visibility: hidden; display: none;}

div.mobile-footer { text-align: center; visibility: visible; display: block; padding-top: 20px;}

div.social-top { visibility: hidden; display: none;}
div.social-footer { text-align: center; visibility: visible; display: block; padding: 10px 0px;}
ul#lang li{ display: inline block; clear: both; float: none; background: none; margin:0 auto; padding:0 auto;}
ul#lang li:last-child{ background:none; padding:0;}
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
body{ margin-top:0; height: 100%; }
header{ height:160px; position:relative;}
#back{ display: block; position:absolute; right:70px; top:6px; width:80px;}
#wxWrap{ float:left;}
ul#lang li{ display: inline block; clear: both; float: none; background: none; margin:0 auto; padding:0 auto;}
ul#lang li:last-child{ background:none; padding:0;}

ul#lang{ color:#ffffff; }
ul#lang a{ color:#ffffff; text-decoration:none;}
ul#lang a:hover{ color:#ffffff;}
#banner_home h2{ color:#636363; font-size:26px; margin-bottom:0; }
#banner_home .four.columns{ text-align:center;}

ul#nav-footer{ text-align:center; width:100%;}
ul#nav-footer li{ background:url(/img/menu_footer_divider.png) left center no-repeat; display:inline; float:none; margin-right:0px; padding-left:5px;}
ul#nav-footer li:first-child{ background:none;}

.copy { float: none; text-align: center; }

body.full header{ background:#efefef url(/img/bg_header.png) repeat-x left -20px; border-bottom:1px solid #e6e6e6; height:38px; width:100%; z-index:2;}
body.full .four.columns{ float:left; margin-left:-25px; width:160px;}
body.full ul#lang a, #back a{ color:#ffffff; text-decoration:none;}
body.full ul#lang a:hover, #back a:hover{ color:#fff;}
body.full nav{ display:none;}
body.full #wxWrap{ display:none;}
body.full .twelve.columns{ float:right; margin-right:-20px; margin-top:8px; width:90px;}
body.full .twelve.columns ul#lang{ float:right;}
body.full .twelve.columns ul#lang{ margin:0; padding:0;}
body.full #logo a{ background:url(/img/logo_2.png) no-repeat 0 0; display:block; height:55px; margin:5px auto; text-indent:-9999px; width:100px;}
body.full #logohttps a{ background:url(https://miura.websitewelcome.com/~innofthe/img/logo_2.png) no-repeat 0 0; display:block; height:55px; margin:5px auto; text-indent:-9999px; width:100px;}

body.full #logo-test a{ 
background:url(/img/logo_2.png), url(/img/logo_bg.png);
background-repeat: no-repeat;
background-position: center;
display:block; 
height:85px; 
margin: 0px auto; 
text-indent: -9999px; 
width: 130px;
}

body.full #slidecaption{ background:#fff; bottom:2%; box-shadow:0 1px 5px rgba(0,0,0,.5); font-size:1.30em; line-height:7px; -moz-box-shadow:0 1px 5px rgba(0,0,0,.5); padding:10px; position:absolute; right:2%; text-align:right; -webkit-box-shadow:0 1px 5px rgba(0,0,0,.5);}
body.full #slidecaption span{ color:#999; display:block; font-size:0.70em; margin-top:10px;}
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
body{ margin-top:0;}
header{ height:160px; position:relative;}
#lang li.hide-mobile{ visibility: hidden;}
ul#lang{ color:#fff;}
ul#lang a{ color:#fff; text-decoration:none;}
ul#lang a:hover{ color:#fff;}

ul#lang li{ display: inline block; clear: both; float: none; background: none; margin:0 auto; padding:0 auto;}
ul#lang li:last-child{ background:none; padding:0;}

#wxWrap{ float:left;}
ul#nav-footer{ text-align:center; width:100%;}
ul#nav-footer li{ background:none; float:none; margin-right:0; padding-left:0;}

.copy { float: none; text-align: center; }

/*.flex-caption {width: 35%; padding: 2%; position: absolute; left: 5px; bottom: 0; background: rgba(0,0,0,.6); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.5); font-size: 12px; line-height: 14px;}*/
.flex-caption { visibility: hidden; display: none;}

#banner_home h2{ color:#636363; font-size:18px; margin-bottom:0; text-align:center;}
#banner_home .four.columns{ text-align:center;}
.copy{ text-align:center;}
body.full header{ background:#efefef url(/img/bg_header.png) repeat-x left -20px; border-bottom:1px solid #e6e6e6; height:38px; width:100%; z-index:2;}
body.full .four.columns{ margin-left:-5px; width:160px;}
body.full ul#lang a{ color:#ffffff; text-decoration:none;}
body.full ul#lang a:hover{ color:#fff;}
body.full nav{ display:none;}
body.full #wxWrap{ display:none;}
body.full .twelve.columns{ float:right; position:absolute; right:-5px; top:8px; width:100px;}
body.full .twelve.columns ul#lang{ margin:0; padding:0;}
body.full #logo a{ background:url(/img/logo_2.png) no-repeat 0 0; display:block; height:55px; margin:5px auto; text-indent:-9999px; width:100px;}
body.full #logohttps a{ background:url(https://miura.websitewelcome.com/~innofthe/img/logo_2.png) no-repeat 0 0; display:block; height:55px; margin:5px auto; text-indent:-9999px; width:100px;}

body.full #logo-test a{ 
background:url(/img/logo_2.png), url(/img/logo_bg.png);
background-repeat: no-repeat; 
background-position: center; 
display:block; 
height:65px; 
margin:0px auto; 
text-indent:-9999px; 
width:110px;}

body.full #slidecaption{ background:#fff; bottom:2%; box-shadow:0 1px 5px rgba(0,0,0,.5); font-size:1.40em; line-height:12px; -moz-box-shadow:0 1px 5px rgba(0,0,0,.5); padding:10px; position:absolute; right:2%; text-align:right; -webkit-box-shadow:0 1px 5px rgba(0,0,0,.5); width:150px;}
body.full #slidecaption span{ color:#999; display:block; font-size:0.60em; margin-top:5px;}
}