/**   RESET    **/
html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,  fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}body {line-height: 1;}ol, ul {list-style: none;}blockquote, q {    quotes: none;}blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}table {border-collapse: collapse;border-spacing: 0;}	
* {-moz-box-sizing: border-box;	-webkit-box-sizing: border-box;	box-sizing: border-box;}
body{font-family:Arial, Helvetica, sans-serif;}
strong {font-weight:bold;}
/*Design Layout*/
.wrapper {position:relative;  margin:0 auto;  width:100%; max-width:1680px; min-width:340px;}
a {text-decoration:none;}

/* HEADER */
.trail-gator-logo {position:absolute; left:20px; top:32px;}
header {position:relative; background-image:url(../images/header_tile.jpg); background-position:bottom; background-repeat:repeat-x; height:115px; border-left:3px #000000 solid; border-right:3px #000000 solid; border-radius:0 0 8px 8px; }
.h-cart {width:220px; position:absolute; right:20px; top:10px; height:90px; border:1px #060 solid; text-align:center; background:url(../images/grey-bg-trans.png); border-radius:8px; overflow:hidden}
.h-cart h1 {margin:0; padding:3px; background:#000; color:#FFF; font-size:0.9em;}
.h-cart p {margin:0;padding-top:10px; font-size:0.8em}
.h-cart-header {display:block; background:#000000; padding:2px;}

/* MENUS */
.toplinks {position:absolute; top:4px; left:20px;width:60%; /*border:1px #333333 solid;*/}
.toplinks li {float:left; font-size:90%; padding:0 10px; border-left:1px #333333 solid; text-align:center;}
.toplinks a {color:#333333;}
.toplinks a:hover {color:#000; text-decoration:underline;}
.toplinks li:first-child {border:none;}

.topmenu{position:absolute;left:10px; top:111px; width:98%; }
.topmenu li, .mobilemenu li{float:left; background:#000; border-bottom:3px #000 solid; border-left:3px #000 solid; border-right:3px #000 solid; margin-left:0.5%; padding:0.5% 1.5%; border-radius: 0 0 16px 16px; font-weight:bold;}
.topmenu a, .mobilemenu a  {color:#FFFFFF; display:block;}
.topmenu li.selected, .mobilemenu li.selected {background:#87c518;}
.topmenu li:hover, .mobilemenu li:hover, .leftmenu li:hover {background: #c30505; color:#FFFFFF;}

.mobilemenu {/*border-bottom:2px #000 solid;*/ margin-top:2px; display:none; position:absolute; width:100%; top:102px;}
.mobilemenu li{border-radius:0; width:50%; margin:0; border:none; border-left:1px #87c518 solid; padding:10px 1.5%; text-align:center;}
.mobilemenu ul ul {width:90%; position:absolute; top:35px;; right:0; display:none;}
.mobilemenu ul ul li{float:none;  border:none;  padding:18px 1.5%; text-align:center; width:100%;}
.mm-icon {text-shadow:none; float:right; font-weight:bold; display:none;}


.leftmenu {border-radius:6px; overflow:hidden;}
.leftmenu li{background:#87c518; color:#000000; border-bottom:1px #333333 solid; line-height:1.1em}
.leftmenu ul ul li{background:#96db1d;  border-top:1px  #666666 solid; }
.leftmenu li.selected{background: #c30505; color:#FFFFFF;}
.leftmenu a{color:#000000; font-weight:bold; font-size:82%;  padding:8px 4px; display:block;}
.leftmenu a:hover, .leftmenu li.selected li a:hover{color:#FFFFFF;}
.leftmenu li.selected a{color:#fff;}
.leftmenu li.selected li a{color:#000;}

.leftmenu .heading {background:#000; color:#FFFFFF; text-align:center;padding:6px; font-weight:bold; text-shadow:1px 2px #c30505;}
.leftmenu .heading:hover {background:#000; }

/* CONTENT */
.content {margin-top:40px; overflow:hidden;}
.center-col {width: 84.1%; border:0px #999999 solid; float:right;  }
.main-content {width:81%;border:0px #999999 dotted; float:left}
.main-content p {padding:1px 0 12px 0; line-height:1.5em; font-size:96%;}

.tsize-medium {font-size:110%!important;}
.tsize-small {font-size:90%!important;}
.mt {margin-top:5px;}
.mb {margin-bottom:5px;}
.fright {float:right;}
.fleft {float:left;}
.acenter {text-align:center}
.aright {text-align:right;}
.aleft {text-align:left;}
.nm {margin:0 auto;}
.clear {clear:both;}
.strike {text-decoration:line-through;}
.page-title {font-size:130%; font-weight:bold; padding:2px 0 18px 0;}
.crumbs {padding:4px 4px 12px 4px}
.crumbs a {color:#333}
.crumbs a:hover {color:#000; text-decoration:underline;}

.sidebar-right,  .sidebar-left {border:0px #000 dashed; background:#fff; color:#333;  }
.sidebar-right {float:right;  width:18%; text-align:center; }
.sidebar-left {float:left;  width:15%;}
.sidebar-left img, .sidebar-right img {width:100%; height:auto;}

.sidebar-right h2, .sidebar-right h1, .sidebar-left h2 {margin:0; padding:3px; font-size:0.9em;}
.sidebar-right .white {color:#FFF;}

.sidebar-heading {background:#000000; color:#FFFFFF; font-weight:bold; padding:8px!important; line-height:1.2em; font-size:110%!important; margin-bottom:2px!important; text-shadow:1px 2px #c30505;}

.fp-products {border:2px #84c513 solid; background:#FFFFFF; margin-bottom:5px; text-align:center; border-radius:6px;}
.fp-products h2 {background:#84c513; font-weight:bold; color:#000000; text-shadow:1px 1px #93dc14 }
.fp-products p {padding-bottom:5px; font-size:80%; padding:6px; line-height:1.2em}
.fp-products img {max-width:150px;}

.fp-products .price {font-weight:bold; padding:4px; color:#000; background:#87c619; /*width:190px;*/ height:25px; line-height:20px; text-align:left; text-indent:10px; font-size:0.8em}
/*.product_box:first-child  {margin-left:0;}*/

.fp-links a {color:#484848; font-weight:bold;}
.fp-links a:hover {color:#000000; text-decoration:underline;}

.mainimage {border:2px #000 solid; float:right; margin-left:25px; padding:5px 5px 2px 5px; background:#84c513;}
.mainimage p {margin:0; padding:2px;}
.mainimage a {border:0; color:#000;}
.mainimage a:hover {border:0; color: #009;}
.mainimage img {border:1px #666 solid; border-radius:6px;}

ul.galleryimages {list-style:none; margin:0; padding:0; width:200px;}
.galleryimages li {width:100px; float:left;}
.prodthumb {max-width:100px;max-height:80px;}

.buyarea {border:#666 solid 1px; overflow:visible; margin-right:300px; min-height:28px; position:relative; font-weight:bold; color:#000; background:#87c619; }
.add2cart {margin:5px auto; text-align:center;}
.bookmarkarea {border:#666 dashed 1px;  margin-right:300px;  padding:10px;  margin-top:10px; overflow:hidden; font-size:0.7em;}
.socialbox{float:left; margin-right:25px;}
.keywords {text-align:center; font-size:0.7em; padding:15px 0px 15px 0px;}

.imgmap  {text-align:center; width:100%; margin-top:18px; margin-bottom:18px;  }
.imgmap img{max-width:204px; height:auto; width:33.3%;}

/* SHOPPING CART */
.cartupdate img {vertical-align:bottom;}
#cart-update {display:none; position:absolute; top:50px; left:50%; margin-left:-150px; width:300px; height:200px; border:2px #333 solid; background: #FFF; 
text-align:center;border-radius: 10px; padding:10px;}


form.cart { margin:0;}
.checkout_options {width:650px margin:0 auto; text-align:center;}


table.shopcart, table.checkout_form {border-collapse:collapse; margin: 0 auto; border:2px #000 solid; min-width:300px; max-width:1000px;}
table.shopcart th, table.checkout_form th {background:#84c513; color:#000; padding:4px; border-bottom:2px #333 solid; font-size:0.9em;  }
table.shopcart td, table.checkout_form td {padding:5px; font-size:0.8em;}
table.checkout_form td {border-bottom:1px #333 solid;}
table.shopcart th img {vertical-align:bottom}
table.shopcart .bdr {border-right:1px #333 solid;}
table.shopcart .bdb {border-bottom:1px #333 solid;}

.cart-info { font-size: 100%; line-height:1.2em;}

/* GRIDS */
.grid-wrapper {border:0px #000033 dashed; clear:both; }
.grid-100, .grid-50, .grid-3, .grid-full, .grid-half, .grid-4{ border:0px #666666 dotted; text-align:center;margin:0.5%; }
.grid-50, .grid-3, .grid-full, .grid-half, .grid-4 {float:left;}
.grid-100 {width:100%; margin:0;}
.grid-50 {width:49.5%;}
.grid-3 {width:32.667%; }
.grid-full {width:52%; height:200px;}
.grid-half {width:22.5%; height:200px;}
.grid-4 {width:24%;}

.grid-full img, .grid-half img {width:100%; height:auto; padding:1%; }
.grid-full img { max-width:596px;}
.grid-half img { max-width:292px;}


.grid-50:nth-child(2n+1) {margin-left:0;} 
.grid-50:nth-child(2n+2) {margin-right:0;}

.grid-3:nth-child(3n+1) {margin-left:0;} 
.grid-3:nth-child(3n+3) {margin-right:0;}

.fp-grids h2 {background:#000000; padding:16px 8px 24px 6px; border-radius:10px 10px 0 0; text-indent:-999em}
.fp-grids h2 a {color:#FFFFFF; font-weight:bold;}
.fp-grid-inner {border:3px #86c617 solid; border-radius:10px; background:#FFFFFF; margin-top:-12px; height:154px;}
.fp-grids p  {line-height:1.1em;}
.fp-grids a  {display:block;}
.fp-head-spares {background:#000 url('../images/fp-grid-heads.png') 50% 2px no-repeat!important;}
.fp-head-accs {background:#000 url('../images/fp-grid-heads.png') 40% -240px no-repeat!important; background-size:250px}
.fp-heads-child-acc {background:#000 url('../images/fp-grid-heads.png') 40% -280px no-repeat!important; background-size:250px}
.fp-heads-cycsafety {background:#000 url('../images/fp-grid-heads.png') 50% -159px no-repeat!important;}
.fp-heads-cycstorage {background:#000 url('../images/fp-grid-heads.png') 50% -200px no-repeat!important;}
.fp-heads-cyc-accs {background:#000 url('../images/fp-grid-heads.png') 50% -78px no-repeat!important;}

.prod-grid {height:180px; overflow:hidden; border:2px #86c617 solid; border-radius:8px; }
.prod-grid a {display:block; color:#000000;}
.prod-grid h3  {background:#86c617; padding:6px; color:#000000; font-weight:bold; min-height:42px;}
.prod-grid img {width:100%; height:auto; max-width:150px;}

/* TABLES */

.product_list_view {width:98%; margin:0 auto; border:0px #666 dashed; overflow:hidden;}

table.product_list {border-collapse:collapse;  margin:0 auto; border:2px #000 solid; margin-bottom:18px; width:100%;}
table.product_list h2, table.product_list h3, table.product_list p {padding:2px;}
table.product_list h2, table.product_list h3 {font-weight:bold;}
table.product_list th {background:#000; color:#FFF; padding:10px;font-size:110%; font-weight:bold;}
table.product_list th a {color:#fff; text-decoration:none;}
table.product_list td {padding:1%;  border-top:1px #666 solid; vertical-align:top; }
table.product_list td a {display:block; color:#000;}
table.product_list tr:hover {background:#ddffa1; }

table.product_list h3 {font-size:0.9em;}
table.product_list td.image {width:75px; padding:0;}
table.product_list .image img{width:75px; height:auto; object-fit: contain;}

table.product_list td.price {min-width:90px;background:#87c618; text-align:center; font-size:106%; vertical-align:middle; font-weight:bold;}
table.product_list td.priceoffer {min-width:90px;background:#fe1e07; text-align:center; font-weight: bold; color:#FFF; font-size:1em}


.page_nav_buttons, .pages {padding:5px 5px 5px 0px; font-size:0.8em}
.page_nav_buttons, .pages a {color:#000; text-decoration:none;}
.pagecontrol {position:relative; border:0px #CCC solid; width:98%; margin:0 auto; height:35px}
.pagelinks {position:absolute; left:180px; top:0; height:70px; width:665px;; overflow:hidden;}
.pagenav { float:left;  width:18px; font-size:0.8em; margin:4px; text-align:center}

.pagenav a {color:#000; text-decoration:none; display:block; padding:2px; background:#87c619; border:1px #999 solid;}
.pagenav a.selected {background:#4b555d; color:#FFF}

.pagenav a.prev {background: url(../images/pagenav.png) -41px 0px no-repeat; color:#FFF;  border:0;}
.pagenav a.prev:hover {background: url(../images/pagenav.png) -61px 0px no-repeat; color:#FFF}

.pagenav a.next {background: url(../images/pagenav.png) -22px 0px no-repeat; color:#FFF; border:0;}
.pagenav a.next:hover {background: url(../images/pagenav.png) -1px 0px no-repeat; color:#FFF}


.bright {border-right:1px #6d6d6d solid; }

/* FOOTER */
.footer {clear:both; height:90px; padding:5px; position:relative; background:#84c513 url('../images/footer_grad_bg.jpg');}
.footer p {font-size:0.7em; margin:4px;}
.payments {position:absolute; top:29px; right:8px;}

 /* WEBKIT SCROLL BAR STYLES */
 


 
 .sidebar-left::-webkit-scrollbar-arrow {
      color: #FFFFFF;
} 

 .sidebar-left::-webkit-scrollbar {
      width: 20px;
} /* this targets the default scrollbar (compulsory) */
 
 .sidebar-left::-webkit-scrollbar-track {
      background-color: #333;
} /* the targets the scrollbar track background color */

.sidebar-left::-webkit-scrollbar-thumb {
      background-color: rgba(195, 5, 5, 0.9); 
} /* this will style the thumb, ignoring the track */
.sidebar-left {scrollbar-face-color: #c30505;
scrollbar-track-color: #000000;
scrollbar-arrow-color: #f9f9f9;

scrollbar-darkshadow-color: #333333;
scrollbar-3dlight-color: #7D7E94;
scrollbar-highlight-color:#7D7E94;
scrollbar-shadow-color: #333333;
}
 
.sidebar-left::-webkit-scrollbar-button {
      background-color: #000;
} /* optionally, you can style the top and the bottom buttons (left and right for horizontal bars) */
 

 
 
@media screen and (max-width: 1680px) {
header {border-left:none; border-right:none; border-radius:0;}
.leftmenu {padding-left:6px;}
.sidebar-right {padding-right:6px;}
}



@media screen and (max-width: 1440px) {
.sidebar-left { width:18%;}
.center-col {width: 81.1%; }

.grid-full {width:65.5%; }
.grid-half {width:32.5%; }
.grid-mid {width:49%; }
.fp-head-accs {background:#000 url('../images/fp-grid-heads.png') 50% -39px no-repeat!important; background-size:250px}
.fp-heads-child-acc {background:#000 url('../images/fp-grid-heads.png') 50% -118px no-repeat!important; background-size:250px}
.prod-grid h3  {font-size:90%;}
}

@media screen and (max-width: 1280px) {
.sidebar-left { width:20%;}
.sidebar-right { width:20%;}
.center-col {width: 79%; }
.main-content {width:78.9%;}

.grid-full {width:100%; }
.grid-half {width:49%; }
.grid-4 {width:32.3%;}


}

@media screen and (max-width: 1020px) {
.h-cart {width:200px; right:10px; }
.sidebar-left { width:25%;}
.sidebar-right { width:28%;}
.main-content {width:71%}
.center-col {width: 74%;  }

table.shopcart, table.checkout_form { width:100%;}
table.product_list td.price {min-width:80px;}
table.product_list td.priceoffer {min-width:80px;}
}
@media screen and (max-width: 950px) {
.sidebar-right {display:none;}
.main-content {width:100%}
.leftmenu li a{ padding:12px 8px; line-height:1.5em}
}

@media screen and (max-width: 840px) {
.trail-gator-logo {width:65%; height:auto; left:10px; max-width:475px}
/*
.topmenu { left:0;}
.topmenu li{ margin-left:0.2%; padding:6px; font-size:96%;}
*/
.grid-full, .grid-half, .grid-mid {width:100%; }

}

@media screen and (max-width: 768px) {
header {text-align:center; height:108px; margin-left:18px;}
.toplinks {left:0; width:100%;}
.trail-gator-logo {position:relative; top:20%; padding:1.5%; left:auto; margin:0 auto; width:90%;}
.h-cart {display:none;}
.main-content {/*padding-left:6%;*/ margin-left:6.5%; width:93.5%; }
.leftmenu {background:#FFFFFF; border-radius:0;}
.leftmenu li a{ padding:18px 8px; line-height:1.5em}
.mm-icon {display:block;}


.sidebar-left {/*display:none;*/ float:none; margin-left:-300px; position:fixed; top:0; width:320px; padding:0; background:none; 
transition: all 0.5s; min-height:480px; max-height:960px; height:100%;overflow-y: auto; z-index:100;
}
.sidebar-left:hover {margin-left:0!important;}
.center-col{ float:none;width:100%}

.mobilemenu {display:block;}
.topmenu {left:0; width:100%; top:140px; display:none;}
.topmenu li{float:none; background:#000; border:none; border-bottom:1px #fff solid; border-top:1px #fff solid; margin:0; padding:10px 1%; border-radius: 0; font-weight:bold;}
.topmenu li:first-child {display:none;}
.grid-4 {width:49%;}

table.product_list td.price {min-width:70px;}
table.product_list td.priceoffer {min-width:70px;}
}
@media screen and (max-width: 580px) {
.trail-gator-logo {padding:1%; width:100%;}
.payments {position:relative; top:auto;  right:auto;}
.footer {height:auto; padding:10px; text-align:center; background:#83c116;}
.keywords {display:none;}
.fleft, .fright {float:none;}
}
@media screen and (max-width: 500px) {
.trail-gator-logo {top:25%;}
.mainimage {float:none; margin:0 auto; text-align:center; overflow:hidden;}
.buyarea { margin:0 auto;}
.bookmarkarea {border:# #999999 solid 1px;  margin:0 auto;  padding:10px;}


}
@media screen and (max-width: 400px) {
.trail-gator-logo {top:30%;}
}




h1.title {margin:0; padding:5px 0px; font-size:1.1em;}
h2.sub {margin:0; padding:5px 0px; font-size:1em;}

.box { margin:5px; border:2px #84c513 solid; padding:2px; background:#FFFFFF; margin-bottom:5px; text-align:center;}
.box p {margin:0; font-size:0.8em; padding-bottom:5px;}

.categories {width:98%; border:0px #666 dashed; overflow:hidden; margin:0 auto;}
.acc_cat {float:left; width:15%; min-width:100px; margin:0.5%;  text-align:center;}
.acc_cat a {background:#87c618; text-decoration:none; color:#000; font-size:0.9em; display:block;  height:44px;  padding:2px 4px;  line-height:21px;}
.acc_cat a:hover {background:#99e317;}


.pagetitle {font-size:1.5em;}


#mid_col .buyarea p {padding:6px; font-size:1em; margin:0;  text-align:center;}
#mid_col p.small { font-size:0.8em; padding:0 margin:0;}


.notice {margin:0 auto; border:2px #F00 solid; font-weight:bold; padding:10px; margin-top:10px; width:80%}
.inner_notice {background:url(../images/overlay-white-78.png); border:#FFF 2px solid; }

.xmas {background:#a90101 url(../images/christmas-bg-1000.jpg) center center no-repeat;}
.newyear {background:#a90101 url(../images/new-year-bg.jpg) top center no-repeat;}

/* SHOPPING CART */

#keywords {padding:10px; font-size:10px; text-align:center;}
.footerlinks {margin-left:50%;}

#googleCheckoutLogo{ float:left; padding-top:5px margin:}
#paypallogo {/*float:right;*/}
.footerlinks a{color:#333; }
.footerlinks a:hover {color:#000;}