.hide{
	display: none!important;
}

header{
	position: absolute;
	top: 0;
	left: 0;
	padding: 20px 0px;
    background-color: transparent;
    visibility: visible;
}

header .logo {
    position: relative;
    left: 20px;
    top: 0;
    display: inline-block;
    float: left;
}

header nav{
    margin-right: 20px;
}

header .main-nav ul{
	clear: none;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
    list-style: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

header .main-nav ul li+li {
    margin-left: 33px;
}

header .main-nav ul li a {
	color: #fff;
    font-family: "DharmaGothicE-ExLight",Helvetica,Arial;
    font-size: 2.4rem;
    letter-spacing: 3px;
}

header .main-nav ul li .subnav a {
    font-size: 2rem;
    letter-spacing: 2px;
    display: block;
    width: 100%;
    height: 100%;
}

header .main-nav ul li .subnav {
	display: flex;
	justify-content: flex-end;
    margin: 0;
    list-style: none;
    position: absolute;
    z-index: 100;
    padding: 18px 28px;
    background: rgba(2,27,53,.8);
    text-align: left;
    width: 100%;
    right: 0;
	top: 55px;
}


header .main-nav ul li .subnav li{
	height: 90px;
    background-position-x: 50%;
    background-position-y: 20%;
	line-height: 160px;
	background-repeat: no-repeat;
    background-size: 27%;
}

header .main-nav ul li .subnav.no-icons li{
	line-height: 90px;
}

header .main-nav ul li .subnav li.dealers-link{
	background-image: url("/images/icons/icon-locate-a-dealer.png");
		background-size: 60%;
}

header .main-nav ul li .subnav li.shop-link{
	background-image: url("/images/icons/icon-shopping-trolley.png");
	background-size: 60%;
}
header .main-nav ul li .subnav li.brochures-link{
	background-image: url("/images/icons/icon-brochure.png");
	background-size: 65%;
}
header .main-nav ul li .subnav li.stock-listings-link{
	background-image: url("/images/icons/icon-boat-stock-listing.png");
}
header .main-nav ul li .subnav li.which-whittley-link{
	background-image: url("/images/icons/icon-which-whittley.png");
	background-size: 22%;
}
header .main-nav ul li .subnav li.stratton-finance-link{
	background-image: url("/images/icons/icon-stratton-finance.png");
	background-size: 14%;
}
header .main-nav ul li .subnav li.marine-insurance-link{
	background-image: url("/images/icons/icon-insurance.png");
	background-size: 23%;
}
header .main-nav ul li .subnav li.clean-safe-link{
	background-image: url("/images/icons/icon-clean-safe-boating.png");
	background-size: 30%;
}
header .main-nav ul li .subnav li.owners-club-link{
	background-image: url("/images/icons/icon-owners-club.png");
	background-size: 70%;
}
header .main-nav ul li .subnav li.warranty-link{
	background-image: url("/images/icons/icon-warranty-policy.png");
	background-size: 30%;
}
header .main-nav ul li .subnav li.warranty-registration-link{
	background-image: url("/images/icons/icon-warranty-registration.png");
	background-size: 20%;
}
header .main-nav ul li .subnav li.safety-link{
	background-image: url("/images/icons/icon-safety-warning.png");
	background-size: 43%;
}
header .main-nav ul li .subnav li.sell-link{
	background-image: url("/images/icons/icon-sell-your-whittley.png");
	background-size: 33%;
}
header .main-nav ul li .subnav li.events-link{
	background-image: url("/images/icons/icon-events.png");
	background-size: 85%;
}
header .main-nav ul li .subnav li.enquiry-link{
	background-image: url("/images/icons/icon-enquiry.png");
	background-size: 60%;
}
header .main-nav ul li .subnav li.clearwater-link{
	background-image: url("/images/icons/icon-clearwater.png");
	background-size: 100%;
}
header .main-nav ul li .subnav li.become-dealer-link{
	background-image: url("/images/icons/icon-become-a-dealer.png");
	background-size: 60%;
}
header .main-nav ul li .subnav li.sl-series-link{
	background-image: url("/images/icons/icon-sl.png");
	background-size: 100%;
}
header .main-nav ul li .subnav li.ff-series-link{
	background-image: url("/images/icons/icon-ff.png");
	background-size: 100%;
}
header .main-nav ul li .subnav li.xs-series-link{
	background-image: url("/images/icons/icon-xs.png");
	background-size: 100%;
}
header .main-nav ul li .subnav li.coasttourer-link{
	background-image: url("/images/icons/icon-coast-tourer.png");
	background-size: 90%;
}
header .main-nav ul li .subnav li.fleetmaster-link{
	background-image: url("/images/icons/icon-fleetmaster.png");
	background-size: 75%;
}
header .main-nav ul li .subnav li.cr-series-link{
	background-image: url("/images/icons/icon-cr.png");
	background-size: 100%;
}
header .main-nav ul li .subnav li.cw-series-link{
	background-image: url("/images/icons/icon-cw.png");
	background-size: 100%;
}
header .main-nav ul li .subnav li.buildaboat-link{
	background-image: url("/images/icons/icon-build-a-boat.png");
	background-size: 52%;
}
header .main-nav ul li .subnav li.difference-link{
	background-image: url("/images/icons/icon-difference.png");
	background-size: 32%;
}
header .main-nav ul li .subnav li.portrait-link{
	background-image: url("/images/icons/icon-portrait.png");
	background-size: 37%;
}
header .main-nav ul li .subnav li.awards-link{
	background-image: url("/images/icons/icon-awards.png");
	background-size: 75%;
}
header .main-nav ul li .subnav li.history-link{
	background-image: url("/images/icons/icon-history.png");
	background-size: 90%;
}
header .main-nav ul li .subnav li.partners-link{
	background-image: url("/images/icons/icon-partners.png");
	background-size: 100%;
}
header .main-nav .secure-zone a img{
	width: 25px;
}


header .main-nav>ul>li>.subnav a {
	color: #fff;
    font-family: "DharmaGothicE-ExLight",Helvetica,Arial;
    font-size: 1.75rem;
    letter-spacing: 2px;
}

.hero header{
    background-color:#021b35;
}
		.search-box {
	    float: none;
	    width: 100%;
	}


/*
.bx-viewport{
	height: 100% !important;
}
*/

.bx-viewport.bx-viewport { min-height: 100% !important; }

.bx-viewport img{
/* 	min-width: 100%; */
/* 	min-height: 100%; */
}

.toggler{
	float: right;
    width: 35px;
    height: 35px;
    padding: 15px 13px 0;
    background: #fff;
    margin-top: -12px;
}

.toggler span {
    display: block;
    height: 5px;
    background: #021b35;
}

.toggler span+span {
    margin-top: 4px;
}

.mobile-slider-image{
	display: none;	
}

div.homeslider2017wrapper{
	overflow: hidden;
	height: 50%;
}

.homeslider2017wrapper .nobgmodels{
	width: auto;
}


/* The Overlay (background) */
.overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 100%;
    width: 0;
    position: fixed; /* Stay in place */
    z-index: 200; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgba(2, 27, 53); /* Black fallback color */
    background-color: rgba(2, 27, 53, 0.9); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
    position: relative;
    top: 10%; /* 25% from the top */
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

/* The navigation links inside the overlay */
.overlay a {
	font-family: "DharmaGothicE-ExLight",Helvetica,Arial;
	letter-spacing: 3px;
    padding: 8px;
    font-size: 3.6rem;
    color: #fff;
    display: block; /* Display block instead of inline */
    transition: 0.3s; /* Transition effects on hover (color) */
    margin-top: 5px;
}
.mobile-nav .overlay-content .subnav-mobile li a {
    font-size: 2rem;
    margin-top: 3px;
    padding: 3px;
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
    color: #f1f1f1;
}

/* Position the close button (top right corner) */
.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
}

.full-width .full-width1 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width2 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width3 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width4 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    .overlay .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }
}

@media only screen and (min-width: 667px){
	div.homeslider2017wrapper{
		height: 75%;
	}
}

@media only screen and (min-width: 668px) and (max-width: 1010px){
	div.homeslider2017wrapper{
		height: 46%; }
}

@media only screen and (min-width: 992px){
	.full-width .full-width1 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width2 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width3 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width4 {
	    width: 25%;
	    float:left;
	    display: inline-block;
	}
}

@media only screen and (min-width: 320px) and (max-width: 668px){
	.full-width .full-width1 {
	    width: 50%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width2 {
	    width: 50%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width3 {
	    width: 50%;
	    float:left;
	    display: inline-block;
	}
	.full-width .full-width4 {
	    width: 50%;
	    float:left;
	    display: inline-block;
	}
	.logo a img{
		width: 	200px;
	}
	
	.homeslider2017wrapper .nobgmodels {
		width: auto;
	}
/* 	.bx-wrapper{display:none} */
	
	.mobile-slider-image{
		display: block;	
	    min-height: 100%;
	}
	.nobgmodels img{
		display:none;
	}
	
	
	.nobgmodels hr{
		display: none;	
	}
	
	.nobgmodels h2{
		width: 25%;
		margin: 3px auto;
	}
	
	.homeslider2017wrapper .nobgmodels {
		padding: 10px 10px 40px;
	    margin-top: 30px;
	    top: -140px;
	}
	div.homeslider2017wrapper{
		height: 38%;
		display: block;
	}

/*
	div.homeslider2017wrapper{
		height: 100%;
	}
*/
	
}

@media only screen and (min-width: 1100px) and (max-width: 1110px)
{
	header .main-nav ul li+li {
	    margin-left: 15px;
	}
}

@media only screen and (max-width: 1010px){
	.mobile-nav, .toggler{
		display: block;
	}
	.main-nav{
		display: none;
	}
		.hero .pagecontent {
	margin-top: 120px;
}
}

@media only screen and (min-width: 1011px){
	.mobile-nav, .toggler{
		display: none;
	}
	.main-nav{
		display: block;
	}
	.hero .pagecontent {
	margin-top: 200px;
}
	.hero .pagecontent .dealerorder {
	margin-top: 0;
}
}