* { color: #10447a; } /* TODO: replace/remove inline */
body { margin: 0; background: 50% 0 url(img/background.jpg) no-repeat; background-size: 100% 100%; }
.home { font-family: 'Oswald'; font-size: 13px; }
#header { height: 189px; }
#container { width: 1178px; margin: 0 auto; background: 50% 0 url(img/boardwalk.jpg) no-repeat #f8f2e7; min-height: 726px; box-shadow: 0 0 30px #999; }
#mmenu { height: 50px; margin: 0; background: #fff; width: 100%; display: inline-block; box-shadow: 0 0 14px #138dce; }
#mmenu ul { height: 50px; margin: 0; background: #fff; width: 65%; display: inline-block; padding: 0; font-weight: bold; margin-right: 5%; float: right; text-align: justify; overflow: hidden; font-size: 22px; line-height: 50px; }
#mmenu li { display: inline-block; }
#mmenu li a { text-transform: uppercase; text-decoration: none; color: #10447a; }
#mmenu li.spacer { width: 90%; }
#call { height: 44px; border-radius: 25px; border: 3px solid #fff; margin: 23px 6.4% 23px 0; float: right; line-height: 44px; color: #fff; font-size: 22px; padding: 0 12px 0 42px; font-weight: bold; background: #cd0000 8% 50% url(img/phone.png) no-repeat; }
#reservations { float: right; font-weight: bold; color: #fff; font-size: 20px; line-height: 20px; text-transform: uppercase; margin: 38px 10px 0 0; }
#logo { width: 172px; height: 160px; background: 0 0 url(img/logo.png) no-repeat; display: block; position: absolute; margin: 25px 0 0 116px; }

#map { width: 75%; margin: 0 auto; background: 0 0 url(img/map.png) no-repeat; height: 362px; overflow: visible; }
#calendar { width: 19%; float: right; }
#calendar h4 { color: #10447a; font-weight: bold; text-transform: uppercase; text-align: center; font-size: 140%; padding: 0; margin: 40px 0 4px 0; line-height: 20px; }
#calendar a, #map>a { width: 34px; height: 34px; background-color: #f5b000; border-radius: 17px; display: block; float: left; text-align: center; line-height: 34px; padding: 0; margin: 9px 5%; color: #fff; font-weight: bold; text-decoration: none; box-shadow: 3px 3px #10447a; border-top: 1px solid #fefca0; border-left: 1px solid #fefca0; }
.teaser { border: 6px solid #fff; border-radius: 18px; height: 134px; max-width: 382px; background: #fff; }
#calednar a:hover, #calendar a.selected { background-color: #ed1717; border-top: 1px solid #fefca0; border-color: #f99393; }
#calendar-loop { width: 5%; border: 4px dashed #10447a; float: right; border-radius: 0px 10px 10px 0; height: 200px; border-left: none; margin-top: 47px; overflow: visible; }
#calendar-loop>span { height: 100%; display: inline-block; }
#calendar-loop>b { color: #10447a; font-weight: bold; position: relative; top: 9px; right: 2px; font-size: 22px; line-height: 22px; }
#map>a { background-position: 50% 50%; background-image: url(img/boat.png); background-repeat: no-repeat; }
.teaser h4 { height: 37px; border-radius: 12px; background-color: #fcc40a; color: #10447a; text-transform: uppercase; margin: 0; width: 100%; text-indent: 165px; line-height: 37px; font-weight: bold; font-size: 140%; }
.teaser img { width: 152px; height: 133px; border-radius: 18px; position: absolute; z-index: 2; margin: -6px 0px 0 -6px; border: 6px solid #fff; }
.teaser p { width: 55%; margin: 8px 0; position: relative; left: 43%; line-height: 17px; height: 51px; overflow: hidden; }
.teaser .footer { text-indent: 160px; border-bottom: 2px solid #ed1717; width: 96%; display: inline-block; overflow: visible; float: right; margin-right: 10px; font-weight: bold; line-height: 28px; }
.teaser .more { text-indent: 0; line-height: 30px; color: #fff; text-transform: uppercase; border-radius: 8px 8px 8px 0; float: right; position: relative; top: 2px; left: 5px; text-decoration: none; height: 28px; line-height: 28px; padding: 0 32px 0 8px; font-weight: normal; background: #ed1717 90% 50% url(img/morearr.png) no-repeat; font-size: 120%; }
.mapbox { position: absolute; box-shadow: 0 0 15px #888; }
.mapbox .hr { width: 100%; display: inline-block;  height: 1px; border-top: 1px solid #eaeaea; margin: 8px 0; }
.mapbox span { color: #ed1717; float: right; text-transform: none; }
.mapbox a { text-decoration: none; font-size: 110%; text-transform: uppercase; }
.mapbox a:visited { color: inherit; }
.mapbox p { margin: 16px 20px 0 0px; line-height: 18px;  font-weight: bold; }

.hslider { width: 86%; text-align: center; margin: 0 auto; }
.hslider * { text-align: left; }
.hslider .teaser { display: inline-block; margin: 12px; }
.picmark { text-align: center; }
.hslider .mark, .picmark a { display: inline-block; width: 16px; height: 16px; border-radius: 8px; background-color: #fcc40a; overflow: hidden; font-size: 100px; margin: 5px; }
.hslider .selected, .picmark .selected { background-color: #10447a; }
.hslider .button { width: 40px; height: 40px; border-radius: 26px; border: 6px solid #10447a; display: inline-block; float: right; margin-top: 60px; background: 50% 50% url(img/rarrow.png) no-repeat; }
.hslider .back { float: left; background-image: url(img/larrow.png); }

#whatsup { border-bottom: 4px dashed #f5b000; text-align: center; margin: 50px 0 50px 0; }
#whatsup h3 { height: 44px; padding: 0 5px; border-radius: 22px; background-color: #f5b000; box-shadow: 1px 1px #888; border-top: 1px solid #fefca0; border-left: 1px solid #fefca0; display: inline-block; position: relative; top: 23px; margin: 0; line-height: 44px; font-size: 180%; text-transform: uppercase; }
#whatsup span { display: inline-block; width: 12px; height: 12px; margin: -6px 8px 0 8px; border-radius: 6px; background: 50% 90% url(img/boardwalk.jpg) no-repeat; vertical-align: middle; }

#splash { border-top: 4px dashed #10447a; margin: 60px 0 120px 0; }
#splash h3 { text-align: center; text-transform: uppercase; font-size: 175%; padding: 0; margin: 40px 0 0 0; }
#splash-body { display: table; font-family: Arial,Helvetica }
#splash-content { display: table-cell; width: 49%; text-align: center; vertical-align; top; line-height: 26px; font-style: italic; }
#splash-lquo, #splash-rquo { display: table-cell; font-size: 800%; color: #bfc8ce; text-align: right; font-weight: bold; vertical-align: top; line-height: 26px; position: relative; top: 26px; }
#splash-rquo { text-align: left; vertical-align: bottom; }

#footer { height: 92px; background-color: #10447a; }
#footer * { color: #fff; text-decoration: none; }
#footer-addr { margin-left: 83px; float: left; line-height: 15px; font-family: Arial,Helvetica,Sans-Serif; }
#footer-addr h4 { padding: 0; margin: 24px 0 3px 0; font-size: 140%; font-family: Oswald; }
#footer-menu { padding: 0 70px 0 0; background-color: #cb0606; line-height: 36px; display: inline-block; float: right; margin-top: 28px; }
#footer-menu li { display: inline-block; padding: 0 16px; font-size: 140%; font-weight: bold; text-transform: uppercase; }

/* sub page defs */

section { width: 73%; background: url(img/semiwhite.png); border-radius: 15px; margin: 0 auto; box-shadow: 0 10px 20px #ddd; }
.rejs .headerbg { height: 57px; width: 95%; margin: 0 0 66px 0; border-bottom: 4px dashed #10447a; overflow: visible; display: block; }
.rejs .h2bg { width: 12px; height: 9px; position: absolute; background: 0 0 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAJCAYAAAAGuM1UAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3wYZDTAj+BQ9PQAAAI1JREFUGNON0LEJAkEQheFvBTNhg0tMDMTMxDIErwRrULjUxBK2BVtQ2CaMbOUwFTS5FYM7uYGBYXj/vMeEnOITMyNrgh3uY4EAOcUKB5wHdO+iDWWTUwzY4IbFv0jfK3XTPrDEBa/BSD8u6qYt8x4nrAeBHmiFY9f9QIGgblo5xSm2XcwqjH1nTnGO6web/iBhO+UqYwAAAABJRU5ErkJggg==) no-repeat; margin: 77px 0 0 -12px; }
.rejs h2 { height: 48px; background-color: #fac20a; padding: 0 18px 0 38px; line-height: 48px; border-radius: 0 14px 14px 0; text-transform: uppercase; font-size: 175%; display: inline-block; border-bottom: 2px solid #c79c00; margin: 28px 0 0 -13px; box-shadow: 4px 4px 8px #ccc; }
.rejs .seal { width: 94px; height: 94px; border-radius: 47px; background-color: #cd0000; border-bottom: 2px solid #800000; box-shadow: 4px 4px 8px #ccc; float: right; position: relative; left: 4%; margin-top: 16px; }
.rejs .seal div { transform: rotate(20deg); -webkit-transform: rotate(20deg); -ms-transform: rotate(20deg); color: #fff; font-size: 22px; line-height: 26px; font-weight: bold; text-align: center; padding: 15px 0 0 4px; }
.rejs .seal span { font-size: 18px; color: inherit; }
.rejs .bigpic { position: relative; width: 78%; height: 267px; overflow: hidden; border-radius: 8px; margin: 0 auto; display: block; text-align: center; }
.rejs .bigpic img { position: absolute; left: 50%; top: 50%; width: 100%; width: auto; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

.rejs #splash { border: none; }
.rejs p { font-family: Arial,Helvetica,Sans-Serif; line-height: 22px; }
.rejs>p { margin: 0 55px 0 64px; }

.section { border-top: 4px dashed #e1d4bb; text-align: center; margin: 100px 0 50px 0; }
.section h3 { height: 44px; padding: 0 5px; border-radius: 22px; background-color: #cd0000; display: inline-block; position: relative; bottom: 23px; margin: 0; line-height: 44px; font-size: 180%; text-transform: uppercase; color: #fff; }
.section h3 span { display: inline-block; width: 12px; height: 12px; margin: -6px 8px 0 8px; border-radius: 6px; background-color: #fff; vertical-align: middle; }

.schedule dl { margin: 0 44px 0 64px; text-align: left; } 
.schedule dt { font-size: 175%; color: #10447a; text-transform: uppercase; font-weight: bold; margin: 0; padding: line-height: 55px; }
.schedule dt span { color: #cd0000; }
.schedule dd img { float: right; border-radius: 10px; margin: -20px 0 0 20px; }
.schedule dd { margin: 0; }
.schedule dd p { margin-top: 0; }
.schedule .deco { position: absolute; margin-left: -39px; width: 27px; height: 27px; background: 50% 50% url(img/deco-boat.png) no-repeat; }
.schedule .boat { background-image: url(img/deco-boat.png); }
.schedule .drink { background-image: url(img/deco-drink.png); }
.schedule .map { background-image: url(img/deco-map.png); }
.schedule .palm { background-image: url(img/deco-palm.png); }

.avail>div { margin-left: 64px; text-align: justify; }
.avslot { width: 45%; display: inline-block; margin: 35px 0; height: 69px; line-height: 34px; text-transform: uppercase; font-size: 140%; font-weight: bold; }
.avslot span { color: #cd0000; }
.avslot img { float: left; margin-right: 15px; width: 170px; height: 140px; border-radius: 10px; }
.avslot .overlay { width: 170px; height: 33px; border-radius: 0 0 10px 10px; text-align: center; color: #fff; line-height: 33px; overflow: hidden; position: absolute; margin-top: 107px; z-index: 1; background-color: #10447a; }
.avslot .wcdude { width: 16px; height: 30px; display: inline-block; background: 0 50% url(img/wcdude.png) no-repeat; }
.avslot .gray { background-image: url(img/wcdude-gray.png); }
.avslot .red { background-image: url(img/wcdude-red.png); }
.avail .spacer { width: 90%; display: inline-block; padding: 30px 0; }