*{margin:0;padding:0;border:0;outline:none;}

@viewport{ width:device-width;}
@-ms-viewport{width:devide-width;} /* for microsoft device */
@-o-viewport{width:devide-width;} /* for old opera device */

/* 320px-480px */
@media only screen and (max-width:580px)
{ 
#headbg { width:100%; margin:0 auto; position:relative; background:#fff;}
.logo {margin:0 auto; width:198px; margin-bottom:15px; margin-top:15px; float:none; }
.call, .call a { text-align:center; color:#000; text-decoration:none; float:none; margin-top:8px; clear:both; } 
#top, .reserve, .wyh{ margin:0 auto; width:90%; margin-bottom:5px; float:none; text-align:center; padding:8px 0;}
#menu, #bk {float:left; margin:5px 2px 15px 2px; width:auto;}
.room2, .picright, .picleft, .att {float:none; margin:0 auto; width:90%; margin-top:12px;}
.at, .bx, .bk, #feature  {float:none; margin:0 auto; width:98%; margin-top:12px;}
.check1{ margin:6px 10px; float:left; width:42%; }
.atxx {float:none; margin:0 auto; width:86%; padding:12px 12px;}
.footer-col, .footer-co, .video, .col, .colt  {float:none; width:98%; margin:0 auto;}
.vid  { float:none; width:98%; margin:0 auto; /*position:relative; padding-bottom:56%; margin-top:3%; clear:both; */}
.attrac_text { font-size: 34px!important; padding:20px 0; line-height:38px;}
.ft { width: 42%; float: left;}
.plc {width:90%; background:#AD0C24; margin:0 auto;}
.one:hover { background-color:#FFF200; color:#333;}
.content { margin: 0 auto; text-align:center; position:static;  left:10%; right:10%;  z-index: 20; line-height:32px; background: rgba(0, 0, 0, 0.6); color: #fff; font-size:17px;
    width:80%; padding: 22px 28px;}
.t1 { text-decoration: none; color:#fff; font-weight: bold;  font-size:26px; padding:10px 0; text-shadow: 5px 5px 10px #000; margin-bottom:3%; letter-spacing:2px;}
}
@media only screen and (min-width:581px) and (max-width:767px)
{
#headbg { width:100%; margin:0 auto; position:relative; background:#fff;}
.logo {margin:0 auto; width:198px; margin-bottom:15px; margin-top:15px; float:none; }
.call, .call a { text-align:center; color:#000; text-decoration:none; float:none; margin-top:8px; clear:both; } 
#top, .reserve, .wyh{ margin:0 auto; width:90%; margin-bottom:5px; float:none; text-align:center; padding:8px 0;}
#menu, #bk {float:left; margin:5px 2px 15px 2px; width:auto;}
.room2, .picright, .picleft, .att {float:none; margin:0 auto; width:90%; margin-top:12px;}
.at, .bx, .bk, #feature  {float:none; margin:0 auto; width:98%; margin-top:12px;}
.check1{ margin:6px 10px; float:left; width:42%; }
.atxx {float:none; margin:0 auto; width:86%; padding:12px 12px;}
.footer-col, .footer-co, .video, .col, .colt  {float:none; width:98%; margin:0 auto;}
.vid  { float:none; width:98%; margin:0 auto; /*position:relative; padding-bottom:56%; margin-top:3%; clear:both; */}
.attrac_text { font-size: 34px!important; padding:20px 0; line-height:38px;}
.ft { width: 42%; float: left;}
.plc {width:90%; background:#AD0C24; margin:0 auto;}
.one:hover { background-color:#FFF200; color:#333;}
.content { margin: 0 auto; text-align:center; position:static;  left:10%; right:10%;  z-index: 20; line-height:32px; background: rgba(0, 0, 0, 0.6); color: #fff; font-size:17px;
    width:80%; padding: 22px 28px;}
.t1 { text-decoration: none; color:#fff; font-weight: bold;  font-size:26px; padding:10px 0; text-shadow: 5px 5px 10px #000; margin-bottom:3%; letter-spacing:2px;}
}
	

@media only screen and (min-width:768px) and (max-width:1024px)
{
#top{width:45%; float:right;}
.atxx { width:42%; float:right;}
.reserve { margin:0 auto; width:90%; margin-bottom:5px; float:none; text-align:center;}
.imenu { width:92%; margin:0 auto; }
.check1{ margin:6px 10px; float:left; width:14%; }
.footer-co  {float:left; width:62%;}
.footer-col {float:left; width:100%;}
.col, .colt{ width:42%; margin:20px;}
.ft { width:26%; float: left;}
.one { text-align:center; float:none;  width:90%; padding:15px 12px; font-size:17px; color:#fff; line-height:28px;}
.brd { border-right: none;}
.brb { border-bottom: solid 1px #ddd;}
}

@media only screen and (min-width:1025px) and (max-width:1280px)
{
#top{width:35%; float:right;}
#menu{float:right; width:75%; }
}