@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);

body {
		background:#f9f9f9;
		margin:0px auto !important; /* overwrite ejunkie */
		padding:0px !important;
		font-family: 'Open Sans', sans-serif !important;
		position:relative;
		font-size:16px;
		color:#333
		line-height:1.6;
}

.header {
		background:#e5e5e5;
		width:100%;
		float:left;
}

.header.home {
		padding-bottom:250px;
		margin-bottom:-280px;
}

.page-center {
		max-width:1280px;
		padding:0 20px;
		margin:auto;
		position:relative;
}

.page-wrapper {
		padding:30px 0;
		position:relative;
		z-index:999;
		width:100%;
		box-sizing:border-box;
		float:left;
}


#logo {
		margin:20px 0;
		float:left;
}

#logo:hover {
		opacity:.8;
}

#logo img {

}

/********* Global Links  **********/
a { color:#db2027; text-decoration:none; }
a:hover { text-decoration:underline; }

/********* Navigation Links **********/
#topnav {
		float:right;
		margin-top:75px;
}

#nav {
}

#nav ul {
		padding:0;
		float:right;
		clear:both;
		margin:0;
}

#nav ul li {
		list-style-type:none;
		float:left;
}

#nav a, .office-phone span {
		color:#333;
		margin-left:5px;
		margin-bottom:10px;
		padding:10px 0;
		float:left;
		font-size:16px;
		text-transform:uppercase;
		padding:5px 15px;
}

.office-phone span {
		font-weight:bold;
		padding-right:0;
		color:#666;
		display:block;
}

#nav a:hover, #nav li.active a {
		background:#f7f7f7;
		color:#db2027;
		text-decoration:none;
}

#social {
		right:20px;
		top:10px;
		position:absolute;
		text-align:center;
		clear:both;
}

#social a {
		width:32px;
		height:32px;
		margin:2px;
		display:inline-block;
}

#facebook { background:url('/img/facebook.png'); }
#twitter { background:url('/img/twitter.png'); }
#instagram { background:url('/img/instagram.png'); }

#social a:hover {
		opacity:.8;
}
/********* Footer **********/
#footer {
		font-size:14px;
		text-align:center;
		margin:100px 0 0;
		padding:100px 20px;
		color:#999;
		background:#333;
		clear:both;		
}

#footer p {
		margin-bottom:5px;
}

/********* Main Content **********/
#main_content, .wrapper {
		padding:0;
		min-height:400px;
		float:left;
		position:relative;
		z-index:0;
		width:100%;
}

#rotating_box {
		float:left;
		width:910px;
		height:402px;
		overflow:hidden;
}

#rotating_box .home_anything {
		width:910px;
		height:402px;
}

#rotating_box .home_video {
		margin:21px 21px 21px 40px;
}

h1 {
		font-weight:300;
		padding:30px 0 0;
		clear:both;
}

.home-slides-container {
		position:relative;
		width:100%;
		padding-top:56.25%;
		clear:both;
		padding-bottom:60px;
}

.home-slides {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
}

.home-slides .vimeo-slide {
		left:0;
		top:0;
		width:100%;
		height:100%;
		position:absolute;
		background-size:cover;
}

.home-slides .vimeo-iframe {
		width:100%;
		height:100%;
		position:absolute;
}

.slidesjs-pagination {
		list-style-type:none;
		padding:0;
		margin:0;
		font-size:40px;
		text-align:center;
		width:100%;
		float:left;
}

.slidesjs-pagination-item {
		display:inline-block;
		margin:0 10px 0 0;
}

.slidesjs-pagination-item a {
		padding:5px;
		text-decoration:none;
		float:left;
		line-height:1;
}

.slidesjs-pagination-item a.active {
		color:#666;
}

.slidesjs-pagination-item a:hover {
		color:#333;
}

.slides-container {
		width:100%;
		clear:both;
		position:relative;
}

.slidesjs-navigation {
		color:#fff;
		color:rgba(255,255,255,.9);
		position:absolute;
		top:50%;
		height:48px;
		margin-top:-48px;
		line-height:48px;
		z-index:9999;
		vertical-align:middle;
		font-size:48px;
		cursor:pointer;
		text-shadow:0 0 5px #000;
		font-family: 'Zapf Dingbats', 'Open Sans', sans-serif;
}

.slidesjs-previous {
		left:10px;
}

.slidesjs-next {
		right:10px;
}

.slidesjs-navigation:hover {
		text-decoration:none;
}

.boat-slide {
		
}

.boat-slide img {
		width:100%;
}

.boat-slide span {
		background:rgba(0,0,0,.5);
		position:absolute;
		right:0;
		top:0;
		color:#fff;
		padding:20px 50px;
}

.boat-slide h1 {
		margin:0;
		font-weight:400;
}


.products-slides-container {
		position:relative;
		width:47.5%;
		clear:both;
		padding-bottom:60px;
		float:right;
		margin-left:5%;
}

.products-slides-container img {
		width:100%;
}



/********* Image Grid **********/
.grid_wrapper {
		width:calc(100% + 10px);
}
.image_grid {
		float:left;
		margin:0px 10px 10px 0; 
		position:relative;
		width:25%;
		width:calc(25% - 10px);
}

.image_grid:hover { opacity:.8; }

.image_grid img {
		width:100%;
}

.image_grid.boats {
		width:30%;
		width:calc(50% - 10px);
}

.boutique {
}

.image_grid .vessel_name {
		position:absolute;
		width:100%;
		padding:10px 5%;
		box-sizing:border-box;
		background:#eee;
		background:rgba(255,255,255,.8);
		bottom:0;
		left:0;
		text-align:center;
		font-weight:bold;
		min-height:72px;
		color:#333;
		font-weight:normal;
		font-size:18px;
}

.image_grid.boats .vessel_name {
		font-size:24px;
}

.image_grid.sold a:before {
		content:'Sold';
		position:absolute;
		top:5%;
		left:5%;
		right:5%;
		text-align:right;
		color:#fff;
		color:rgba(255,255,255,.8);
		font-weight:bold;
		font-size:64px;
		line-height:1;
		text-transform:uppercase;
}

.image_grid.pending a:before {
		content:'Pending';
		position:absolute;
		top:5%;
		left:5%;
		right:5%;
		text-align:right;
		color:#fff;
		color:rgba(255,255,255,.8);
		font-weight:bold;
		font-size:52px;
		line-height:1;
		text-transform:uppercase;
}

.image_grid.reduced a:before {
		content:'Reduced Price';
		position:absolute;
		top:5%;
		left:5%;
		right:5%;
		text-align:right;
		color:#fff;
		color:rgba(255,255,255,.8);
		font-weight:bold;
		font-size:42px;
		line-height:1;
		text-transform:uppercase;
}

.image_grid.overhauled a:before {
		content:'Being Overhauled';
		position:absolute;
		top:5%;
		left:5%;
		right:5%;
		text-align:right;
		color:#fff;
		color:rgba(255,255,255,.8);
		font-weight:bold;
		font-size:36px;
		line-height:1;
		text-transform:uppercase;
}

#EJEJC_window form div {
		width:auto;
		margin:auto;
}

#EJEJC_window form input { float:none; }

/********* Pikachoose ********* May need to override from the pikachoose css*/
#thumbnails {
		float:left;
		clear:both;
		height:105px;
		margin-top:15px;
		width:100%;
		overflow:hidden;
		padding:5px 0;
}

#thumbnails img {
		height:auto !important;
		width:215px !important;
}

#thumbnails ul li {
		width:auto;
		padding:0;
		margin:5px 0 5px 10px;
}

#thumbnails .clip {
		width:215px;
		overflow:hidden;
		background:#000;
		position:relative;
}

#rotating_box h1, #rotating_box h2 {
		color:#fff;
		margin:0px;
		font-family: 'Open Sans', sans-serif;
		background:none;
		text-align:left;
		padding:0;
}

#rotating_box .caption {
		right:10px;
		left:auto !important;
		border-radius:0 !important;
		
}
#rotating_box .caption h1 { font-size:32px; }
#rotating_box .caption h2 { 
		font-size:14px; 
		text-transform:uppercase;  
		margin-top:3px;
		font-weight:bold;
		font-family: 'Open Sans', sans-serif;
}

#rotating_box img {

}

#news_pikame {
		position:relative;
		clear:both;
		margin-top:20px;
		width:100%;
}

#news_pikame .pika-stage {
		height:358px;
		border:0;
		padding:0;
		width:100%;
		background:#ccc;
}

#news_pikame .pika-aniwrap { position: absolute; top:0; }
#news_pikame .pika-textnav { display:none; }
#news_pikame .pika-stage img { position:absolute; top:0; display:block; }
#news_pikame .pika-imgnav a { position:absolute; }
#news_pikame a.previous { left:0; top:10px; }
#news_pikame a.next { right:0; top:10px; }
#news_pikame .caption { display:none; }

#news_pikame .jcarousel-container-horizontal {
		width:600px;
		clear:both;
		padding:0;
		padding-top:10px;
}

#news_pikame .jcarousel-clip-horizontal {
		width:auto;
}

#news_pikame .jcarousel-item-horizontal { 
		margin:0 10px 0 0; 
		padding:0;
		border:0;
		background:#333;
}

/********* Sub_content **********/
.sub_content {
		clear:both;
		width:100%;
		margin-top:15px;
		float:left;
		position:relative;
		color:#333;
		line-height:1.6;
}

.sub_content .feature_head,
.sub_content .feature_more {
		background:#0a2844;
		float:left;
		color:#fff;
		width:100%;
		font-family: 'Open Sans', sans-serif;
		box-sizing:border-box;
}
.sub_content .feature_head {
		padding:0 15px;
		margin-bottom:15px;
}
.sub_content .feature_more {
		margin-top:8px;
}

.sub_content .feature_head h2 {
		font-weight:normal;
		font-size:20px;
		color:#fff;

}

.sub_content .half {
		width:46%;
		padding:0 2%;
		float:left;
}

.sub_content .feature_content {
		border-bottom:1px solid #eee;
		clear:both;
		float:left;
		width:100%;
}

.sub_content .feature_content:last-child {
		border-bottom:none;
}

.sub_content .feature_content div.label {
		float:left;
		font-weight:600;
		width:200px;
		text-transform:uppercase;
		clear:both;
		font-size:90%
}

.sub_content .feature_content div {
		float:left;
		padding:10px 0;
		width:calc(100% - 220px);
}

.sub_content .feature_content.full div {
		width:100%;
}

.sub_content .feature_content:first-child div {
		border:0;
}

/********* Home Content ******* May need to override Main Content styles */
#office_phone {
		font-weight:400;
		float:right;
		color:#999;
		margin-top:10px;
}

#home_content {
		clear:both;
		margin-top:15px;
		float:left;
		width:100%;
}

#home_content .home_feature {
		float:left;
}

#featured_powerboats {
		width:40%;
		margin-right:2%;
}

#news {
		width:58%;
}

#home_content .feature_head {
		background:#0a2844;
		padding:0 10px;
}
#home_content .feature_head{

}
#home_content .feature_more {
		display:block;
		clear:both;
		text-align:right;
}
#home_content h1 { margin:0; font-size:20px; padding:10px 0; } 
#home_content h1 a {
		color:#fff;
		font-weight:normal;
		margin:0;
}

#home_content .feature_content {
		color:#333;
		margin:10px 0 20px;
		font-size:14px;
}

#home_content .feature_text {
		padding:25px;
		background:#eee;
}

#home_content h2 {
		font-weight:400;
		margin:0;
}

#home_content #featured_powerboats .feature_content h2 {
}
#home_content #news .feature_content h2 {
}
#home_content #news .feature_content p {
		margin:0;
		padding:5px 0 10px;
		line-height:1.6;
}
#home_content img {
		display:block;
		margin-right:5px;
		width:100%;
}

#home_content ul {
		line-height:1.6;
}

#home_content ul li {

}

#home_content .price {
		margin-top:15px;
		text-align:right;
}

/********* News Posts **********/
#main_content .article {
		padding-bottom:10px;
		color:#333;
		margin:20px 0;
		line-height:1.6;
		clear:both;
}

#main_content .article h2 {
		padding:10px 15px 8px;
		margin-bottom:15px;
		background:#0a2844;
		color:#fff;
		font-weight:400;
}

#main_content .article p {
		margin:0 15px;
}

#main_content .article img {
		clear:both;
		float:left;
}

/********* Boutique **********/
.product {
		clear:both;
		margin-bottom:20px;
		float:left;
		width:100%;
}
.product > img:first-child {
		float:left;
		margin:0 10px 0 0;
}
.product p { margin-top:15px; }

.product form { margin:15px 0 0; }
.product form input { margin:15px 0 0; float:none; }

#EJEJC_overlay { background:none !important; }
#EJEJC_window { padding:10px; }

.product #news_pikame {
		margin-top:0;
}

.product #news_pikame .pika-stage {
		width:auto;
		height:300px;
		margin-right:15px;
}

.product #news_pikame .jcarousel-skin-pika .jcarousel-container-horizontal {
		width:293px;
} 


/********* Contact **********/
#contact-map {
		width:100%;
}

#contact_content {
		margin-top:15px;
}

#contact_content .half {
		width:46%;
		padding:0 2%;
		float:left;
		position:relative;
}
#contact_content .half:first-child {
		margin-left:0;
}

#contact_content h2 {
		background:#0a2844;
		padding:5px 15px;
		color:#fff;
		font-family: 'Open Sans', sans-serif;
		font-size:14px;
		font-weight:normal;
}

#contact_content .contact_text {
		font-size:14px;
		line-height:1.6;
}

#contact_content .contact_text p { margin-bottom:15px; }

#contact_content .contact_text ul {
		list-style-type:none;
		margin:0 0 15px;
		padding:0;
}

#contact_content form { margin:0; }
#contact_content form label { margin:0; }
#contact_content form input, #contact_content form textarea { 
		float:none; 
		width:97%;
		padding:3px 1%;
}
#contact_content form div { 
		margin:0; 
		width:auto; 
		float:none; 
		padding:0; 
		background:none; 
		border:0;
		margin-bottom:5px;
}
#contact_content form input[type=submit] { width:auto; float:right; }

.feedback_response { color:red; }
/********* Admin Backend **********/
.admin form {
		margin:50px auto;
		background:#ccc;
		max-width:700px;
		width:100%;
}

.admin form div {
		clear:both;
		float:left;
		margin:5px 0;
		padding:2px;
		width:100%;`
}

form .button button {
		float:right;
}

form div div.error-message {
		width:auto;
		background:none;
		color:#db2027;
		font-weight:bold;
		font-size:12px;
		float:right;
		border:0;
		text-align:right;
		margin:10px 5px 5px;
}

.admin form label {
		float:left;
		width:100%;
		margin:3px 0;
		font-size:13px;
		color:#666;
}

.admin form .text input, .admin form .password input {
		width:100%;
		padding:5px 0;
}

.admin form textarea {
		width:100%;
		padding:0;
		border:1px solid #ccc;
		resize:none;
}

form .submit {
		float:left;
		clear:both;
}

h2 {
		font-size:20px;
		color:#666;
}

/********* Blog Posts Backend **********/
#PostContent {
		height:500px;
}

.post_summary {
		margin-top:25px;
		text-align:left;
}
.post_summary .headline{
		clear:both;
		float:left;
		font-size:18px;
		padding:10px;
}
.post_summary .content {
		clear:both;
		float:left;
		padding:5px 10px;
}
.post_summary .last_modified {
		text-align:right;
		float:right;
		clear:both;
		font-size:12px;
		padding:5px;
}

/********* Edit/Delete Backend **********/
#flash_content {
		position:absolute;
		right:20px;
		top:20px;
		width:500px;
		height:100px;
		color:#DC382A;
		font-size:18px;
		font-weight:bold;
		text-align:right;
		vertical-align:middle;
}

.admin .delete_description {
		text-align:left;
		margin-top:30px;
		margin-bottom:0;
		font-family: 'Open Sans', sans-serif;
}

.delete_description .vessel {
		margin:5px 10px;
		float:left;
		color:#DC382A;
		font-weight:bold;
		text-transform:uppercase;
		font-size:18px;
}

.delete_description span {
		float:left;
		margin:2px 10px;
		color:#666;
}

.delete_description .model, .delete_description .last_modified {
		clear:both;
}

.delete_description .label {
		clear:both;
		font-weight:bold;
		margin:0 5px 0 0;
		text-transform:uppercase;
}

.admin .photo_delete {
		margin-top:30px;
		clear:both;
		width:100%;
		float:left;
}

.admin .photo_delete img {
		width:100%;
}

#recaptcha_area {
    height:125px !important;
    overflow:hidden;
    margin:0 0 15px !important;
}

/* Responsive */
@media screen and (max-width: 1200px) {
		.header.home {
				padding-bottom:0;
				margin-bottom:0;
		}
		.image_grid {
				width:30%;
				width:calc(33.333% - 10px);
		}
				#logo {
				margin:25px;
				float:none;
		}

		#logo img {
				margin:auto;
				width:100%;
				max-width:300px;
				float:none;
				display:block;
		}
		#topnav {
				float:left;
				margin-top:50px;
		}
		#nav ul {
				text-align:center;
		}		
		
		#nav ul li {
				float:none;
				display:inline-block;
		}
	
		#nav ul li a, .office-phone span {
				margin:0 10px;
		}
}
@media screen and (max-width: 900px) {

		#social {
				width:100%;
				position:static;
				padding:0;
		}
		
		.page-wrapper {
				padding:30px 0;
		}
		
		#featured_powerboats, #news {
				width:100%;
		}

		#home_content .feature_content {
				margin-bottom:50px;
		}


		#social {
				float:none;
				text-align:center;
				margin:15px 0;
		}

		#social a {
				display:inline-block;
				float:none;
		}

		.image_grid {
				width:50%;
				width:calc(50% - 10px);
		}
		
		.sub_content .half, #contact_content .half {
				width:96%;
		}

		.sub_content .feature_content:last-child {
				border-bottom:1px solid #eee;
		}

		.boat-slide {
				padding-bottom:100px;
		}

		.boat-slide span {
				top:auto;
				bottom:-10px;
		}
		.image_grid.boats {
				width:90%;
				margin:10px 5%;
		}

}
@media screen and (max-width: 600px) {
		.image_grid {
				width:100%;
				margin:10px 0;
		}

		.image_grid.boats {
				width:100%;
				margin:10px 0;
		}
}

@media screen and (max-width: 500px) {
		body {
				padding:0 !important;
		}
	
		.products-slides-container {
				width:100%;
		}

		.sub_content .feature_content div.label, .sub_content .feature_content div {
				width:100%;
		}

		#topnav {
				margin:0 0 20px;
		}
		
		#nav ul li a, #nav ul li, #nav ul, #topnav, #nav ul li span {
				float:none;
				display:block;
		}
		#nav ul li span {
				margin:0;
				padding:0;
		}

}
