.builder-theme{
	background: url("../images/bg-builder-top.jpg")  no-repeat center center ;
	background-size:cover;
	height:98px;
}

.builder-theme h1{
	font-size:40px;
	color:#fff;
	height:40px;
	line-height:98px;
	text-align:center;
}

.builder{
	background:#131313;
	position:relative;
	//background: url(../images/pattern2.png);
}

.builder .step{
	max-width:940px;
	margin:0 auto 0 auto;
	position:relative;
	display:none;
}

.builder .step.active{
	display:block;
}

.builder .next:before, .builder .prev:before {
  content: "";
  width: 80px;
  height: 16px;
 
  display: block;
  position: absolute;
  left: 5px;
 
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
 
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 8%, rgba(255,255,255,0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(8%,rgba(255,255,255,0.7)), color-stop(100%,rgba(255,255,255,0)));
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}

.builder .next,
.builder .prev {
	position:absolute;
	top:-41px;
	height:30px;
	line-height:30px;
	text-align:center;
	display:block;
	width:90px;
	color:#fff;
	font-size:13px;
	border-radius: 18px;
}

.builder .next, .builder-step7 .details .buttons a {
	right:10px;
	filter: alpha(opacity=20);
	-moz-opacity:0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;
	background: #383838;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(40%,#383838 ), color-stop(100%,#000000 ));
	background: -webkit-linear-gradient(top, #383838 40%,#000000 100%);
	background: -moz-linear-gradient(top, #383838 40%, #000000 100%);
	background: -o-linear-gradient(top, #383838 40%,#000000 100%);
	background: -ms-linear-gradient(top, #383838 40%,#000000 100%);
	background: linear-gradient(to bottom, #383838 40%,#000000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#94c4fe', endColorstr='#d3f6fe',GradientType=0 );
	border: 1px solid #c7c7c7;
	color: #fff;
	-webkit-box-shadow: 0px 0px 2px 2px rgb(0, 0, 0);
	box-shadow: 0px 0px 2px 2px rgb(0, 0, 0);
}

.builder .prev{
	left:10px;
	right:auto;
	-webkit-box-shadow: 0px 0px 2px 2px rgb(0, 0, 0);
	box-shadow: 0px 0px 2px 2px rgb(0, 0, 0);
	border: 1px solid #c7c7c7;
	color:#4a565e;
	width:90px;
	height:30px;
	line-height:30px;
	background: #FFFFFF ;
}

.builder .next.active{
	filter: alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
	cursor:pointer;
}

.builder .next.orange{
	background: #de6700;
}

.step-nav{
	height:50px;
	text-align:center;
	border-bottom:1px solid #4a565e;
	margin:0 auto 0 auto;
	text-align:center;
	background: white;
}

.step-nav ul{
	height:36px;
	line-height:36px;
	text-align:center;
	padding:8px 0 0 0;
}

.step-nav li{
	display:inline-block;
	float:none;
	width:auto;
	padding:0 45px 0 0;
	position:relative;
	color:#a2a2a2;
	font-size:11px;
	margin:0 3px 0 0;
}

.step-nav li .num{
	width:37px;
	border-bottom:1px solid #4a565e;
	text-align:center;
	position:absolute;
	right:0px;
	top:0px;
	height:16px;
	line-height:16px;
	font-size:10px;
}

.step-nav li.active{
	font-weight: bold;
	color:#131313;
}

.builder .motors {
	padding: 50px 0 50px 0;
}


.builder .motors .buttons{
	font-size:9px;
	line-height:31px;
	height:31px;
}

.builder .motors .buttons .select{
	width:62px;
	height:29px;
	border:1px solid #fff;
	line-height:29px;
	text-align:center;
	font-size:11px;
	color:#fff;
	display:block;
	float:right;
	margin:0 20px 0 0;
	filter: alpha(opacity=20);
	-moz-opacity:0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;
	cursor:default;
}

.builder .boat{
	width:750px;
	height:600px;
	position:relative;
}

.builder .boat div{
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background-position:center center;
	background-size:cover;
	background-repeat:no-repeat;
}

/* TODO: CSS z-index for stern, bow, and wetbar (need visuals first) */
.builder .boat .wetbar { z-index: 25 }
.builder .boat .wetbar-cover { z-index: 25 }
.builder .boat .deck-hull { z-index: 1; }
.builder .boat .tubes { z-index: 14; }
.builder .boat .upholstery { z-index: 22; }
.builder .boat .table-bow { z-index: 23; }
.builder .boat .table-aft { z-index: 26; }
.builder .boat .extra-seats { z-index: 24;}
.builder .boat .wetbar { z-index: 25 }
.builder .boat .couch-cover { z-index: 25 }
.builder .boat .couch { z-index: 25;}
.builder .boat .teak-deck { z-index: 20; }
.builder .boat .t-top { z-index: 23; }
.builder .boat .t-top.above { z-index: 27; }
.builder .boat .engines { z-index: 21; }

/* TODO: CSS background-image for stern, bow, and wetbar (need visuals first) */

/*.builder .boat .deck-console { background-image: url("../boat/1. deck/CONSOLE/con2003.png"); }*/
/*.builder .boat .deck-deck 	{ background-image: url("../boat/1. deck/DECK/deck_2003.png"); }*/
.builder .boat .deck-hull   	{ background-image: url("../boat/1. deck/HULL/hull 9003.png"); }
/*.builder .boat .deck-nose 	{ background-image: url("../boat/1. deck/NOSE STEPS/step_2003.png"); }*/
/*.builder .boat .tubes 	 	{ background-image: url("../boat/2. TUBES/tubes 7012.png"); }*/
/*.builder .boat .upholstery  		{ background-image: url("../boat/3. UPHOLSTERY/upholstery 2010.png"); }*/
.builder .boat .seat 			{ background-image: url("../boat/4. SEAT/seat 9003.png"); }
/*.builder .boat .engine 			{ background-image: url("../boat/5. ENGINE/outboard.png"); }*/
.builder .boat .INBOARD .engine 	{ background-image: url("../boat/5. ENGINE/IN/in 7042.png"); }

.builder .OUTBOARD .engine-colors{
	display:none;
}

.builder .boat .seat{
	display:none;
}

.builder .boat.seat2 .seat,
.builder .boat.seat4 .seat{
	display:block;
}

.builder .boat .seat.sec{
	top:20px;
	left:-64px;
	display:none;
}

.builder .boat.seat4 .seat.sec{
	display:block;
}

.builder-step2,
.builder-step4,
.builder-step5,
.builder-step7{
	padding:40px 0 50px 0;
}

/*.builder-step2,
.builder-step5{
	padding-bottom:130px;
}*/

.builder-step2 .boat-options,
.builder-step4 .boat-options,
.builder-step5 .boat-options{
	position:absolute;
	right:0px;
	top:30px;
	width:210px;
	text-align:right;
	z-index: 9999;
}

.builder-step2 .boat-options h4,
.builder-step5 .boat-options h4{
	font-size: 12px;
	color: #fff;
	padding: 0 20px 7px 0px;
}

.builder-step2 .boat-options h5,
.builder-step5 .boat-options h5{
	font-size:10px;
	color:#62727d;
	padding:0 0 5px 0;
}

.builder-step2 .boat-options .bow-selector,
.builder-step5 .boat-options .color-selector{
	position:relative;
	text-align:left;
}

.builder-step2 .boat-options .bow-selector .open-list,
.builder-step5 .boat-options .color-selector .open-list{
	display:block;
	width:148px;
	height:24px;
	line-height:24px;
	color:white;
	text-align:left;
	padding:0 0 0 10px;
	background: url("../images/builder-arrow-down.png") no-repeat 140px center;
	margin:0 0 15px 50px;
	font-size:10px;
	position:relative;
	border-radius: 13px;
	box-shadow: 0px 0px 3px 1px #af5100;
  background-color: #de6700;
}

.builder-step5 .boat-options .color-selector.active .open-list{
	background:#363636 url("../images/builder-arrow-up.png") no-repeat 140px center;
	border-color:#363636;
}

.builder-step5 .boat-options .color-selector .open-list.selected{
	background:none;
}

.builder-step5 .boat-options .color-selector .open-list.selected span{
	position:absolute;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	display:block;
	right:7px;
	top:7px;
	width:10px;
	height:10px;
}

.builder-step5 .boat-options .color-selector .list{
	display: none;
	width: 160px;
	background: #131313;
	position: absolute;
	top: 26px;
	right: 0;
	z-index: 100;
	padding-left: 10px;
}

.builder-step5 .boat-options .color-selector .scroll-content{
	max-height:240px;
	overflow:auto;
	width:160px;
}

.builder-step5 .boat-options .color-selector .list.min .scroll-content{
	max-height:180px;
}

.builder-step5 .boat-options .color-selector .list.min2 .scroll-content{
	max-height:150px;
}

.builder-step5 .boat-options .color-selector .list.min3 .scroll-content{
	max-height:120px;
}

.builder-step5 .boat-options .color-selector .list .scroll-content a{
	display: block;
	height: 22px;
	line-height: 22px;
	color: #fff;
	font-size: 10px;
	position: relative;
	text-align: right;
	padding-right: 10px;
	border-radius: 10px;
}

.builder-step5 .boat-options .color-selector .list .scroll-content a:hover{
	background:#3c3c3c;
}

.builder-step5 .boat-options .color-selector .list .scroll-content a span{
	position:absolute;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
	display:block;
	right:9px;
	top:8px;
	width:14px;
	height:14px;
}

.builder-step5 .boat-options .color-selector .list .scroll-content a.first{
	border:0px;
}

.builder-step5 .boat-options .color-selector.active .list{
	display:block;
}

/* custom for technohull */
.builder.b1 .builder-step5 .boat-options .color-selector.select-airinlet .list a{
	display:none;
}

.builder.b1 .builder-step5 .boat-options .color-selector.select-airinlet .list a.only{
	display:block;
}

/* */

.builder-step4 .boat-options h4 {
	font-size: 1.3rem;
	text-align: right;
	margin: 20px 0px;
}
.builder-step4 .boat-options .seats-list a{
	width:40px;
	height:30px;
	border:1px solid #888;
	line-height:29px;
	text-align:center;
	font-size:14px;
	color:#fff;
	display: inline-block;
}

.builder-step4 .boat-options .seats-list a.active{
	background:#fff;
	color:#62727d;
}

.builder-step4 .boat-options .seats-list a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
	cursor: pointer;
	z-index: 35;
}

.builder-step4 .boat-options a {
	display:block;
	background: url("../images/builder-switch.png") no-repeat right top;
	margin:25px 0 0 0;
	height: 32px;
	line-height:32px;
	padding:0 88px 0 0;
	color:#fff;
	font-size:10px;
	background-size: 32% !important;
}

.builder-step4 .boat-options a.active {
	background-position:right bottom;
}

.builder-step4 .boat-options .na {
	background: url("../images/builder-switch-na.png") no-repeat right bottom;
}

.builder-step6 .title {
	font-size: 22px;
	text-align: center;
	line-height: 50px;
}

.builder .optionals {
	max-height: 600px;
	overflow-y: auto;
}

.builder .optionals .item-col {
	padding: 0 !important;
}

.builder .optionals .item-col .item {
	color: #131313;
	max-width: 320px;
	box-sizing: border-box;
	cursor: pointer;
	padding: 10px;
}

.builder .optionals > .col-sm-3:nth-child(4n+1) {
    clear: both;
}

.builder .optionals .item-col .item.active {
	background: #111;
}

.builder .optionals .item-col .item .item-image img{
	display: block;
	width: 100%;
	height: auto;
}

.builder .optionals .item-col .item .inner {
	background: white;
	padding: 20px;
	margin-top: 5px;
}

.builder .optionals .item-col .item .description {
	line-height: 18px;
	padding-bottom: 10px;
	padding-right: 10px;
	margin-bottom: 20px;
	overflow: hidden;
	overflow-y: auto;
}

.builder .optionals .item-col .item .description h2 {
	font-size: 18px;
	text-align: left;
	line-height: 25px;
}

.builder .optionals .item-col .item footer {
	display: block;
	position: relative;
}

.builder .optionals .item-col .item footer .add-btn {
	display: block;
	padding: 10px 15px 10px 35px;
	border: 2px solid #131313;
	border-radius: 17px;
	font-size: 10px;
	line-height: 10px;
	width: 40%;
	position: relative;
	margin: 0 auto;
	background: #131313;
}

.builder .optionals .item-col .item.active footer .add-btn {
	background: #de6700;
}

.builder .optionals .item-col .item footer .add-btn {
	border: 1px solid #c7c7c7;
	box-shadow: 0px 0px 2px 2px rgb(136, 136, 136);
}
	
.builder .optionals .item-col .item footer .add-btn i {
	float: left;
	font-style: normal;
	font-size: 20px;
	margin-right: 10px;
	line-height: 6px;
}

.builder .optionals .item-col .item.inactive footer .add-btn:after {
	content: "";
  width: 111px;
  height: 16px;
 
  display: block;
  position: absolute;
  left: 5px;
 
  top: 0;
  
	-webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
 
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 8%, rgba(255,255,255,0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(8%,rgba(255,255,255,0.7)), color-stop(100%,rgba(255,255,255,0)));
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}

.builder .optionals .item-col .item.active footer .add-btn .active { display: block; }
.builder .optionals .item-col .item.active footer .add-btn .inactive { display: none; }
.builder .optionals .item-col .item.inactive footer .add-btn .active {	display: none; }
.builder .optionals .item-col .item.inactive footer .add-btn .inactive {	display: block; }

.builder-step7 .contact-form{
	display:none;
	padding:100px 0 50px 180px;
}

.builder-step7 #thank{
	padding:100px 0 50px 180px;
}

.bow-selector {
	margin-top: 20px;
}

.stern-selector li, .bow-selector li {
	text-align: center;
	position: relative;
	border: 2px solid #313131;
	margin: 1px;
	max-width: 229px;
}

.stern-selector li:hover, .stern-selector li.active, .bow-selector li:hover, .bow-selector li.active {
	border: 2px solid orange;
	cursor: pointer;
}

.stern-selector li.active, .bow-selector li.active {
	border: 2px solid white;
}

.stern-selector li.inactive, .bow-selector li.inactive {
	opacity: 0.2;
}

.stern-selector li.disabled, .bow-selector li.disabled {
	opacity: 0.05;
}

.stern-selector li img, .bow-selector li img {
	max-width: 100%;
	max-height: 200px;
	height: auto;
	width: auto;
}

.stern-selector li div {
	margin-bottom: 10px;
}

.bow-selector li div {
	margin-top: 10px;
}

.stern-selector ul, .bow-selector ul { 
	display: flex;
	align-items: center;
	justify-content: center;
}

.bow-selector ul {
	margin-bottom: 20px;
}

.combination {
	display: flex;
  align-items: center;
  justify-content: center;
	margin-bottom: 20px;
}

.combinations {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.combination img {
	max-width: 250px;
}

.combination .option-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 10px;
	margin-left: 20px;
}

.builder .motors {	
	display: flex;
	align-items: center;
	justify-content: center;
}

.builder-step7 .boat {
	float: left;
}

.builder-step7 .details {
	width: 190px;
	display: inline-block;
}

.builder-step7 .specs {
	text-transform: uppercase;
}

.builder-step7 .boat-description {
	text-align: right;
}

.builder-step7 .boat-description .name {
	margin-bottom: 10px;
}

.builder-step7 .details .buttons {
	margin-top: 50px;
}

.builder-step7 .details .buttons a {
	height: 30px;
	line-height: 30px;
	text-align: center;
	display: inline-block;
	width: 150px;
	margin-bottom: 10px;
	color: #fff;
	font-size: 13px;
	opacity: 1;
	border-radius: 18px;
	position: relative;
	right: 0;
}

.builder-step7 .details .buttons .send {
	background: #de6700;
}

.builder-step7 .details .buttons {
	text-align: right;
	width: 100%;
}

.builder-step7 .details .buttons a:before {
  content: "";
  width: 140px;
  height: 12px;
 
  display: block;
  position: absolute;
  left: 5px;
 
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
 
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0.7) 8%, rgba(255,255,255,0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(8%,rgba(255,255,255,0.7)), color-stop(100%,rgba(255,255,255,0)));
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.7) 8%,rgba(255,255,255,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}