/**Compressed Version of CSS Styles for Great Lakes Boat Co Website by Dotcom Designs**/
*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;}
body, p, header, aside, section, article, h1, h2, h3, nav, div, footer{padding:0;margin:0;font:inherit;} p {font-size:110%;line-height:1.5;}body{font-family:'Montserrat','Open Sans',sans-serif;overflow-x:hidden;} ul{list-style:none;} a{text-decoration:none;} a, a:link, a:visited {color:#fff;} html{scroll-behavior:smooth;} #wrapper{width:100%;text-align:center;} section{border-collapse:collapse;}
.desktopnav,.desktopinventorydetails,.section4, .s2txt,.blt2, .zip, .desktop-br {display:none;}
img {max-width: 100%;}
span {font-weight:bold;}




.blt {padding: 0 2%;}



.fixed-header {
    background: #00293c;
    color: #fff;
    padding: 0.5em;
    text-align: center;
    top: 0;
	position: relative;
    z-index: 1;
	height: 100px;
}
.mobile-nav {
    height: 30px;
}
.mobile-menu{
	list-style:none;
	font-weight: 700;
	
}
.mobile-menu > li {
	margin: 0 1rem;
	overflow: hidden;
}
.mobile-menu.active {
	display:none;
}
.menu-button-container {
	cursor: pointer;
	display: flex;
	height: 100%;
	width: 100%;
	padding-top:.5em;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
#menu-toggle {
	display: none;
}
.menu-button,
.menu-button::before,
.menu-button::after {
	background-color: #fff;
	display: block;
	position: absolute;
	height: 4px;
	width: 5em;
	transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.menu-button::before {
	content: '';
	margin-top: -8px;
}
.menu-button::after {
	content: '';
	margin-top: 8px;
}
#menu-toggle:checked + .menu-button-container .menu-button::before {
	margin-top: 0px;
	transform: rotate(405deg);
}
#menu-toggle:checked + .menu-button-container .menu-button {
	background: rgba(255, 255, 255, 0);
}
#menu-toggle:checked + .menu-button-container .menu-button::after {
	margin-top: 0px;
	transform: rotate(-405deg);
}
#menu-toggle:checked + .menu-button-container {
	padding-top: 2em;
}
#menu-toggle ~ .mobile-menu li {
    border: 0;
	height: 0;
    margin: 0;
    padding: 0;
    transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
#menu-toggle:checked ~ .mobile-menu li {
    height: auto;
    padding: 1.5em;
    transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
.mobile-menu > li {
    background-color: #00293c;
	color: #fff;
	margin: 0;
    padding: .5em 0;
    width: 100%;
}
#menu-toggle:checked ~ .mobile-menu li:first-child {
    padding-top: 3em;
}
#menu-toggle:checked ~ .mobile-menu li:last-child {
    padding-bottom: 3em;
}
.nav__link {
	text-transform:uppercase;
	font-size:22px;
}

.desktophero{width:100%; position: relative; background-image: url(../images/GLB-mobile-hero.jpg); background-position: center; background-size: cover; z-index: -1}
  .desktophero::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.4); 
  z-index: 1;
}
.hero-container {color: #fff; margin: 0 auto;
  width: 85%;
  position: relative;
  padding: 3em 0;
  z-index: 2;
  text-shadow: 0 1px 3px rgba(0,0,0,0.55);}
.headline {font-family: 'Merriweather', serif; font-size: 24px; margin-top: 1em; letter-spacing: 0.2px; line-height: 1.5;}
.promobar{width:100%;color:#000;z-index: -1;}
.promobar p {width: 85%; margin: 0 auto; line-height: 1.5; font-size:17px;}
.credit-notice {font-weight: 700; font-size: 19.5px; letter-spacing: .25px; display: block; margin-top: 3em;}
section {padding:4em 1em;}
.section2 {background: #00293c; background: linear-gradient(to right, #103c4d, #072933); color: #fff;}
.section2 h2, .section2 p {color: #fff;}
.section2 p {font-size: 1.25em; margin-bottom: 10px;}
.caps {text-transform: uppercase; font-weight: 400;}
.row{width:96%;margin: 0 auto;}
.column, .yamaha {width: 90%; max-width: 400px; margin: 0 auto;padding: 6% 0;}
.image {width: 100%;height: auto;border: 3px solid #1e656d;box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.6);}
.cat-image {width: 100%;height: 185px;box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.6);}
.container {position: relative;width: 100%;z-index: 1;}
.overlay {position: absolute;top: 0;bottom: 0;background: rgb(0, 0, 0);background-color: rgba(30,101,109,.9);border: 3px solid #1e656d;width: 100%;transition: .5s ease;opacity: 0;font-size: 200%;text-align: center;transition: all .85s ease-out;}
.container:focus .overlay {opacity:1;} .container:hover .overlay {opacity:1;} .container:active .overlay {opacity:1;}
.container h4 {color: #fff;font-size: 65%;font-weight: 600;line-height: 1;padding-top: 4%;}
.container h4 em {display:block;margin-top:8px;color: #f4f4f4;font-size: 140%;font-weight: 400;letter-spacing: 1px;text-shadow: 1px 1px #272727;}
.overlay p {font-size:20px;line-height:1;padding-top:8px; color: #fff;}
.overlay a {font-size: 94%;font-weight: 600;font-style: italic;text-shadow: 1px 1px #272727;line-height: 2;transition: all .85s ease-out;}
.overlay a:hover{color:#00293c;}
.view-boats-btn {display:block;width: 90%;margin: 10% auto;margin-bottom:6%;padding: 18px;color: #f4f4f4;border: 2px solid #f1f3ce;border-radius: 4px;font-size: 140%;font-weight: 700;letter-spacing: 1.5px;transition: all .85s ease-out;}
.overlayred, .overlayblue {position: absolute;top: 0;bottom: 0;background: rgb(0, 0, 0);border: 3px solid #1e656d;width: 100%;font-size: 200%;text-align: center;transition: all .85s ease-out;}
.overlayred {background-color: rgba(187, 21, 21, .65);}
.overlayblue {background-color: rgba(0, 41, 60, .65);}
.overlayred h4, .overlayblue h4 {font-size: 110%;font-weight: 600;text-shadow: 1px 1px #272727;transition: all .85s ease-out;width: 70%;margin: 0 auto;padding-top:25%;}
footer {padding: 2%;background: #00293c;background: linear-gradient(to right, #103c4d, #072933);color: #f4f4f4;clear: both;}
.contactcolumn{padding: 2%;}
footer p {font-size: 120%;}
iframe {width:100%;}

@keyframes imageAnimation { 0% { opacity: 0; animation-timing-function: ease-in;-webkit-animation-timing-function: ease-in; }8% { opacity: .7; animation-timing-function: ease-out;-webkit-animation-timing-function: ease-out; }17% { opacity: .7 }25% { opacity: 0 }100% { opacity: 0 }} @keyframes titleAnimation { 0% { opacity: 0;animation-timing-function: ease-in;-webkit-animation-timing-function: ease-out; }8% { opacity: 1;animation-timing-function: ease-out;-webkit-animation-timing-function: ease-out;}17% { opacity: 1 }19% { opacity: 0}100% { opacity: 0 }} 
.no-cssanimations .glb-slideshow li span{opacity: 1;} 


/*Typography Styles*/

h2 em {
    font-weight: 700;
    font-style: normal;
}
h2 {
	font-size:225%;
	color:#00293c;
}
h3 {
	font-size:215%;
	font-weight:400;
	color:#00293c;
	margin: 10% 0;
}
h3 em, h4 em {
	font-weight:700;
	font-style:normal;
}
h6, h5 {
	color:#fff;
}
h5 {
	font-size:.85em;
    text-shadow: 1px 1px #272727;
    letter-spacing: 1px;
	padding:.25em;
}
h6 {
	padding-top:.25em;
	font-weight:600;
	font-size: 18px;
}
.contactcolumn h6 {
    font-size: 150%;
}

/*Buttons*/
.view-btn, .creditbtn {
    border-radius: 4px;
    display:block;
    font-size: 125%;
    font-weight: 700;
	letter-spacing:1.5px;
    margin: 1em auto;
	padding:1em 0;
    transition: all .85s ease-out;
	width:90%;
}
.view-btn {
	border:2px solid #fff;
}
.creditbtn {border: 3px solid #1e656d;text-shadow: 1px 1px #000;background-color: #00293c;background-color: rgba(0,41,60,.65);background-image: linear-gradient(to right, rgba(0,41,60,.8), rgba(0,41,60,.8),rgba(0,41,60,.5),rgba(0,41,60,.6),rgba(0,41,60,.8)); max-width: 500px;}
@media only screen and (max-width: 330px){.mobilehero p {
		font-size:110%;
	}
}