body { margin: 10px 0;font-family: Arial, Helvetica, sans-serif;background: white; }

#wrapper { background: url(images/back3.jpg) no-repeat; width: 960px; height: 660px; margin: 0 auto;text-align: right;position: relative; }
#footer { width:100%;margin-top: 20px; }

#copyright { margin:0;clear: left; }
#header ul#headernav,#nav ul,#subnav ul,#leftnav ul,#footer ul#footernav { list-style: none;margin: 0;padding: 0; }
#nav, #subnav { line-height: 1em; }
#headernav { float:right;margin:3px 5px;text-align:right; }
#nav ul, #subnav ul, #footernav ul { float: left; }

h1 { background: rgba(255,255,255,0.4);border-radius: 10px 0 0 10px;color: #26578a;display: inline-block;font-family: Arial, Helvetica, sans-serif; font-size: 30px; font-weight: normal; padding: 5px 18px 1px 15px;margin: 117px 0 0;text-shadow: 0 0 7px #fff;text-align: right; }
h2 { background: rgba(255,255,255,0.4);border-radius: 0 0 0 10px;color: #46607b; font-family: Arial, Helvetica, sans-serif; font-size: 20px; line-height: 28px; font-weight: normal;padding: 5px 20px;margin: 0;display: inline-block;text-shadow: 0 0 7px #fff;text-align: right; }
h1 span.byline{font-size: 24px;}
h1 span.byline sup{font-size: 14px;}

h3 { color: #2e4b87; font-family: Arial, Helvetica, sans-serif; font-size: 22px; line-height: 28px; font-weight: normal; padding: 3px 0 0 28px; margin: 0; }

.bonus-text { padding: 10px 15px;border-radius: 5px;background-color: rgba(36,50,64,0.85);color: #fff;font: normal 12px/23px arial,verdana,sans-serif;position: absolute;bottom: 95px;left: 15px;right: 15px;text-align: center; }
.logos { display: none; }


   /*
   #qstart { position:relative;padding:5px 5px 0;height:130px; }
    #qstart input, #qstart select { border:1px solid #787878;background:#fff;color:#143570;font-size:11px;
      width:140px;padding:2px 4px 3px 4px;margin:5px;float:left; }
    #qstart .deselected input, #qstart .deselected select { background:#a0a0a0;color:#8c90b7; }
    #qstart ul { margin:0 !important;padding:0 !important;list-style-type:none !important; }
  #qstart label { width:110px;float:left;margin:5px;color:#ccd1cc;padding-top:2px;font-size:12px; }
  #qstart label strong { color:#fff; }

*/
#qstart { width:280px; background: #283a42; margin: 0 0 0 16px; padding:10px 18px; height: 100px }
#qstart input, #qstart select { border:1px solid #506ea2; background:#fff; color:#8c90b7; font-size:11px; width:120px; padding:2px 4px 3px 4px; margin:5px;float:left; }
#quoBoatModel_cf_button { display:none; }

#quoteBox p {color:#dbe3e7; font:12px/20px arial,verdana,sans-serif !important; margin:5px 15px 15px 15px !important;}
/* #quoteBox h3 { display: block; margin: 0 0 0 12px; text-indent: -9000em; background: url(/landing-pages/boattrader_responsive/images/start_quote.png); width: 221px; height: 27px; padding: 0;} */
#quoteBox h3 { text-shadow: 0 0 2px #fff;text-indent: 0;background: none;font:700 20px "myriad-pro-condensed",arial,sans-serif;color: #fff;text-transform: uppercase;width: auto;height: auto; padding:16px 8px !important; }
#quoteBox {width:346px; background: rgba(36,50,64,0.85) !important; margin: 22px 15px 0 20px; padding: 15px;text-align: left;}

input#go { border:0; padding:0; margin:7px 0 12px 76px; background:url(images/complete-quote-request.png) !important; cursor:pointer; text-indent:-9000em !important; width:222px !important; height:31px !important;}
#footer { width:905px;margin: -100px auto 100px auto; }
#footer img { border: none; }
#footerLeft { width: 370px;margin: 0;padding: 10px 0 20px 10px;float: left;font-size: 10px;font-weight: bold;line-height: 15px; }
#footerRight { width: 520px;margin: 0;padding: 10px 0;float: left;text-align: right; }

#footerNav { text-align: right; }
#footerNav a { font-size: 12px;font-weight: bold;text-decoration: none;color: #244387;text-align: right; }
#footerNav a:hover { font-size: 12px;font-weight: bold;text-decoration: underline; }

#footerNavSecondary a { font-size: 10px;color: #8d8d8d;font-weight: bold;text-decoration: none; }
#footerNavSecondary a:hover { font-size: 10px;color: #8d8d8d;font-weight: bold;text-decoration: underline; }

#footerRight ul { padding: 0;margin: 0;clear: both; }
#footerRight li { list-style: none;display: block;float: right;margin: 0 0 0 10px; }






/* Responsive Media Adjustments **************************************************/

/* If Small Desktop */
@media (max-width: 991px) {
  #wrapper { width: calc(100% - 50px);height: 670px !important;margin: 15px 25px;border-radius: 5px;background: url(images/back-mobile.jpg) no-repeat top right;position: relative; }

  h1 { margin-top: 110px; }

  .bonus-text { bottom: 5px; }
  .logos { display: block;position: absolute;top: 20px;right: 10px;left: 20px; }
  .logos img { float: left;max-width: 98px; }
  .logos img:nth-child(2) { display: none; }
  .logos img:last-child { float: none;margin-top: 18px;max-width: 150px; }
  .nboat-replace,.pop-replace { background-size: 100%;font-size: 0;background-repeat: no-repeat;display: inline-block; }
  .nboat-replace { background-image: url(images/nboat-logo.png);width: 99px;height: 73px;margin: 0 0 0; }


  #footer { margin: -20px auto 20px;width: calc(95% - 50px);position: relative; }
  #footerLeft { width: calc(40% - 20px);padding: 10px 10px 20px; }
  #footerRight { width: 58%; }
}

/* If Tablet */
@media (max-width: 767px) {
  h1 { text-align: center;font:700 37px "myriad-pro-condensed",arial,sans-serif;text-shadow: 0 0 7px #fff;margin-top: 110px; }
	h1 span.byline{font-size: 32px;}
  h2 { text-align: center;font:400 37px "myriad-pro-condensed",arial,sans-serif;text-shadow: 0 0 7px #fff; }
  #quoteBox { float: none;width: auto !important;margin: 10px 0 0;text-align: center;background: url(images/quote_back3.png); }
  #quoteBox h3 { text-shadow: 0 0 2px #fff;text-indent: 0;background: none;font:700 25px "myriad-pro-condensed",arial,sans-serif;color: #fff;text-transform: uppercase;width: auto;height: auto; }
  #quoteBox p { color: #d8ebf9; }


  #qstart { width: auto;height: 83px !important;margin: 0 15px;border-radius: 5px; }
  #qstart label { white-space: nowrap;text-align: left;color: #ccd1cc !important;cursor: pointer;padding-top: 7px !important;margin: 5px 5px 5px 10px !important;width: calc(44% - 15px) !important; }
  #qstart label strong { color: #ccd1cc !important; }
  #qstart li { float: left;width: 50%; }
  #qstart li > div { width: 55% !important; }
  #qstart li > div > div { width: 100% !important; }
  #qstart input,#qstart select { padding: 4px 7px 6px !important;font-size: 14px !important;width: calc(100% - 26px) !important; }
  #qstart li > input { width: calc(55% - 26px) !important; }

  #qstart li > input#go { border-radius: 50px;left: 50% !important;margin-left: -112px !important;width: 224px !important; }

  .bonus-text { position: relative;bottom: auto;left: auto;right: auto; }
  .logos img:first-child { display: none; }
  .logos img:nth-child(2) { display: block;margin: -10px;max-width: 118px; }
  .pop-replace { margin-left: 15px; }

  #footerLeft,#footerRight { width: 100%;float: none; }
  #footerRight { background: #e9ecf2;border-radius: 5px;padding: 5px 0 10px; }
  #footerRight:after { display: block;clear: both;content: ""; }
  #footerRight li { float: left; }
}

@media (max-width: 600px) AND (min-width: 481px) {
  #wrapper { height: auto !important;background-size: cover;padding-bottom: 20px; }
  h1,h2 { border-radius: 0;padding-left: 0;padding-right: 0;width: 100%; }
  h1 { font-size: 24px;margin-top: 120px; }
	h1 span.byline{font-size: 21px;}
  h2 { font-size: 18px; }

  #qstart { height: 130px !important; }
  #qstart label { margin: 5px 5px 5px 10px !important;width: calc(100% - 15px) !important;padding-top: 2px !important;margin-bottom: 1px !important; }
  #qstart li > div { width: 100% !important; }
  #qstart li > input { width: calc(100% - 26px) !important; }
  .bonus-text { border-radius: 0 }
}

/* If Mobile */
@media (max-width: 480px) {
  #wrapper { width: calc(100% - 30px);margin: 10px 15px;height: auto !important;background-size: 1200px;padding-bottom: 20px; }
  h1,h2 { border-radius: 0;padding-left: 0;padding-right: 0;width: 100%; }
  h1 { font-size: 32px;margin-top: 120px; }
	h1 span.byline{font-size: 28px;}
  h2 { font-size: 18px; }
  #qstart { height: 165px !important;margin-bottom: 15px !important; }
  #qstart li { float: none;width: 100%; }
  .bonus-text { margin: 25px 10px 10px;text-align: center;border-radius: 0 }
  .logos img:last-child { margin-top: 28px; }
  .nboat-replace { width: 70px;height: 52px; }
  .pop-replace { width: 120px;height: 59px;margin-left: 5px; }
  #footerLeft,#footerRight { margin: 0 -15px;width: auto; }
  #quoteBox { padding-left: 0 !important;padding-right: 0 !important; }
}