.btn-avail-wrap {display: block;}
.btns {-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; display: inline-block; color: #fff; font-weight: bold; text-decoration: none;}
.btns:hover {color: #fff;}
#rsv { -moz-box-shadow: inset 0px 1px 0px 0px #cae3fc; -webkit-box-shadow: inset 0px 1px 0px 0px #cae3fc; box-shadow: inset 0px 1px 0px 0px #cae3fc; background-color: #54A72A; border: 1px solid #469df5; text-shadow: 1px 1px 0px #287ace; }
#rsv:hover {background-color: #95DC72;}
.flex-map {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; border: 1px solid #ccc;}
.flex-map iframe, .flex-mapobject, .flex-map embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#sgn {display: block; margin-right: auto; margin-left: 0px;}
.p7QC {zoom: 1;}
.p7QC:before, .p7QC:after {content: "."; display: block; height: 0; overflow: hidden;}
.p7QC:after {clear: both;}
 @media (max-width: 480px) {
.p7QC .percent24 {width: 98%; margin-left: auto; margin-right: auto;}
.p7QC .percent72 {width: 98%; margin-left: auto; margin-right: auto;}
.btn-avail-wrap {text-align: left;}
.btns {font-size: 1.3em; padding: 6px 10px; margin-left: 0px; margin-right: auto;}
#rsv {margin-bottom: 15px;}
#pix {display: none;}
}
 @media (min-width: 481px) {
.btns {font-size: 1.3em; padding: 6px 10px; margin-left: auto;}
#rsv {margin-bottom: 15px;}
#pix {display: block; width: 40%; max-width: 152px; float: right; padding-top: 35px; margin-right: 0px; margin-left: 25px; margin-bottom: 20px; background: url(../_img/ele/icn-magf.png) no-repeat left top;}
#pix img {width: 100% !important; max-width: 152px;}
ul.gallery {list-style: none; width: auto; max-width: 220px;}
ul.gallery li a {position: relative; float: left; padding: 5%; background: #eee; border: 1px solid #fff; -moz-box-shadow: 0px 2px 15px #333;}
/* IE10 and lower can't see all CSS3 effects,
so give imgs btm padding */
.ie-all ul.gallery li a {margin-bottom: 15px;}
ul.gallery li a.pic-1 {z-index: 1; -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg);}
ul.gallery li a.pic-2 {z-index: 5; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg);}
ul.gallery li a.pic-3 {z-index: 3; -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg);}
ul.gallery li a.pic-4 {z-index: 4; -webkit-transform: rotate(14deg); -moz-transform: rotate(14deg);}
ul.gallery li a.pic-5 {z-index: 2; -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg);}
ul.gallery li a.pic-6 {z-index: 6; -webkit-transform: rotate(5deg); -moz-transform: rotate(5deg);}
ul.gallery li a:hover {z-index: 10; -moz-box-shadow: 3px 5px 15px #333; background: #C4D8E6;}
}
 @media (min-width:600px) {
.p7QC .percent24 {float: left; width: 24%; margin-right: 0;}
.p7QC .percent72 {float: left; width: 72%; margin-right: 4%;}
.btn-avail-wrap {text-align: center;}
.btns {font-size: 1.4em; padding: 6px 12px;}
#rsv {margin-bottom: 0px;}
}
@media (min-width: 768px) {
#pix {width: 30%; max-width: 220px;}
#pix img {max-width: 220px;}
.btns {padding: 6px 15px;}
}