/* @override 
	http://surfsource.dev/styles/screen.css
	http://surfsource.ngengarage.com/styles/screen.css
*/

/*
 * Project:   Surf Source
 * Date:      2010/05/19
/* ---------------------------------------- */

* { margin: 0; padding: 0; }

html { min-height: 100%; font-size: 100.01%; }
body { background: #090200 url(../images/body-bg-a.jpg) 50% 0 no-repeat; font-size: 62.5%; }

@media only screen and (max-device-width: 480px) { html { -webkit-text-size-adjust: none; } }

body, textarea, input, select, option, button { color: #fff; font-family: Antenna,Helvetica Neue,Helvetica,Arial,sans-serif; line-height: 1.5; }
li, dt, dd, p, th, td, caption, pre { font-size: 1.4em; }
ul, ol, dl, p, table, pre, h1, h2, h3, h4, h5, h6 { margin-bottom: 15px; }

a { color: #1aa2fe; text-decoration: underline; }
a:hover, a:focus, a:active { color: #d3dc33;outline: 0; }

ul, ol, dd, blockquote { padding-left: 40px; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
li *, li p, li li, dt *, dd *, p *, th *, td * { font-size: 1em; }

img { border: none; -ms-interpolation-mode: bicubic; }
pre { font-family: "Courier New",monospace; white-space: pre-wrap; }
table { border-collapse: collapse; border-spacing: 0; }
button { overflow: visible; padding: 0 10px; cursor: pointer; } button::-moz-focus-inner { padding: 0; border: none; }

hr { overflow: hidden; height: 1px; margin: 15px 0 !important; margin: -5px 0 8px; padding: 0; border: none; background-color: #ccc; color: #ccc; }
*:first-child+html hr { margin: -7px 0 8px !important; }

.offset { position: absolute !important; left: -10001px !important; overflow: hidden !important; }

@font-face { font-family: 'Antenna'; src: url('/fonts/antennabold.eot'); src: local('☺'), url('/fonts/antennabold.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Antenna XB'; src: url('/fonts/antennaextrabold.eot'); src: local('☺'), url('/fonts/antennaextrabold.ttf') format('truetype'); font-weight: normal; font-style: normal; }

.mouse{ font-size: 1.2em; text-align: right; margin-bottom: 0;}

/* LAYOUT
------------------------------------------- */

#root { width: 950px; margin: 0 auto; }
 #top { position: relative; height: 275px; margin: 0 0 20px; }
  #logo { position: absolute; left: 50%; top: 20px; z-index: 20; width: 263px; height: 197px; margin-left: -131px; background: url(../images/logo-a.png) no-repeat; }
   #logo a { display: block; position: absolute; bottom: 0; left: 0; overflow: hidden; width: 263px; height: 133px; font-size: 0; text-indent: -10001px; }
  #skip-links { position: absolute; top: 0; left: -10001px; list-style: none; margin: 0; padding: 0; }
   #skip-links li a:focus, #skip-links li a:active { display: block; position: absolute; left: 10001px; top: 0; z-index: 10001; width: 200px; margin: 15px 0 0 15px; padding: 2px 0; background: #333; color: #fff; text-align: center; text-decoration: none; }
 #shop { position: absolute; right: 0; top: 0; list-style: none; margin: 0; padding: 0; }
  #shop li { float: left; font-family: Antenna XB,Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: uppercase; }
   #shop li a { float: left; width: 130px; padding: 3px 10px; background: #d3dd33; color: #66672a !important; text-decoration: none; opacity: 0.9; }
   #shop li a:hover, #shop li a:focus, #shop li a:active { opacity: 1; }
   #shop li a.cart { background: #d3dd33 url(../images/shop-icons-cart-a.gif) 125px 50% no-repeat; }
 #nav { position: absolute; left: 0; bottom: 0; z-index: 10; width: 950px; height: 59px; margin: 0 -4px; padding: 4px; background: url(../images/nav-bg-shadow-a.png) no-repeat; }
  #nav .inner { position: relative; overflow: hidden; width: 100%; height: 59px; margin: 0; padding: 0; background: url(../images/nav-bg-a.jpg) no-repeat; }
  #nav ul { position: relative; left: 50%; float: left; list-style: none; margin: 0; padding: 0; }
   #nav li { position: relative; float: left; left: -50%; padding: 0 5px; font: 1.5em/1.1 Antenna XB,Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: uppercase; }
    #nav li a { float: left; height: 48px; padding: 11px 20px 0; color: #fff; text-decoration: none; }
    #nav li a:hover, #nav li a:focus, #nav li a:active { color: #d3dc33; }
    #nav li a.active { background: url(../images/nav-bg-active-a.png) 50% 0 no-repeat; color: #fff !important; }
     #nav li a span { display: block; font-size: 1.2em; }
    #nav li em { position: absolute; left: -10001px; top: -10001px; }
 #content { }
 #footer { margin: 30px 0 0; padding: 45px 10px 20px; background: url(../images/footer-bg-a.gif) repeat-x; }
  #footer p { margin: 0 0 5px; color: #d3dd33; font: 1.2em/1.3 Helvetica,Arial,sans-serif; text-transform: uppercase; }
  #footer p.links { font-weight: bold; }
   #footer p a { color: #d3dd33; text-decoration: none; }
   #footer p a:hover, #footer p a:focus, #footer p a:active { color: #fff; }
   #footer p span { padding: 0 5px; }
  #footer p.author { position: relative; overflow: hidden; width: 127px; height: 32px; float: right; text-indent: -10001px; }
   #footer p.author a { position: absolute; right: 0; top: 0; overflow: hidden; width: 127px; height: 32px; background: url(../images/footer-author-a.png) no-repeat; font-size: 0; text-indent: -10001px; }
   
/* GENERAL
------------------------------------------- */

/* headers */

h1, h2, h3, h4, h5, h6 { color: #1aa2fe; font: 1em/1.1 Antenna XB,Helvetica Neue,Helvetica,Arial,sans-serif; }
h1 { font-size: 4.5em; }
h2 { color: #fff; font-size: 2.6em; text-transform: uppercase; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.0em; }

h1.a, h2.a, h3.a, h4.a, h5.a, h6.a { position: relative; margin: 20px -10px 15px; padding: 5px 10px; background: url(../images/nav-a-bg-a.gif); color: #d3dd33; font-family: Antenna,Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: none; }
h2.a { font-size: 1.6em; }

h1.b, h2.b, h3.b, h4.b, h5.b, h6.b { margin: 0 0 3px; color: #fff; font-family: Helvetica Neue,Helvetica,Arial,sans-serif; font-weight: bold; }
h3.b { font-size: 1.4em; text-transform: uppercase; }

/* cols */

.cols-a { width: 100%; }
.cols-a:after { display: block; overflow: hidden; clear: both; content: ""; width: 100%; height: 0; }
 .cols-a .primary { float: left; width: 611px; padding: 15px 10px 5px; background: #090200; }
 .cols-a .secondary { float: right; width: 291px; padding: 15px 10px 5px; background: #090200; }
 .cols-a .blank { width: 311px; padding: 0; background: none; }
  .cols-a .blank .inner { width: 291px; margin: 0 0 10px; padding: 15px 10px 5px; background: #090200; }

.cols-b { width: 100%; }
.cols-b:after { display: block; overflow: hidden; clear: both; content: ""; width: 100%; height: 0; }
 .cols-b .primary { float: right; width: 611px; padding: 15px 10px 5px; background: #fff; }
 .cols-b .secondary { float: left; width: 291px; padding: 15px 10px 5px; background: #090200; }


.split-a { overflow: hidden; width: 100%; }
 .split-a .one { float: left; width: 45%; }
 .split-a .two { float: right; width: 45.1%; }

ul.distributors{ overflow: hidden; padding: 0; width: 100%; margin:0;}
 .split-a li { float: left; width: 45%; list-style-type: none; font-size: 1em; padding: 0; } 
 .split-a li.odd { margin-right: 10%; }
 
/* containers */

.content-a { }
 .content-a h2 { margin: 0 0 3px; color: #d3dd33; font: 1.6em/1.1 Antenna,Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: none; }
 .content-a p { font: 1.4em/1.3 Helvetica Neue,Helvetica,Arial,sans-serif; }
 .content-a ol, .content-a ul { font-family: Helvetica Neue,Helvetica,Arial,sans-serif; }

.details-a { position: relative; overflow: hidden; width: 100%; margin: 0 0 15px; color: #333; font-weight: bold; }
 .details-a p.image { position: relative; overflow: hidden; float: left; width: 250px; margin: 0; height:350px;}
  .details-a p.image img { float: left; }
 .details-a .info { margin-left: 280px; padding-bottom: 50px; }
  .details-a .info h1 { color: #333; font: bold 1.6em/1.2 Helvetica Neue,Helvetica,Arial,sans-serif; }
 .details-a p.add { position: absolute; left: 0; bottom: 0; overflow: hidden; margin: 0 0 0 280px; }
  .details-a p.add a { float: left; padding: 7px 15px; background: #1aa2fe; color: #fff; font: 18px/1 Antenna XB,Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: uppercase; text-decoration: none; }
  .details-a p.add a:hover,
  .details-a p.add a:focus,
  .details-a p.add a:active { background: #ced92c; }
.details-a iframe{

}
.featured-a { position: relative; z-index: 15; overflow: hidden; width: 100%; margin: -30px 0 15px; }
 .featured-a .item { float: left; width: 311px; }
 .featured-a .middle { margin: 0 8px 0 9px; }
  .featured-a h2 { margin: 0 0 -20px; padding: 0 0 50px 10px; background: url(../images/featured-a-bg-a.png) 0 100% no-repeat; font: 2.4em/1 Antenna XB,Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: uppercase; text-shadow: #000 0 0 3px; }
   .featured-a h2 a { display: block; height: 50px; padding: 50px 0 0; background-position: 100% 100%; background-repeat: no-repeat; text-decoration: none; }
   .featured-a .repair h2 a { background: url(../images/featured-a-icons-repair-a.png) 100% 90% no-repeat; }
   .featured-a .products h2 a { background-image: url(../images/featured-a-icons-products-a.png); }
   .featured-a .journal h2 a { background-image: url(../images/featured-a-icons-journal-a.png); }
  .featured-a p { margin: 0; padding: 0 10px; font-size: 1.4em; text-shadow: #000 0 0 5px; }
   .featured-a a { color: #fff; }
   .featured-a a:hover,
   .featured-a a:focus,
   .featured-a a:active { color: #d3dc33 !important; }

div.intro-a { width: 100%; height: 290px; margin: -20px 0 0; }
 .intro-a p { margin: 0 0 -40px; }
 html* .intro-a p { margin-bottom: 0; }
 .intro-a p.main { float: left; margin-left: -5px; }
  .intro-a p.main img { transform: rotate(-1deg); -webkit-transform: rotate(-1deg); -moz-transform: rotate(-1deg); -o-transform: rotate(-1deg); }
  html* .intro-a p.main img { filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.99984770, M12=0.01745241, M21=-0.01745241, M22=0.99984770,sizingMethod='auto expand'); }
 .intro-a p.side { float: right; padding-top: 10px; }

/*.products-a { width: 100%; margin: 20px 0; }
.products-a:after { display: block; overflow: hidden; clear: both; content: ""; width: 100%; height: 0; }
 .products-a .product { display: inline; float: left; width: 170px; margin: 0 0 0 25px; }
  .products-a .product p.image { margin: 0 0 5px; }
   .products-a .product p.image a { display: block; padding: 4px; }
   .products-a .product p.image a:hover,
   .products-a .product p.image a:focus,
   .products-a .product p.image a:active { background-color: #19a3fe; }
    .products-a .product p.image a img { display: block; padding: 1px; background: #797979; }
    .products-a .product p.image a:hover img,
    .products-a .product p.image a:focus img,
    .products-a .product p.image a:active img { background: #19a3fe; }
  .products-a .product h3 { margin: 0 10px 5px; color: #333; font: 1.2em/1.2 Helvetica Neue,Helvetica,Arial,sans-serif; }
   .products-a .product h3 a { color: #333; text-decoration: underline; }
  .products-a .product p.add { margin: 0 10px; font: bold 1em/1.25 Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: uppercase; }
   .products-a .product p.add a { text-decoration: none; }
*/
.products-a { width: 100%; overflow: hidden; padding-left: 0;}
.products-a .product.a { clear: both; }
 .products-a .product { display: inline; float: left; width: 170px; margin: 20px 0 0 25px; }
  .products-a .product p.image { margin: 0 0 5px; height:200px; display:block; overflow:hidden;border:1px solid #797979;}
   .products-a .product p.image a { display: block; height:192px; overflow:hidden;}
	.products-a .product p.image a:link,
	.products-a .product p.image a:visited { border:4px solid #fff; }
   .products-a .product p.image a:hover,
   .products-a .product p.image a:focus,
   .products-a .product p.image a:active { border:4px solid #19a3fe;}
    .products-a .product p.image a img { /*display: block; padding: 1px; background: #797979;*/ }
    .products-a .product p.image a:hover img,
    .products-a .product p.image a:focus img,
    .products-a .product p.image a:active img {/*border:4px solid #19a3fe;*/}
  .products-a .product h3 { margin: 0 10px 5px; color: #333; font: 0.857em/1.2 Helvetica Neue,Helvetica,Arial,sans-serif; }
   .products-a .product h3 a { color: #333; text-decoration: underline; }
  .products-a .product p.add { margin: 0 10px; font: bold 0.714em/1.25 Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: uppercase; }
   .products-a .product p.add a { text-decoration: none; }

.attachments {
	list-style-type: none;
	padding: 0;
}


/* forms */



/* tables */

table { }
 table th, table td { padding: 5px 10px; border: 1px solid #ccc; }

/* lists */

ul.nav-a { list-style: none; margin: 0 -10px 15px; padding: 0; }
 ul.nav-a li { width: 100%; }
 h2 a.parentCat:link, h2 a.parentCat:visited { color: #d3dd33; text-decoration: none; color:#fff;}
  ul.nav-a li a,
  h2 a.active,
  h2 a.parentCat { display: block; padding: 0 10px; background: url(../images/nav-a-bg-a.gif) -10px 0 no-repeat; color: #fff; text-decoration: none; }
  * html ul.nav-a li a { zoom: 1; }
  ul.nav-a li a:hover,
  ul.nav-a li a:focus,
  ul.nav-a li a:active,
  ul.nav-a li a.active,
  h2 a.active,
  h2 a.parentCat:hover  { display: block; background-repeat: repeat; color: #d3dd33; }
  h2.active a:link, h2.active a:visited { color: #d3dd33; text-decoration: none; }
   ul.nav-a li a span { display: block; padding: 3px 0 4px 20px; background: url(../images/nav-a-bullet-a.gif) 5px 12px no-repeat; }
   ul.nav-a li a:hover span,
   ul.nav-a li a:focus span,
   ul.nav-a li a:active span,
   ul.nav-a li a.active span,
   h2 a.parentCat:hover { background-position: 5px -88px; }
   
   
   h2 a.active, h2 a.parentCat {
	 margin-left: -10px;
	 margin-right: -10px;
}

ul.sections-a { list-style: none; margin: 0 0 15px; padding: 0; }
 ul.sections-a li { margin: 0 0 15px; font-size: 1.4em; }
  ul.sections-a li br { display: none; }
  ul.sections-a li strong { display: block; margin: 0 0 5px; }
  ul.sections-a li a { color: #fff; }
  ul.sections-a li a:hover,
  ul.sections-a li a:focus,
  ul.sections-a li a:active { color: #d3dd33; }
  ul.sections-a li strong { font: 1.86em/1.1 Antenna XB,Helvetica Neue,Helvetica,Arial,sans-serif; text-transform: uppercase; }
   ul.sections-a li strong a { text-decoration: none; }

/* paragraphs */

p.contact-a { font: 1.4em/1.3 Helvetica Neue,Helvetica,Arial,sans-serif; }

p.image-a { margin: 0 0 10px; }
 p.image-a img { display: block; }

p.intro-a { font-size: 1.6em; }

p.video-a { margin: 0 0 10px; }
 p.video-a br { display: none; }
 p.video-a a.video { display: block; position: relative; width: 100%; }
  p.video-a a.video img { display: block; }
  p.video-a a.video span { position: absolute; left: 50%; top: 50%; overflow: hidden; width: 58px; height: 58px; margin: -28px 0 0 -28px; background: url(../images/video-a-play-a.png) no-repeat; font-size: 0; text-indent: -10001px; }
  * html p.video-a a.video span { background-image: url(../images/video-a-play-a-ie.png); }
  p.video-a a.video:hover span, p.video-a a.video:focus span, p.video-a a.video:active span { background-position: 0 -500px; }
 p.video-a a.caption { display: block; padding: 5px 0; background: #6ac5ff; color: #fff; text-decoration: none; text-align: center; }

/* links */

a.shop-a { position: relative; display: block; width: 311px; padding: 4px; margin: -4px; background: url(../images/shop-a-bg-a.png) no-repeat; }
 a.shop-a span { display: block; overflow: hidden; width: 311px; height: 213px; background: url(../images/shop-a-bg-b.jpg) no-repeat; font-size: 0; text-indent: -10001px; }


/* blog */
.header{
	position: relative;
}
.header h2{
	font-size: 2.4em;
}
.header .fancy-date{
	font-size: 1.8em;
}
.header iframe{
	position: absolute;
	top: -43px;
	right: 0px;
}
.blogPost h1{
	padding-right: 80px;
}
.article{
	margin-bottom: 6em;
}
.article h3{
	font-size: 1.8em;
	letter-spacing: 0.06em;
	color: #d3dd33;
}
.content-a h3{
	letter-spacing: 0.07em;
}
#comments{
	margin-top: 2.8em;
}
#comments .num-comments{
	border-bottom: 1px dotted #d3dd33;
	padding-bottom: 0.7em;
	margin-bottom: 0;
}
.comment{
	padding-top: 2.1em;
	padding-bottom: 0.7em;
	border-bottom: 1px dotted ; border-color: #d3dd33;
}
#comment-form{
	margin-top: 2.8em;

}
#comment-form label{
	display: block;
}
#comment-form label.error{
	color: #e81c16;
}
#comment-form input.error, #comment-form textarea.error{
	border: 3px solid #e81c16;
}
#comment-form button{
	color: #000;
	padding: 0.3em 0.5em;
	-webkit-border-radius:0.7em;
}
#comment-form .confirm-field{
	display: none;
}
#comment-form input, #comment-form textarea{
	width: 66.667%;
	color: #000;
	padding: 0.2em;
}
#comment-form textarea{
	height: 16em;
}
ol.archive, ol.archive ol{
	padding: 0;
}
ol.archive li{
	list-style-type: none;
	margin-left: 0;
	padding-left: 0;
	text-indent: 0;
}
ol.archive h3{
	margin:.5em 0 0 0;
}
/* other */

.fb{
	position: absolute;
	top: 3px;
	left: 0;
	background: url(../images/fb.png) no-repeat 0 4px;
	padding-left: 18px;
}
.fb a{
	color: #d3dd33;
	font-weight: bold;
	text-decoration: none;
	font-family: Helvetica,Arial,sans-serif;;
}
.fb a:hover{
	text-decoration: underline;
}
 
/* SPECIFIC
------------------------------------------- */

body.frame { padding: 20px 20px 5px; background: #fff; color: #555; font-family: Helvetica Neue,Helvetica,Arial,sans-serif; }
