/* ==========================================================================
   Start of custom Webflow CSS
   custom colors used:
   dark (not black) text:				rgb(58, 42, 32)
     also pic outline
   silver/headers:					rgb(204, 204, 204)
     also feature-box background
   bright but not 100% white text:			rgb(245,245,245)
   Golden text:						#E2AE22
   Beige:						#E3E3BB
   Sage text:						#D0DDCC
   dark red desktop background:				rgb(64,0,0)
   Dark red text (headers in feature-box):              #380000
   ligher red content area:				rgba(153,0,0,.39)   
   ========================================================================== */
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,600,100,700|Righteous:400);
html { scroll-behavior: smooth }
body {
  display: table;
  margin-top: 7px;
  height: 100%;
  width: 100%;
  background-size: auto;
  font-size: 100%;
  color: #E3E3BB;
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  background: rgb(64,0,0) url('../img/WoodyGrill-dk.jpg');
  background-repeat: repeat-y;
  /*
  background-attachment: fixed;
  */
  background-size: 100%;
}
p {
  font-size: 110%;
  font-weight: 400;
  font-family: 'Montserrat', sans-serif;
  text-align: left;
  margin-left: 1em;
  margin-right: 1em;
}
li {
  font-size: 105%;
  margin-bottom: 5px;
  margin-top: 5px;
}
hr {
  border: 2px solid #D0DDCC;
  border-radius: 2px;
  margin-left: 10%;
  margin-right: 10%;
}
.hr-main {
  border: 2px solid rgb(32,22,22);
}
p.drop-cap::first-letter {
  float: left;
  font-size: 4em;
  font-weight: 600;
  margin: 0 .1em 0 0;
  line-height: 0.85;
  color: #640000;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  background-image: radial-gradient(rgba(255,255,255,.5), rgba(218,231,214,.2));
}
p.drop-cap::first-line {
  font-size: 1.25em;
  font-weight: 600;
  color: #380000;
}
.main {
  max-width: 960px;
  margin: auto;
}
.navbar {
  border-radius: 7px;
  display: table;
  background: rgba(64,0,0,.75);
}
.navbar a {
  display: block;
  color: #D0DDCC;
}
.big { font-size: 200%; }
.socbar {
  display: block;
  font-size: 225%;
  font-weight: 700;
  font-family: 'Righteous', sans-serif;
  color: rgb(204, 204, 204);
}
.socbar a,
.socbar p {
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 7px;
}
.sharperglow {
    text-shadow: 1px 0px 0px rgba(255,255,255,.2), 1px 1px 0px rgba(255,255,255,.2), 0px 1px 0px rgba(255,255,255,.2), 
    -1px 1px 0px rgba(255,255,255,.2), -1px 0px 0px rgba(255,255,255,.2), -1px -1px 0px rgba(255,255,255,.2), 
    0px -1px 0px rgba(255,255,255,.2), 1px -1px 0px rgba(255,255,255,.2), 1px 4px 5px rgba(255,255,255,.2);
}
.centergrad {
background: -moz-linear-gradient(left,  rgba(64,0,0,0) 0%, rgba(51,0,0,0.9) 10%, rgba(0,0,0,0.9) 50%, rgba(51,0,0,0.9) 90%, rgba(64,0,0,0) 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(64,0,0,0)), color-stop(10%,rgba(51,0,0,0.9)), color-stop(50%,rgba(0,0,0,0.9)), color-stop(90%,rgba(51,0,0,0.9)), color-stop(100%,rgba(64,0,0,0)));
background: -webkit-linear-gradient(left,  rgba(64,0,0,0) 0%,rgba(51,0,0,0.9) 10%,rgba(0,0,0,0.9) 50%,rgba(51,0,0,0.9) 90%,rgba(64,0,0,0) 100%);
background: -o-linear-gradient(left,  rgba(64,0,0,0) 0%,rgba(51,0,0,0.9) 10%,rgba(0,0,0,0.9) 50%,rgba(51,0,0,0.9) 90%,rgba(64,0,0,0) 100%);
background: -ms-linear-gradient(left,  rgba(64,0,0,0) 0%,rgba(51,0,0,0.9) 10%,rgba(0,0,0,0.9) 50%,rgba(51,0,0,0.9) 90%,rgba(64,0,0,0) 100%);
background: linear-gradient(to right,  rgba(64,0,0,0) 0%,rgba(51,0,0,0.9) 10%,rgba(0,0,0,0.9) 50%,rgba(51,0,0,0.9) 90%,rgba(64,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00400000', endColorstr='#00400000',GradientType=1 );
}
.dropshadow {
  -webkit-filter: drop-shadow(12px 12px 7px rgba(0,0,0,0.5));
  filter: drop-shadow(12px 12px 7px rgba(0,0,0,0.5));
}
.note,
.note p {
  font-size: .9em;
}
.w-container {
  background: #232F23;
  border: 3px solid black;
  outline: #ffffff solid 5px;
  border-radius: 7px;
  /* padding: 7px; */
}
.nav .w-container{
  background: rgba(128,0,0,.9);
  border: none;
}
.narrow,
.reviews-section {
  max-width: 640px;
  margin: auto;
}
img {
    max-width:100%;
    height:auto;
}
h1 {
  font-family: 'Righteous', sans-serif;
  font-weight: 400;
  padding-bottom: 8px;
  color: #D0DDCC;
  margin-left: 1em;
  margin-right: 1em;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
h2 {
  font-family: 'Righteous', sans-serif;
  font-weight: 400;
  padding-bottom: 8px;
  text-align: center;
  color: #D0DDCC;
  margin-left: 1em;
  margin-right: 1em;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
h3 {
  margin-top: 12px;
  margin-bottom: 12px;
  padding-top: 4px;
  padding-bottom: 8px;
  color: #D0DDCC;
  text-align: center;
  font-family: 'Righteous', sans-serif;
  font-weight: 400;
  margin-left: 1em;
  margin-right: 1em;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
h4 {
  font-family: 'Righteous', sans-serif;
  font-weight: 400;
  text-align: center;
  margin-left: 1em;
  margin-right: 1em;
  font-size: 115%;
}
h5 {
  color: #D0DDCC;
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: 1.25em;
  font-family: 'Righteous', sans-serif;
  font-weight: 400;
  margin-left: 2em;
  margin-right: 2em;
  font-size: 115%;
}
h6 {
  color: #D0DDCC;
  margin-top: 10px;
  margin-bottom: 10px;
  font-family: 'Righteous', sans-serif;
  font-weight: 400;
  margin-left: 2em;
  margin-right: 2em;
  font-size: 115%;
}
dt {
  font-family: 'Righteous', sans-serif;
  font-weight: 700;
}
a:link, a:visited {
  color: rgb(204, 204, 204);
  /*
  text-shadow: 0px 0px 3px rgba(128,128,128,.5);,
  */
  text-decoration: none;
}
a:active {
  color: rgb(255, 255, 255);
}
a:hover {
  color: #380000;		
  background-color: #D0DDCC;	
  text-shadow: none;
  -webkit-transition: color .3s, background-color .3s, text-shadow .3s;
  transition: color .3s, background-color .3s, text-shadow .3s;
  transition-timing-function: ease;
}
.right-column {
  padding: 100px 40px;
}
.nav {
  position: fixed;
  border: 0px solid transparent;
  max-width: 100%;
  left: 0px;
  top: 0px;
  right: 0px;
  /*
  height: 7.3em;
  min-height: 7.3em;
  max-width: 960px;
  margin-right: auto;
  margin-left: auto;
  background-color: rgba(64, 0, 0, 0.9);
  background-color: rgba(0,0,0,.9);
  */
}
.spacer {
  height: 3.1em;
  min-height: 3.1em;
}
.spacer-s {
  height: 2.5em;
  min-height: 2.5em;
}
.navlink {
  font-size: 85%;
  font-family: 'Righteous', sans-serif;
  font-weight: 300;
  color: white;
  top: 0px;
  right: 0px;
  display: inline;
  padding: 3px;
  float: left;
  clear: none;
  border: 3px solid transparent;
  border-radius: 7px;
  /*
  text-shadow: 1px 1px 1px #160000;, 
  */
}
.listlink,
.listlink p {
  margin: 10px;
  font-size: 85%;
  min-height: 1.25em;
  font-family: 'Righteous', sans-serif;
  font-weight: 300;
}
.menuicon {
  background-color: transparent;
}
.navlink:hover,
.menuicon:hover,
.listlink a:hover {
  color: black;
  background-color: rgb(204, 204, 204);
  text-shadow: none;
  -webkit-transition: color .3s, background-color .3s, text-shadow .3s;
  transition: color .3s, background-color .3s, text-shadow .3s;
  transition-timing-function: ease;
}
.navlink:active {
  /*
  background-color: rgba(64, 32, 32, .5);
  */
}
.navbrand {
  // logo ratio: 2.698630136986301
  border-radius: 7px;
  max-width: 7.5em;
  max-height: 2.8em;
  
}
.navbrand .navlink:hover,
.navbrand:hover  {
  background-color: rgb(98, 0, 0);
  opacity: 100%;
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  transition-timing-function: ease;
}
.productlogo {
  margin-left: auto;
  margin-right: auto;
  padding: 15px;
  display: block;
  float: none;
  max-width: 100%
}
.product_image {
  margin-left: auto;
  margin-right: auto;
}
.pic {
  margin-bottom: 7px;
  margin-top: 1px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  border: 3px solid rgb(58, 42, 32);
  border-radius: 7px;
  max-width: 100%;
}
.product-pic {
  margin-bottom: 7px;
  margin-top: 1px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  border: 3px solid transparent;
  border-radius: 7px;
  max-width: 96%;
}
.linkbar {
  display: table-row;
}
.linkbar p {
  position: relative;
  display: inline-block;
  vertical-align: top;
  text-decoration: none;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  font-size: 85%;
  font-family: 'Righteous', sans-serif;
  font-weight: 700;
  position: relative;
  float: left;
  padding: 0px;
}
.linkbar a:link,
.linkbar a:visited {
  /* padding: 9px; */
  border-radius: 7px;
  text-decoration: none;
  line-height: 2.5em;
  padding: 7px;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
.linkbar a:hover {
  text-shadow: none;
}
.totop {
  text-align: center;
  opacity: .66;
  //margin: auto;
  margin-left: -25%;
  position: relative;
  //width: 100%;
  //min-width: 200px;
  display: block;
  border-radius: 7px;
  text-decoration: none;
  font-size: 1em;
  font-weight: 700;
  color: rgba(204, 0, 0, .33);
  display: inline-block;
  padding: 5px;
}
.backtotop {
  text-align: center;
  opacity: .75;
  width: 100%;
  /*
  position: relative;
  margin-left: auto;
  margin-right: auto;
  max-width: 960px;
  min-width: 200px;
  display: block;
  */
  border-radius: 7px;
  text-decoration: none;
  font-size: 2em;
  font-weight: 700;
  color: rgba(64, 0, 0, 1);
  display: inline-block;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 20px;
  padding-right: 20px;
}
.backtotop h4 {
  color: rgb(64,0,0);
}
.whitebg {background-color: white;}
.backtotop a:hover,
a:hover .backtotop,
.backtotop:hover {
  color: black;
  background-color: rgba(204, 0, 0, 0.25);
  text-shadow: none;, 
  -webkit-transition: color .5s, background-color .5s, text-shadow .5s;
  transition: color .5s, background-color .5s, text-shadow .5s;
  transition-timing-function: ease;
}
.topshade {background-image: linear-gradient(#D0DDCC, white, white, #D0DDCC);
}
.description-box {
  padding: 13px;
  text-align: left;
}
.feature-box {
  padding: 13px;
  border: 1px solid #73543f;
  border-radius: 7px;
  color: black;
  background-color: rgb(204, 204, 204);
  text-align: left;
}
.lister p {
  padding: 13px;
  border: 1px solid #73543f;
  border-radius: 7px;
  background-color: rgb(204, 204, 204);
  color: black;
  color: #4E3F36;
  font-family: 'Righteous', sans-serif;
  font-weight: 300;
}
.description-box p,
.feature-box p {
  margin-top: 10px;
  margin-bottom: 12px;
}
.feature-box h1,
.feature-box h2,
.feature-box h3,
.feature-box h4,
.feature-box h5,
.feature-box h6  {
  color: #380000;
}
.navmenu {
  max-width: 75%;
}
.buy-now-box {
  padding: 9px;
  border: 1px solid black;
  background-color: #FFFAE8;
  background-color: rgba(235, 232, 200, 1);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 6px;
  color: black;
  max-width: 100%;
  text-align: center;
  border-radius: 7px;
}
.buy-now-box p {
  text-align: center;
}
.sale {
  color: Black;
  font-size: 100%;
  font-family: 'Righteous', sans-serif;
  font-weight: 900;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.price {
  color: #4E3F36;
  font-size: 100%;
  font-family: 'Righteous', sans-serif;
  font-weight: 700;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.fineprint {
  font-size: 72%;
  color: #777;
  margin-left: 20px;
  margin-right: 20px;
  display: block;
  font-family: 'Montserrat', sans-serif;
}
.fineprint a {
    font-weight: bold;
}
.detail {
  font-size: 75%;
}
.details-box {
  padding: 7px;
  border: none;
  color: #4E3F36;
  background-color: rgb(204, 204, 204);
  max-width: 100%;
  margin-left: auto;
  border-radius: 7px;
  margin-right: auto;
  text-align: left;
}
.details-box p {
  font-size: 85%;
  margin-top: 5px;
  margin-bottom: 5px;
  text-align: left;
}
.feature-box a:link,
.lister a:link,
.feature-box a:visited,
.lister a:visited,
.buy-now-box a:visited,
.buy-now-box a:link,
.details-box a:link,
.details-box a:visited {
  color: #00005C;
  text-decoration: none;
}
.feature-box a:active, .lister a:active, .buy-now-box a:active, .details-box a:active {
  color: #470047;
}
.feature-box a:hover,
.lister a:hover,
.buy-now-box a:hover,
.details-box a:hover {
  color: white;
  background-color: gray;
  -webkit-transition: color .3s, background-color .3s;
  transition: color .3s, background-color .3s;
  transition-timing-function: ease;
}
.feature-box a:hover img,
.lister a:hover img,
.buy-now-box a:hover img,
.details-box a:hover img,
a:hover .pic
{
  background-color: white;
  border-color: white;
  -webkit-transition: border-color .3s, background-color .3s;
  transition: border-color .3s, background-color .3s;
  transition-timing-function: ease;
}
.btn-order-now {
  background-color:#CCCC99;
  color: #3A2A20;
  font-size: 1.125em;
  font-weight: 700;
  border-radius: 2em;;
  -webkit-border-radius: 2em;
  -moz-border-radius: 2em;
  border: 0px none;
  text-shadow: #3D3D2E 0 -1px 0;
  line-height: 1.5em;
  min-width: 6.7em;
  min-height: 2em;
}

.btn-view-cart {
  background-color:#CCCC99;
  color: #3A2A20;
  font-size: 1em;
  font-weight: 700;
  border-radius: .9em;
  -webkit-border-radius: .9em;
  -moz-border-radius: .9em;
  border: 0px none;
  line-height: auto;
  width: auto;
  height: auto;
  vertical-align: bottom;
  margin: 10px;
  float: left;
}  
.button::before {
    -webkit-box-shadow: #959595 0 2px 5px;
    -moz-box-shadow: #959595 0 2px 5px;
    box-shadow: #959595 0 2px 5px;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%; padding-left:0; padding-right:0; padding-top:2px; padding-bottom:0 }
.button.orange {
    background: #CCCC99;
    border: outset 1px #eab551;
    border-bottom: solid 4px #D1D1A3;
    box-shadow: inset 0 0 0 1px #fee9aa;
    color: #4E3F36;
    text-shadow: 0 1px 0 #E5C78C; 
    vertical-align: bottom;
}
.btn-view-cart.button.orange {
    border-bottom: solid 1px #D1D1A3;
}   
.button.orange:hover {
    background: #FEDB85;
    border: outset 1px #e6a93d;
    border-bottom: solid 4px #b98a37;
    box-shadow: inset 0 0 0 1px #fedb98; 

    -webkit-transition: background .3s, border .3s, border-bottom .3s, box-shadow .3s;
    transition: background .3s, border .3s, border-bottom .3s, box-shadow .3s;
    transition-timing-function: ease;
}
.btn-view-cart.button.orange:hover {
    border-bottom: solid 1px #b98a37;
    -webkit-transition: background .3s, border .3s, border-bottom .3s, box-shadow .3s;
    transition: background .3s, border .3s, border-bottom .3s, box-shadow .3s;
    transition-timing-function: ease;
}
.button.orange:active {
    background: #f9bd4f;
    border: solid 1px #a77f35;
    border-bottom: solid 4px transparent;
    box-shadow: inset 0 10px 15px 0 #dba646; 
    
    -webkit-transition: background .1s, border .1s, border-bottom .1s, box-shadow .1s;
    transition: background .1s, border .1s, border-bottom .1s, box-shadow .1s;
    transition-timing-function: ease;
}
.btn-view-cart.button.orange:active {
    border-bottom: solid 1px transparent;
    box-shadow: inset 0 3px 7px 0 #dba646; 
    -webkit-transition: background .1s, border .1s, border-bottom .1s, box-shadow .1s;
    transition: background .1s, border .1s, border-bottom .1s, box-shadow .1s;
    transition-timing-function: ease;
}  
.demo-box {
  padding: 14px;
  margin: 6px;
  border: 1px solid black;
  border-radius: 7px;
  color: black;
  background-color: rgb(204, 204, 204);;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.demo-box p {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
}
.demo-box h1,
.demo-box h2,
.demo-box h3,
.demo-box h4,
.demo-box h5,
.demo-box h6 {
  color: Black;
}
.demo-box a:link,
.demo-box a:visited {
  color: #00005C;
  text-decoration: none;
  font-family: 'Righteous', sans-serif;
  font-weight: 300;
}
.demo-box a:active {
  color: #470047;
}
.demo-box a:hover {
  color: white;
  background-color: gray;
}
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.sc-container iframe,
.sc-container object,
.sc-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
}
.reviews-section h4,
.clips-section h4 {
  margin-bottom: 10px;
}
.main {
  max-width: 960px;
  margin: auto;
}
.tagline,
.w-col h3 {
  color: White;
  text-align: center;
  letter-spacing: 3px;
  line-height: 1.5;
  font-size: 100%;
  margin-top: 25px;
  margin-bottom:25px;
  font-family: "Montserrat", sans-serif;
}
.thin,
.w-col h3 {
  font-family: "Montserrat", sans-serif;
  font-weight: 100;
}
.spacedthin {
  font-family: "Montserrat", sans-serif;
  font-weight: 100;
  color: GhostWhite;
  text-align: center;
  letter-spacing: 4px;
  font-size: 120%;
  margin-top: 25px;
  margin-bottom:25px;
} 
.red, .red a, .red p a {
  color: rgb(64,0,0);
  font-weight: 700;
  font-size: 110%;
}
.red a:hover {
  color: white;
  background-color: rgb(64,0,0);
}
  
.black, .black a, .black p a {
  color: black;
}
.box a {
  font-size: 85%;
  font-weight: 400;
  color: White;
  border-radius: 7px;
  text-decoration: none;
  /*
  text-shadow: 1px 1px 1px #160000;, 
  */
}
.boxes {
  display:table;
  border-radius: 7px;
  width: 100%;
  /*
  height: 80%;
  */
  height: auto;
  vertical-align: top;
}
.x6 {
  width: 17%;
  min-width: 17%;
  max-width: 17%;
}
.x5 {
  width: 20%;
  min-width: 20%;
  max-width: 20%;
}
.x4 {
  width: 25%;
  min-width: 25%;
  max-width: 25%;
}
.x3 {
  width: 33%;
  min-width: 33%;
  max-width: 33%;
}
.x2 {
  width: 50%;
  min-width: 50%;
  max-width: 50%;
}
.x1 {
  width: 100%;
}
.box, .optgroup {
  display: table-cell;
  margin: auto;
  text-align: center;
  padding: 0px;
  border-radius: 7px;
  vertical-align: top;
}
.box .box {
  padding: 10px;
}
.dirt {
}
.titleshade {
  background: radial-gradient(rgba(204,0,0,.7), rgba(64,0,0,.5), rgba(38,0,0,.15), rgba(48,0,0,0));
}
.titleshade a:hover { background-color: transparent; }
.prodicon p {
  color: DimGray;
  margin-left: 15%;
  margin-right: 15%;
  text-align: center;
}
.box h5,
.prodicon h5 {
  color: Gray;
  margin-top: 10px;
  margin-bottom: 10px;
}
.prodicon h4 {
  white-space: nowrap;
  color: transparent;
}
.prodicon a p,
.prodicon a h4,
.dirt a p,
.dirt a h4 {
  text-shadow: none;
}
.topnav {
  display: table;
  width: 100%;
  max-width: 960px;
  margin: auto;
  background: rgba(49,22,5,.5);
  //width: 85%;
  //width: 100%;
  //max-width: 100%;
  //margin-left: 7.5%;
  //background: rgba(64,0,0,.5);
}
.topnav p {
  text-align: center;
  display: table-cell;
  float: none;
  white-space: nowrap;
  font-weight: 300;
}
.prodicon {
  border-radius: 7px;
  border: 0px solid transparent;
  margin: 5px;
  padding: 5px;
  text-decoration: none;
  width: auto;
}
.fullwidth, .fullwidth a {
  display: table-cell;
  width: 100%;
  max-width: 100%;
}
.prodicon p {
  border-radius: 7px;
  padding: 5px;
}
.box:hover {
  background-color: transparent;
}
.prodicon:hover p {
  -webkit-transition: color .5s, background .5s;
  transition: color .5s, background .5s;
  transition-timing-function: ease;
  color: white;
  background: rgb(64,0,0,.33);
  /*
  text-shadow: none;
  */
}
a.box:hover {
  -webkit-transition: color .5s, background 1s;
  transition: color .5s, background 1s;
  transition-timing-function: ease;
  color: white;
  background: radial-gradient(red, rgb(118,0,0), rgb(64,0,0));  
}
.prodicon:hover h5 {
  color: yellow;
  text-shadow: 1px 1px black;
  -webkit-transition: color .5s, text-shadow .5s;
  transition-timing-function: ease;
  transition: color .5s, text-shadow .5s;
}
.box:hover .tagline {
  color: White;
  -webkit-transistion: color .3s;
  transition-timing-function: ease;
  transition: color .3s;
}
.prodicon h4 {
  margin: 5px;
}
.prodicon:hover h4 {
  -webkit-transition: color 1s, text-shadow 1s;
  transition: color 1s, text-shadow 1s;
  transition-timing-function: ease;
  color: Silver;
  text-shadow: 1px 1px black;
}
@media screen and (max-width: 991px) {
  .nav {
    height: 3.5em;
  }
  .spacer {
    max-height: 3.7em;
    min-height: 3.7em;
    height: 3.7em;
  }
  .navlink {
    right: 0px;
    min-height: 40px;
    padding: 6px 9px 0px;
    clear: none;
  }
  .navmenu {
    top: 0px;
    right: 0px;
    max-width: 100%;
    float: right;
    background: rgba(64,0,0,.9);
    /*
    background: url('../img/redweave66.png'); 
    */
  }
  .w-nav-button  {
    padding: 0px;
    color: white;
    border-radius: 7px;
    font-weight: 700;
    margin-top: 10px;;
    margin-right: 10px;
    background-color: transparent;
    }
  .menuicon,
  .w-icon-nav-menu {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 15px;
    padding-right: 15px;
    border-radius: 7px;
  }
    .main {
        max-width: 728px;
    }
}
@media screen and (max-width: 767px) {
  .spacer-s {
    height: 1.5em;
    min-height: 1.5em;
  }
    .box {
        display: block;
        width: 100%;
    }
  .topnav {
    margin-left: 0;
  }
    .x1, .x2, .x3, .x4, .x5, x6 {
      max-width: 100%;
    }
    .nav-table {
      margin-top: 0;
   }
    .w-col-4,
    .w-col-6 {
        width: 50%;
        left: auto;
        right: auto
  }
  .main {
      margin-left: 0;
      margin-right: 0;
      max-width: 98%;
  }  
  .navmenu {
    padding: 0px;
    margin: 0px;
  }
  .w-nav-button  {
    margin-top: 10px;;
    margin-right: 10px;
    }
  .w-container {
    padding-top: 0px;
    max-width: 98%;
  }
  a {
    padding: 7px;
    min-height: 16px;
  }
  .titleshade a {
    padding: 0px;
    min-height: 0em;
  }
  .productlogo {
    max-width: 90%;
  }
  .details-box, .buy-now-box {
    max-width: 100%;
  }
  .right-column {
    padding-bottom: 50px;
  }
  .navlink {
  }
  .nav {
    max-height: 3em;
    min-height: 3em;
    height: 3em;
  }
  .spacer {
    max-height: 3.5em;
    min-height: 3.5em;
    height: 3.5em;
  }
  .navbrand {
    //max-width: 150px;
    max-height: 3.1em;
    padding: 0;
    top: 0;
    left: 5px;
    margin-right: 10px;
    }  
  .navmenu.w--open {
  }
}
@media screen and (max-width: 640px) {
  .w-col {
    width: 100%;
    max-width: 100%;
  }
  .nav {
    max-height: 3.5em;
    min-height: 3.5em;
    height: 3.5em;
  }
  .spacer {
    max-height: 3.7em;
    min-height: 3.7em;
    height: 3.7em;
  }
  .navbrand {
    min-height: 2.8em;
    min-width: 7.8em;
  }  
}
@media screen and (max-width: 467px) {
  .nav {
    max-height: 3.0em;
    min-height: 3.0em;
    height: 3.0em;
  }
  .backtotop {
    font-size: 1em;
  }
  .w-container {
  }
  .topnav, .navbar, .linkbar{
    width: 100%;
    max-width: 100%;
    padding: 0px;
    margin-left: 0;
  }
  .w-col, .main {
      width: 100%;
      max-width: 100%;
  }
  .pic, .product-pic {
    max-width: 90%;
  }
  .description-box,
  .feature-box {
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 3px;
    padding-right: 3px;
  }
  .productlogo {
    /* max-width: 175px;
    padding: 1px; */
  }
  .details-box, .buy-now-box {
    max-width: 100%;
  }
  .demo-box {
    padding: 4px;
    margin-top: 2px;
    margin-bottom: 2px;
  }
  .linky a {
    padding: 9px;
    min-height: 16px;
  }
  .details-box p {
    font-size: .75em;
  }
  h1, h2, h3 {
    font-size: 95%;
  }
  .reviews-section h2,
  .clips-section h2 {
    margin-bottom: 10px;
    line-height: 1.5em;
  }
  .navbrand {
    min-height: 2.2em;
    min-width: 6em;
  }  
}
@font-face {
  font-family: 'Entypo Icons';
  src: url('../ttf/entypo.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
    font-family: 'Mono Social Icons Font';
    src: url('../ttf/MonoSocialIconsFont-1.10.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.symbol, a.symbol:before {
    font-family: 'Mono Social Icons Font';
    text-decoration: none;
}
a.symbol:before {
    content: attr(title);
    text-decoration: none;
}