/*html {  scroll-behavior: smooth;} */

* {  -webkit-text-size-adjust: none;}  /* Fuck Chrome  */

@keyframes fadein { from { opacity: 0; }  to   { opacity: 1; } }

/*@keyframes scroll {  0% { opacity: 1; transform: translateY(0);}  100% { opacity: 0; transform: translateY(20px);}}*/

body { top:11vw;  animation: fadein 1.5s; font-size: calc(10px + (36-14) * ((100vw - 300px) / (1900 - 300))); color: #000; width: 98%; background-color:#FFF; }   /* blue=2A2DA5 */ 
    
  

@font-face {  font-family: gaston;  src: url('fonts/gaston.TTF');}    
@font-face {  font-family: bow;  src: url('fonts/bow.TTF');}
@font-face {  font-family: bimini;  src: url('fonts/bimini.ttf');}


.container { position: relative; display:; top:0vw; left: 0vw; width: 101%; #max-width: 1050px; height: auto; #margin: 0vw 0vw;  #border: 2px dashed #777; }

a.anchor { display: block; position: relative; top: -2vw; visibility: hidden;0}
a { text-decoration: none; margin: 0 .3vw;  } /* removed blue underline from links */
a:visited {  color: #000;}
table {position:relative; width:99%; #background:lime;}
td {  padding:1vw; border:none; font-size:2vw;}

td.minibanner {  padding:1vw; border:none; font-size:2.3vw;}
tr { vertical-align: middle; }
p {display:block;}

 /*Changed <li> dot to a checkmark 
ul {  list-style: none;}
ul li:before {content:"\2713\0020";}*/
ul {text-align:left;}
li { font-size:.8em;  padding: .5vw; color:#000 }

.banner-container { position: relative; display:inline; font-size: 2.5vw; top:0vw; left: 0vw; width: 98%; #max-width:990px; height: 5vw; background-color: #FFF; #overflow: auto;  z-index:3; #border: 2px dashed red;}

.banner {  position: center; display:inline-block; font-size:1em; #font-weight:500;  padding:1vw; width:97%; height:auto;  color:#000; background-color: #FFF; #border: 2px dashed red; }

.minibanner {  position: relative; display:inline; font-size:.8em;  padding:1.2vw; left:0vw; width:90%; height:5vw;  color:#000; #background: linear-gradient(0deg, rgba(253,253,255,1) 0%, rgba(221,221,222,1) 76%, rgba(211,213,213,1) 100%); box-shadow: -12px 0px 19px  #ccc, 12px 10px 19px  #CCC;border-radius: 12px;#border: 2px dashed lime;}

.banner-row-main { position: relative; display:inline; top:-5vw; text-align:center; vertical-align: middle; background: #FFF; #border: 2px dashed blue; }

.banner-row-mini { position: relative; display:center; #left: .3vw; text-align:center; vertical-align: middle; font-size: .5vw; background: #FFF; #border: 2px dashed blue; }

.mini_header {  position:fixed; display:center; top:-100px; left:0vw; height:4.5vw; width: 100%; padding-top: .5vw; padding-bottom: 6px; background: none;   transition: all .7s; opacity: ; z-index: 999; #border: 2px solid lime;}

.banner2 { position: fixed center;  width:84%;  #text-align:center; #vertical-align: middle;  #font-size: 5vw; #background:   #faf7f7  ;  #overflow: auto; #border: 2px dashed blue; }

/* NEC background imgae */
.bg-image { position:relative; width:90%; height: 46vw; top:-2vw; left:0vw; padding-top: 4vw; background-image: url(../img/bg33333.png); background-attachment: fixed;  background-repeat: no-repeat; background-position: center; #background-size: cover; border-radius:1.5vw; #border: 2px dashed blue; }

.sticky {  background-color: #FFF;  opacity: 1;  top: 0px; #box-shadow: 1px 1px 0px 1px  #ccc;}

.bg-colors { position:absolute; display:block; top: 2vw; right:0vw; }
.bg-color { width:2.3vw; height:auto; color:#f1f1f1;}

.content-container-mainpage {position: relative; width:99%;  padding:0vw; height: auto; top:3vw; left:0vw; background-color:#FFF; #border: 2px solid lime; }

.content-container {position: relative; width:99%;  padding:0vw; height: auto; top:3vw; left:1vw; background-color:#FFF; #border: 2px solid lime; }

.content { position:center; display:block; top:-1vw; left:0vw; width:90%; height:auto; background-color: #FFF; #border: 2px dashed red;}

.row { position:relative; text-align:;   width: 52%; padding: 2vw 2vw; color:#000;  border-radius: 1.5vw; box-shadow: -12px 0px 19px  #ccc, 12px 10px 19px  #CCC; #border:1px solid #ccc; #overflow: hidden; }

.float-right {dsiplay:inline; float:right; width:32vw;  #border:1px solid #ccc;}

.row2 { position:relative; text-align:left;   width: 55%; padding: 5vw 3vw; color:#000; font-size: 2vw;border-radius: 1.5vw; box-shadow: -12px 0px 19px  #ccc, 12px 10px 19px  #CCC; #border:1px solid #ccc; #overflow: hidden; }

.title{ position: relative; z-index:999;}

.logo { position:relative; top:0vw; width:auto;  height:32vw; #border: 2px dashed red;}
.manuf-logo-w { position:relative; top:-2.5vw; width:11vw; max-width: 220px; height:auto; #border: 2px dashed red;}
.manuf-logo-h { position:relative; top:-2.5vw;  width:auto; height:3vw; #max-height: 220px;#border: 2px dashed red;}
.mini-logo { poistion:center; height: 3vw; width:auto; top:-1vw; margin: 0vw 0vw; }
.supertech { height:20vw;}
.laddertech { height:30vw;  max-width:370px;}
.hti {  position:relative; top:0vw; width: auto; max-width:900px; height: 10vw; border-radius: 1vw; #border-style:ridge; }
.hti2 {  height:3vw; width:auto;  }
.title { height:auto; width:55vw; }


.width {position:fixed; right:1.5vw; top:2vw; font-size:1em; color:#ccc; #border:1px solid red; z-index:77; }

.hide{position:fixed; right:1vw; top:1vw; width:5vw; height:4vw;  #border:1px dashed black;  z-index:88; }
.show{position:fixed;  right:1vw; top:1vw; width:5.2vw; height:4vw; background:#fff; z-index:88; }

/* Using 'em' for IMAGES is based on FONT size within BODY class */
.pic1  { top:-1vw; width: 1em; height: auto; border:none;}
.pic2 { top:-1vw; width: 2em; height: auto; border:none;}
.pic3 { top:-1vw; width: 3em; height: auto; border:none;}
.pic35 { top:-1vw; width: 3.5em; height: auto; border:none;}
.pic4 { top:-1vw; width: 4em; height: auto; border:none;}
.pic5 { top:-1vw; width: 5em; height: auto; border:none;}
.pic6 { top:-1vw; width: 6em; height: auto; border:none;}
.pic7 { top:-1vw; width: 7em; height: auto; border:none;}
.pic8 { top:-1vw; width: 8em; height: auto; border:none;}
.pic9 { top:-1vw; width: 9em; height: auto; border:none;}
.pic10 { top:-1vw; width: 10em; height: auto; border:none;}
.pic11 { top:-1vw; width: 11em; height: auto; border:none;}
.pic12 { top:-1vw; width: 12em; height: auto; border:none;}
.pic13 { top:-1vw; width: 13em; height: auto; border:none;}
.pic14 { top:-1vw; width: 14em; height: auto; border:none;}
.pic15 { top:-1vw; width: 15em; height: auto; border:none;}

.picbutton {height:60%; width:90%; border-radius: .5vw; box-shadow: 3px 3px 2px 2px #ccc;}
.buttonpic {width:13vw; height:auto;}

.button { display: flex;  #height: 2.5vw; width:auto; font-size: 3vw; padding:1.5vw; box-shadow: -8px 0px 9px  #ccc; border-radius:1.4vw; #color:fff; background-color:#fff; #border:none; }
    .button:hover {#background:#ccc;}
    .button:active {#box-shadow: inset 4px 4px #ccc; transform:translateY(3px);}
    .button:focus {  outline:red; }

.button2 { display: flex;  width:auto; font-size: 3vw; padding:1.5vw;  background-color:#fff; }
    .button2:active { transform:translateY(7px);}    
 
.button3 /* brochure needs to be smaller */ { display: inline;  width:14vw; font-size: 3vw; padding:1.5vw;  background-color:#fff; }
    .button3:active { transform:translateY(7px);}      
    
    .top {position:relative; top:-3vw; }
.more { position: relative; top:-1vw; left:19vw; width:3vw; font-size: 1.2vw; color:blue; background-color:#fff; }
.web { width:30vw; height:20vw;}
.popup1 { width: 75vw;  height: auto;}
.popup2 { width: 55vw;  height: auto;}
.icon { width: auto; height: 9vw; }
.icon2 { width: 16vw; height: auto; }
.quote { position:relative; left:0vw; top:-1vw; width:12vw;  #border: 1px dashed lime; }
.brochure { position:relative; left:0vw; top:.5vw; width:8vw;   #border: 1px dashed red;}
.chat {position:relative; left:0vw;  top:1.5vw; width:12vw;   #border: 1px dashed black;}
.emoji {width: auto; height: 5vw; } 
.home { height: 3.5vw; width:auto; }
.cash { height:40vw; width:auto; }
.hixbux { height:5vw; width:auto; }

.heading { text-align:center;  width:90%; padding: 2vw 7vw; font-size: 5.5vw; #font-size: calc(32px + (36-14) * ((100vw - 300px) / (1600 - 300))); border-style: ridge; border-radius: 2vw; border-width: .2vw; background-color: white;    }
.heading2 { text-align:center;  width:80%; padding: 2vw 1vw; font-size: 5.5vw;  border-style: ridge; border-radius: 2vw; border-width: .2vw; background-color: white;    }
.numbers { width: 14vw; height:auto; }

f05 {font-size:.5em;}
f075 {font-size:.75em;}
f1 {font-size:1em;}
f15 {font-size:1.5em;}
f2 {font-size:2em;}
f25 {font-size:2.5em;}
f3 {font-size:3em;}
f35 {font-size:3.5em;}
f4 {font-size:4em;}
f45 {font-size:4.5em;}
f5 {font-size:5em;}
f55 {font-size:5.5em;}
f6 {font-size:6em;}
f65 {font-size:6.5em;}
f7 {font-size:7em;}
f75 {font-size:7.5em;}
f8 {font-size:8em;}
f85 {font-size:8.5em;}
f9 {font-size:9em;}
f95 {font-size:9.5em;}
f10 {font-size:10em;}
f105 {font-size:10.5em;}

fb { color:blue;  font-style: italic;}
ft { color:transparent;}
ft:hover { color:#FFF;}
fw { color:white;}

hix1 { font-size: 6.5vw; color: red; font-family: 'Didot' ; font-weight: bold; font-style: italic;}
hix2 { font-size: 6vw; color: black; font-family: bimini; font-weight: bold; }

.spacer { position: inline; display: block; width: 12vw;  height:1.25vw; #border: 2px dashed red;}
.spacer-h { position: inline; display: block; width: 12vw;  height:2vw; #border: 2px dashed red;}
.spacer-h2 { position: inline; display: block; width: 12vw;  height:4vw; #border: 2px dashed red;}
.halfspacer { position: inline; display: block; width: 6vw;  height:.7vw; #border: 2px dashed red;}


#hr { border: 1px solid #FFF;}

.soon { position: relative; display: block; width: 12vw; top:-7vw; left:; }

.links {position:relative; display:inline; height:5vw; width:auto; font-size:5vw; }

.contact { position: fixed; bottom:.5vw; left:2vw; height: auto; opacity:1;  z-index: 4;}

.footer { position: fixed; display:inline;opacity:0; bottom:0;  left:-84vw; height: 2.5em; width:100%; white-space: nowrap; background-color: transparent; opacity:1;  -webkit-transition: all .5s ease-in-out; border-top-right-radius:10px;z-index: 4;}
.footer:hover {#height:5em;  width: 100%; left:0vw;  background-color: #000; filter: alpha(opacity=50); opacity: 1;} /* makes mouse-out smooth */

.footerpic { position: relative; width: auto; height: 2em; bottom: .1vw; #float:left;  -webkit-transition: all .5s ease-in-out; z-index: 4; }
.footer-number { position: relative; white-space: nowrap; float:center;  font-size:1.2em;  z-index: 4; }
.footer-number:hover { }

.rights { position: absolute; right:1vw; bottom:1vw; font-size:.65em;  color: #000;   z-index: 4; }

.scrollup { position: fixed; width: auto; height: 6vw; bottom: 2em; right: .5vw; display: none; text-indent: -9999px; #background: url('icon_top.png') no-repeat; #background-color: #000;}

.iframe { width:80%; height:110%;  border: 1px ridge; border-radius: 2vw; box-shadow: -12px 0px 19px  #ccc, 12px 10px 19px  #CCC; }
.form { font-size:3vw; }

/* Form info */
fieldset { margin-left:3vw; background-color: #F5FBEF;}
fieldset legend{ font-weight:bold;}
fieldset input{ margin-left: 6vw; margin-top:2vw;}