*{margin: 0px; padding: 0px; outline: none;}
html, button, input, select, textarea {color: #222; font-family: Arial, sans-serif;}
audio, canvas, img, video {vertical-align: middle;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;}
audio, canvas, video {display: inline-block; *display: inline; *zoom: 1;}
html {font-size: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;}
html, button, input, select, textarea {font-family: sans-serif;}
body {margin: 0; font-family: 'Source Sans Pro', sans-serif;}

/* Typography */
h1, h2, h3{margin: 0px 0px 10px 0px; font-weight: normal;}
h1{font-size: 19px; line-height: 30px; }
h2{}
h3{}

p{font-size: 19px; line-height: 30px; margin-bottom: 10px;}
a{text-decoration: none; color: #27659e;}
a:hover{}
a img{outline: none; border: none;}
a:focus {outline: none;}

a.large-link{font-size: 19px; text-transform: uppercase; font-weight: 600; padding: 11px 25px 10px 0px; background: url(../img/btn-blue-arrow.png) no-repeat right center;}
a.large-link:hover{background-image: url(../img/btn-blue-arrow-hover.png); color: #ab4a33;}

ul{margin: 0px 0px 10px 0px; padding: 0px 0px 0px 16px;}
ol{margin: 0px 0px 10px 0px; padding: 0px 0px 0px 16px;}
li{margin: 0px 0px 7px 0px; padding: 0px 0px 0px 0px; font-size: 15px; line-height: 22px;}

textarea {overflow: auto; vertical-align: top;}

sup, sub {vertical-align: baseline; position: relative; top: -0.4em;}
sub { top: 0.4em; }

::-moz-selection {background: #b3d4fc; text-shadow: none;}
::selection {background: #b3d4fc; text-shadow: none;}

/* Color Classes */
.white{color: #fff;}
.black{color: #000;}

/* Base Styles */
.left{float: left;}
.right{float: right;}
.clear{clear: both;}
.first{margin-left: 0 !important;}
.last{margin-right: 0 !important;}
img{vertical-align: middle;}
fieldset{ border: 0; margin: 0; padding: 0;}
.bold{font-weight: bold;}
.italic{font-style: italic;}
.underline{font-style: underline;}
b, strong {font-weight: bold;}

.wrapper{width: auto; display: block; min-width: 1024px;}
.max-width{max-width: 1024px; margin: 0 auto; position: relative;}

/* Site Styles */
.full-bkg{background-size: cover; -moz-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-position: center;}
.full{width:100%; height:100%; position: relative; min-width: 1124px; min-height: 600px; max-height: 850px;}
.full-height{height: 100%; position: relative; min-height: 600px; max-height: 850px;}

.bkg-wrap{background: #fff; min-width: 1124px;}
.container{max-width: 900px !important; min-width: 300px !important; margin: 0 auto; padding-left: 50px; padding-right: 50px;}

#large-1-bkg{background-image: url(../img/bkg-top.jpg);}
#large-2-bkg{background-image: url(../img/bkg-top-two.jpg);}
#large-3-bkg{background-image: url(../img/bkg-top-3.jpg);}
#large-4-bkg{background-image: url(../img/bkg-top-four.jpg);}
#large-5-bkg{background-image: url(../img/bkg-top-five.jpg);}
#large-6-bkg{background-image: url(../img/bkg-top-six.jpg);}

.fade{position: absolute; top: 0px; left: 0px; z-index: 1;}

#large-img .container{position: relative; z-index: 100 !important;}


header{background: url(../img/bkg-header.png) repeat; width: 225px; height: 800px; display: block; float: left; position: relative;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}

#head-center{height: 500px; display: block; width: 304px; position: absolute;  left: -39px;}
#logo{position: absolute; top: 0px; left: 0px;}
.tagline{color: #fff; text-align: center; font-size: 18px; font-style: italic; position: relative; top: 195px; left: 0px; display: block; width: 200px; margin: 0 auto;}
nav{position: relative; top: 230px; width: 180px; font-size: 20px; text-align: right; text-transform: uppercase; padding: 10px; margin: 0 auto; display: block;}
nav a{color: #fff; display: block; float: right; text-align: right; clear: both; border-bottom: 2px dashed #fff; width: 100%; padding: 7px 0px 7px 0px; opacity: 0.7; transition: all 0.2s linear 0s; margin-bottom: 2px;}
.no-touch nav a:hover{opacity: 1;}
nav a.last{border: none;}




#about {padding-top: 75px; padding-bottom: 75px;}
#about .left{width: 550px; height: auto;}
#about .right{width: 300px; height: auto;}


#attractions{background: url(../img/canton-cove-marina-images.jpg) center center; display: block; height: 460px;  min-width: 1124px;}
#attractions-left{float: left; background: transparent; width: 50%; height: 460px;}
#attractions-right{float: right; background: #27659e; width: 50%; height: 460px;}
#info-section{width: 500px; height: 460px; float: left; border-left: 2px solid #fff; overflow: hidden; position: relative;}
#slide{width: 1500px; height: 300px; position: absolute; top: 140px; left: -10px;}
#slide-left{float: left; width: 500px; height: 500px; position: relative;}
#slide-right{float: right; width: 500px; height: 500px;  position: relative;}
#info-section h2{color: #fff; font-size: 26px; font-style: italic; width: 420px; margin: 70px 0px 10px 40px; line-height: 30px;}
#info-list{margin: 15px 25px 25px 40px; position: relative;}
#info-list h3{display: block; width: 400px; color: #fff; text-align: left; border-bottom: 2px dashed #fff; padding: 13px; margin: 0px; background: url(../img/bkg-info-list-btn.png) right center no-repeat; cursor: pointer;}
#info-list h3:hover{background-image: url(../img/btn-open-hover.png); color: #f9ce8f; }
#info-list h3.last{border: none;}
.info-content{ position: absolute; top: 15px; left: 0px; height: 400px; width: 410px;  padding: 50px 20px 15px 40px;}
.info-feature{float: left; width: 150px; height: 150px; -webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);}
.info-content h4{color: #fff; font-size: 20px; float: left; margin-left: 15px; margin-bottom: 10px; margin-top: 5px;}
.info-content p{color: #fff; float: left; margin-left: 15px; width: 220px; font-size: 17px; line-height: 20px;}
.btn-close{position: absolute; top: 5px; right: 10px; color: #5284b1; padding: 12px 33px 10px 5px; text-transform: uppercase; background: url(../img/btn-close.png) right center no-repeat; cursor: pointer;}
.info-content p a{color: #fff; text-decoration: underline;}
.btn-close:hover{background-image: url(../img/btn-close-hover.png); color: #e89280;}



#location{min-width: 1124px; width: 100%; position: relative;}
#location #map-canvas{min-width: 1124px; z-index: 1; position: relative; width: 100%; height: 450px;}

#location .container{ z-index: 100; position: relative; height: 5px; top: -10px !important;}
#address{width: 200px; height: 450px; display: block; position: absolute; top: -440px; right: 45px; z-index: 105; background: url(../img/bkg-address.png) repeat; 
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);}

#address #address-logo{ position: relative; top: 120px; left: 18px;
}
#address p{text-align: center; color: #211f1d; margin-top: 10px;}
.rope{width: 110px; height: 3px; display: block; margin: 0 auto; background: url(../img/rope.png) no-repeat;}
#first-rope{margin-top: 150px;}

#address .large-link{top: 20px; left: 40px; position: relative;}



#slip-availability{width: auto; min-width: 1124px; height: auto; display: block; background: #fff; text-align: center; padding: 50px 0px 50px 0px;}
#slip-availability h2{font-size: 50px; font-style: italic; color: #625741; margin-bottom: 10px; line-height: 54px;}
#slip-availability p{font-size: 20px; color: #625741; font-style: italic; margin-top: 0px;}

#slips{background: #27659e; min-width: 1124px; display: block; margin-top: -10px; padding: 75px 0px 75px 0px;}

#slips .container{max-width: 1124px !important; padding-left: 0px; padding-right: 0px;}

#slip-header{width: 400px; margin: 0 auto; text-align: center;}
#slip-header h2{text-transform: uppercase; font-weight: 700; margin-top: 5px;}
#slip-unavailable{float: left;}
#slip-available{float: right;}

#slip-unavailable h2{color: #6699cc;}
#slip-available h2{color: #89db89;}

#slip-map{position: relative;}
#slip-map img{margin-top: -50px;}

#control{ width: 1124px; height: 940px; position: absolute; top: 0px; left: 0px;}
.slip{width: 66px; height: 123px; display: block; position: absolute; z-index: 100; background-repeat: no-repeat;}
.slip-available{background-position: 0px -125px;}
.slip-available:hover{background-position: 0px -250px; cursor: pointer;}
.slip-row-1{top: 200px;}
.slip-row-2{top: 453px;}
.slip-row-3{top: 725px;}

.slip-column-1{left: 66px;}
.slip-column-2{left: 168px;}
.slip-column-3{left: 274px;}
.slip-column-4{left: 378px;}
.slip-column-5{left: 483px;}
.slip-column-6{left: 589px;}
.slip-column-7{left: 694px;}
.slip-column-8{left: 799px;}
.slip-column-9{left: 904px;}
.slip-column-10{left: 1009px;}



#slip-10{background-image: url(../img/slip-10.png);}
#slip-9{background-image: url(../img/slip-9.png);}
#slip-8{background-image: url(../img/slip-8.png);}
#slip-7{background-image: url(../img/slip-7.png);}
#slip-6{background-image: url(../img/slip-6.png);}
#slip-5{background-image: url(../img/slip-5.png);}
#slip-4{background-image: url(../img/slip-4.png);}
#slip-3{background-image: url(../img/slip-3.png);}
#slip-2{background-image: url(../img/slip-2.png);}
#slip-1{background-image: url(../img/slip-1.png);}


#slip-20{background-image: url(../img/slip-20.png);}
#slip-19{background-image: url(../img/slip-19.png);}
#slip-18{background-image: url(../img/slip-18.png);}
#slip-17{background-image: url(../img/slip-17.png);}
#slip-16{background-image: url(../img/slip-16.png);}
#slip-15{background-image: url(../img/slip-15.png);}
#slip-14{background-image: url(../img/slip-14.png);}
#slip-13{background-image: url(../img/slip-13.png);}
#slip-12{background-image: url(../img/slip-12.png);}
#slip-11{background-image: url(../img/slip-11.png);}

#slip-30{background-image: url(../img/slip-30.png);}
#slip-29{background-image: url(../img/slip-29.png);}
#slip-28{background-image: url(../img/slip-28.png);}
#slip-27{background-image: url(../img/slip-27.png);}
#slip-26{background-image: url(../img/slip-26.png);}
#slip-25{background-image: url(../img/slip-25.png);}
#slip-24{background-image: url(../img/slip-24.png);}
#slip-23{background-image: url(../img/slip-23.png);}
#slip-22{background-image: url(../img/slip-22.png);}
#slip-21{background-image: url(../img/slip-21.png);}


.slip-info{width: 400px; height: auto; text-align: center; background: #fff; padding: 30px 25px 25px 25px; position: absolute; z-index: 200; left: 330px; top: 400px; 
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}
.contact-info-label{color: #9F9F9F; font-weight: 700;}
.slip-info p{line-height: 21px;}


.btn-close-info{position: absolute; top: 1px; right: 10px; color: #c1bebb; padding: 12px 33px 10px 5px; text-transform: uppercase; background: url(../img/btn-close-info.png) right center no-repeat; cursor: pointer;}
.btn-close-info:hover{background-image: url(../img/btn-close-info-hover.png); color: #e89280;}

footer{background: #fff; padding: 30px 0px 20px 0px; width:  auto; min-width: 1124px;}
footer .container{max-width: 1024px !important; padding-left: 0px; padding-right: 0px; margin: 0 auto;}
footer p{font-size: 16px;}


/* Print Styles */
@media print {
	*{background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important;}
	a, a:visited {text-decoration: underline;}
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid;}
	thead {display: table-header-group;}
	tr, img {page-break-inside: avoid;}
	img { max-width: 100% !important;}
	@page {margin: 0.5cm;}
	p, h2, h3 {orphans: 3; widows: 3;}
	h2, h3 {page-break-after: avoid;}
}