body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; }

ol, ul { list-style: none; }

address, caption, cite, code, dfn, th, var { font-style: normal; font-weight: 400; }

table { border-collapse: collapse; border-spacing: 0; }

Fieldset, img { border: 0; }

caption, th { text-align: left; }

body { color: #333; font-family: Arial,Helvetica,sans-serif; font-size: 87.5%; line-height: 1.5; }
@media screen and (min-width: 800px) { body { font-size: 100%; } }

.wrapper { box-sizing: border-box; max-width: 1280px; margin: 0 auto; overflow: hidden; padding: 14px 9px; }

header { background: url(../images/header-back.jpg) no-repeat center top; height: 5.143em; margin-bottom: .375em; position: relative; width: 100%; }
@media screen and (min-width:800px) { header { height: 8.75em; margin-bottom: .625em; } }
header h1 { background: transparent url(../images/padi-logo-sm.png) no-repeat; bottom: .8125em; height: 50px; left: 20px; overflow: hidden; position: absolute; text-indent: -9999px; width: 113px; }
@media screen and (min-width:800px) { header h1 { background: transparent url(../images/padi-logo-bg.png) no-repeat; height: 71px; width: 160px; } }
header h2 { bottom: .448em; color: #fff; font-size: 1.8125em; line-height: 1; left: 140px; text-shadow: 1px 1px 0 #000; position: absolute; }
@media screen and (min-width: 800px) { header h2 { left: 190px; } }

nav { float: left; margin-bottom: 1.875em; position: relative; width: 100%; z-index: 2; }
@media screen and (min-width: 520px) { nav { border-bottom: 1px solid #333; } }

nav .menu-item { background: #efefef; display: block; height: 3.15em; margin-bottom: .375em; text-align: center; text-transform: uppercase; }
nav .menu-item a { border-top: 5px solid #efefef; box-sizing: border-box; color: #333; display: block; height: 3.15em; line-height: 3em; text-decoration: none; }
nav .menu-item a:hover { color: #fff; text-shadow: 1px 1px #333; }
nav .menu-item.dive-centers:hover a { background: #008cc1; border-color: #3db7e6; }
nav .menu-item.manufacturers:hover a { background: #ce3730; border-color: #ff3d3e; }
nav .menu-item.padi:hover a { background: #01a59e; border-color: #00cabf; }
@media screen and (min-width:520px) { nav .menu-item { float: left; height: 3.75em; margin-bottom: 0; margin-right: 2%; width: 32%; }
  nav .menu-item.padi { float: right; margin-right: 0; }
  nav .menu-item a { height: 3.75em; line-height: 3.5em; } }
@media screen and (min-width: 800px) { nav .menu-item { font-size: 1.25em; height: 3.75em; }
  nav .menu-item a { height: 3.75em; line-height: 3.4375em; } }

.mega-menu { background: #008cc1; box-sizing: border-box; color: #fff; display: none; padding: 0 10px 20px; }
@media screen and (min-width: 520px) { .mega-menu { -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; -moz-column-gap: 10px; -webkit-column-gap: 10px; column-gap: 10px; padding-top: 1em; width: 313%; }
  .menu-item:hover .mega-menu { display: block; } }
@media screen and (min-width: 700px) { .mega-menu { -moz-column-count: 4; -webkit-column-count: 4; column-count: 4; } }

.mega-menu li { font-size: .7em; line-height: 1.5; list-style-type: disc; margin-left: 16px; text-align: left; }

#content-main { box-sizing: border-box; clear: both; font-size: .9375em; position: relative; z-index: 1; }
@media screen and (min-width: 800px) { #content-main { float: left; padding-left: 10px; width: 66.326%; } }
#content-main h2 { border-bottom: 5px solid #333; font-size: 2.4em; line-height: 1; margin-bottom: .84em; padding-bottom: .45em; }
#content-main p { margin-bottom: 1.8em; }

#sidebar { position: relative; }
#sidebar .ad-1 img, #sidebar .ad-2 img { display: block; height: auto; max-width: 100%; }
@media screen and (min-width: 240px) and (max-width:599px) { #sidebar .ad-1, #sidebar .ad-2, #sidebar .video { margin: 0 auto 1em; width: 300px; } }
@media screen and (min-width: 600px) and (max-width: 799px) { #sidebar .ad-1 { float: left; margin-bottom: 2em; width: 48%; }
  #sidebar .ad-1 { margin-right: 4%; }
  #sidebar .ad-2 { position: absolute; right: 0; top: 0; width: 48%; }
  #sidebar .video { clear: left; margin: 0 20%; width: 60%; } }
@media screen and (min-width: 800px) { #sidebar { box-sizing: border-box; float: right; padding-right: 10px; max-width: 310px; width: 31.632%; }
  #sidebar .ad-1, #sidebar .video { border-bottom: 5px solid #333; margin-bottom: 1.6875em; padding-bottom: 1.375em; } }
