/* fonts */

/* Altis Regular */

@font-face {
 font-family: 'Altis-Regular';
 src: url('webfonts/Altis/AltisWeb-Regular.eot') format('eot'), url('webfonts/Altis/AltisWeb-Regular.woff') format('woff');
}

.AltisRegular {
  font-family: Altis-Regular, sans-serif !important;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

.AltisExtraBold {
  font-family: AltisExtraBold, sans-serif !important;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

@font-face {
  font-family: 'AltisExtraBold';
  src: url('webfonts/Altis/AltisWeb-ExtraBold.eot') format('eot'), url('webfonts/Altis/AltisWeb-ExtraBold.woff') format('woff');
}

.AltisLight {
  font-family: AltisLight, sans-serif !important;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

@font-face {
  font-family: 'AltisLight';
  src: url('webfonts/Altis/AltisWeb-Light.eot') format('eot'), url('webfonts/Altis/AltisWeb-Light.woff') format('woff');
}

.AltisBoldItalic {
  font-family: AltisBoldItalic, sans-serif !important;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

@font-face {
  font-family: 'AltisBoldItalic';
  src: url('webfonts/Altis/AltisWeb-BoldItalic.eot') format('eot'), url('webfonts/Altis/AltisWeb-BoldItalic.woff') format('woff');
}

 .newsheader {
  margin-top: 68px;
  height: 260px;
  width: 100%;
  max-width: 1010px;
}

 .newstop {
  width: 100%;
}

 .newspage {
  margin-left: 2vw;
  margin-right: 1vw;
}

 .newform {
  margin-left: 15px;
  line-height: 34px;
  margin-right: 1vw;
}

 .newlink {
  margin-right: 1vw;
  line-height: 34px;
  text-align: right;
  width: 155px;
}

.line-height-27px {
  line-height: 27px;
}

img.logoimg {
  width: 20vw;
  max-width: 141px;
}

img.newsimg {
  width: 100%;
  max-width: 1010px;
}

#newlinkmobile {
  display: none;
}

@media screen and (max-width:500px) {
  #mc_embed_signup {
    width: 90%;
  }
}

@media screen and (max-width:800px) {
  #newlinkcontainer {
    display: none;
  }
  #newlinkmobile {
    display: block;
  }
  .font-size-28px {
    font-size: 23px !important;
  }

  .font-size-26px {
    font-size: 21px !important;
  }

   .newform {
    line-height: 29px;
  }

}

@media screen and (max-width:500px) {
  .font-size-28px {
    font-size: 19px !important;
  }

  .font-size-26px {
    font-size: 17px !important;
  }

   .newform {
    line-height: 25px;
  }

}
.TypolarIcons {
  font-family: TypolarIcons, sans-serif !important;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

.licenseicon {
    width: 35px;
    text-align: center;
    border-left: 1px solid white;
}

.font-color-black {
  color: black;
}

.font-color-cyan {
  color: #008DC0;
}

.error {
  color: #ff0000;
  font-family: EraGrotesk-Medium, sans-serif !important;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
  font-size: 16px;
}

.font-color-white {
  color: white;
}

.font-color-red {
  color: #ff0000;
}

.font-color-graytext {
  color: #999999;
}

.font-size-50px {
  font-size: 50px;
}

.font-size-28px {
  font-size: 28px;
}

.font-size-26px {
  font-size: 26px;
}

.font-size-25px {
  font-size: 25px;
}

.font-size-24px {
  font-size: 24px;
}

.font-size-20px {
  font-size: 20px;
}

.font-size-19px {
  font-size: 19px;
}

.font-size-18px {
  font-size: 18px;
}

.font-size-16px {
  font-size: 16px;
}

.font16-20px {
  font-size: 16px;
  line-height: 20px;
}

.font16-26px {
  font-size: 16px;
  line-height: 26px;
}

.font-size-14px {
  font-size: 13px;
}

.font-size-13px {
  font-size: 13px;
}

/* common / home specific css */

.demo {
  background-color: red;
}

html {
  position:relative;
  min-height: 100%;
}

html, body{
    margin:0;
    padding:0;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing;
}

div {
  background-color: transparent;
}

.height-60vw {
    height: 60vh;
}

.width-47-80-vw {
  width: 47.8vw; /* 1128/2 px in 1180 px window */
}

.width-95-60-vw {
  width: 95.6vw; /* 1128 px in 1180 px window */
}

.width-95-25-vw {
  width: 95.25vw; /* 1124 px in 1180 px window */
}

.width-11-95-vw {
  width: 11.95vw; /* 147.5px in 1180px window */
}

.width-12-50-vw {
  width: 12.5vw; /* 147.5px in 1180px window */
}

.width-29-66-vw {
  width: 29.66vw;  /* 350px in 1180px window */
}

.width-31-02-vw {
  width: 31.02vw;
}

.width-29-40-vw {
  width: 29.4vw;
}

.width-02-12-vw {
  width: 2.12vw;
}

.width-24-00-vw {
  width: 24.00vw;
}

.width-49-12-vw {
  width: 49.12vw;
}

.width-01-76-vw {
  width: 1.76vw; /* 22px in 1250px window */
}

.width-22-46-vw {
  width: 22.46vw;
}

.width-12-29-vw {
  width: 12.29vw;
}

.width-02-54-vw {
  width: 2.54vw;
}

.width-22-63-vw {
  width: 22.63vw;
}

.width-46-96-vw {
  width: 46.96vw;
}

.Arial {
  font-family: Arial;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

.Verdana {
  font-family: Verdana;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

.Helvetica {
  font-family: Helvetica;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

.Georgia {
  font-family: Georgia;
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

a:link {
	text-decoration: none;
}

a:visited {
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

a:active {
	text-decoration: none;
}

div.container100p {
 width: 100%;
}

.italic {
  font-style: italic;
}

.bold {
  font-weight: bold;
}

.bggray {
  background-color: #4C4C4C;
}

.bggray2 {
  background-color: #D1D1CF;
}


.bgblackgray1 {
  background-color: #959595;
}

.bgblackgray2 {
  background-color: #A4A4A4;
}

.bgblackgray3 {
  background-color: #BDBDBD;
}

.bgblackgray4 {
  background-color: #BFBFBF
}

.bgblackgray5 {
  background-color: #CFCFCF
}
.bgblackgray6 {
  background-color: #EFEFEF
}

.bgcyanwhite {
  background-color: #EEFCFB;
}
.bgblackopa30 {
  background: rgba(0,0,0,.7);
}

.bglightgray {
  background-color: #CACACA;
}

.bglightgray2 {
  background-color: #EEEDED;
}

.bgwhite {
  background-color: #FFFFFF;
}

.bgcyanish {
  background-color: #D8FEFA;
}

.bglightgreen {
  background-color: #D4FCCD;
}

.lightgray {
  color: #A09F9F;
}

.lightred {
  color: #E86B6E;
}
.pagewidthset {
  margin: auto;
  max-width: 1180px;
}

.flexcontainer {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex; /* or inline-flex */
  /* flex-flow: row nowrap; /* is default: columns along the main-axis (row) and no wrapping to next lines */
}

.flex-justify-left {
  -ms-flex-pack: start;
  -moz-box-pack: start;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
}

.flex-justify-right {
  -ms-flex-pack: end;
  -moz-box-pack: end;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}

.flex-justify-center {
  -ms-flex-pack: center;
  -moz-box-pack: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.flex-justify-space-between {
  -ms-flex-pack: justify;
  -moz-box-pack: justify;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.flex-justify-space-around {
  -ms-flex-pack: justify;
  -moz-box-pack: justify;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-around;
  justify-content: space-around;
}

.flex-align-middle {
  -ms-flex-align: center;
  -moz-box-align: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.flex-align-bottom {
  -ms-flex-align: end;
  -moz-box-align: end;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}

.flex-align-top {
  -ms-flex-align: start;
  -moz-box-align: start;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}

.flex-item {
  flex-shrink: 1; /* default is 1 */
  display: block;
}

.flex-item-align-bottomnotinuse {
  align-self: flex-end;
}

#topnavi-fixed-container {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

#topnavi {

  color: #FCFCFC;
  font-size: 12px;
  font-weight: bold;
  height: 25px;
  line-height: 25px;
}

.topnavi-item-text {
}

.topnavi-item {
}

.topnavi-item img {
  vertical-align: middle;
}

#topnavi-item-typolar {
  color: #FEFEFE;
  vertical-align: middle;
  text-align: left;
}

#topnavi-item-cart {
  text-align: right;
}

.slickheightset {
  margin-top: 25px;
  height: 45.0vw;
  max-height: 450px;
}

/* hide slick while loading page */
.slick {
  display: none;
}

/* show slick after loading page */
.slick.slick-initialized {
  display: block;
}

.slick-item {
}

.slickhome {
  font-family: 'Arial';
  font-size: 200px;
  font-size: 22.0vw;
}

#slickhome1 {
  color: black;
}

#slickhome2 {
  color: red;
}

#slickhome3 {
  color: green;
}

#showcases {
  height: 25.85vw; /* 305px in 1180px window */
  max-height: 305px;
}

#showcases2 {
  height: 25.85vw; /* 305px in 1180px window */
  max-height: 305px;
}

.adbox, .custombox {
  margin-left: 8px;
  margin-right: 8px;
  -webkit-box-shadow: 1px 1px 3px 0px #343434;
  -moz-box-shadow: 1px 1px 3px 0px #343434;
  box-shadow: 1px 1px 3px 0px #343434;
  text-align: left;
  font-size: 12px;
}

.adbox {
  padding: 0.68vw;
  max-width: 350px;
  height: 21.95vw;
  max-height: 259px;
}

.custombox {
  max-width: 366px;
  height: 29.66vw;
  max-height: 350px;
}

.custombox img {
  width: 100%;
  max-width: 366px;
}

#custom {
  padding-top: 8px;
  padding-bottom: 8px;
  max-height: 545px;
  height: 100%;
}

.adt {
  height: 6.355vw; /* 75px in 1180px window */
  max-height: 75px;
  padding-left: 5px;
}

.adt a {
  color: #B0AEAE;
}

.admore {
  text-align: right;
}

.admoretxt {
  border-radius: 2px;
  border: 1px solid #969696;
  padding: 1px 3px 1px 3px;
  margin-top: 10px;
  margin-bottom: 4px;
}

.admoretxt a {
  color: #969696;
  font-size: 9px;
}

.showcaseimg {
  max-width: 347px;
}

.showcaseicon {
  max-width: 25px;
}

.spacer1px {
  height: 1px;
}

.fonts {
  height: 20vw;
  max-height: 200px;
}

.fontbox {
  max-width: 284px;
  height: 11.02vw;
  max-height: 130px;
  text-align: center;
  font-size: 12px;
}

.lmarginsetnavi {
  margin-left: 5.085vw;
}

.rmarginsetnavi {
  margin-right: 5.085vw;
}

.lmarginset {
  margin-left: 0px;
}

.rmarginset {
  margin-right: 0px;
}

.fontboxdemo,
.fontboxdemo a:link,
.fontboxdemo a:visited,
.fontboxdemo a:hover,
.fontboxdemo a:active {
  font-size: 100px;
  color: black;
}

.showunder780px {
  display: none;
}

.showunder500px {
  display: none;
}

/* /fonts specific css */

.stylelocator {
  height: 12.53vw;
  max-height: 100px;
}

/* /family specific css */

#specimen-header {
  padding-top: 60px;
  padding-bottom: 60px;
  font-size: 14px;
  color: black;
}

.speci-item {
  font-size: 19px;
  color: black;
  line-height: 33px;
  height: 33px;
  border-top: 1px solid #969696;
}

.speci-spacer {
  line-height: 33px;
  height: 33px;
  max-width: 22px;
}

.cart-item  {
  font-size: 14px;
  color: black;
  line-height: 33px;
}

.cart-item-name {
  /*
  width: 52.54vw;
  max-width: 620px;
  */
}

.cart-item-discount {
  max-width: 265px;
  color: #E39689;
  text-align: right;
}

.cart-item-price {
  width: 12.29vw;
  max-width: 145px;
  color: #7C9477;
  text-align: right;
}

.cart-item-add {
  max-width: 30px;
  text-align: right;
}

.family-preview-0 {
  font-size: 11px;
  color: #5A5A5A;
  line-height: 20px;
  border-top: 1px solid #969696;
}

.margintop10px {
  margin-top: 10px;
}

.margintop30px {
  margin-top: 30px;
}

.margintop50px {
  margin-top: 50px;
}

.margintop70px {
  margin-top: 70px;

}

.family-preview-1 {
  font-size: 100px;
  color: black;
  line-height: 100px;
}

.family-preview-2 {
  font-size: 35px;
  color: black;
  line-height: 35px;
}

.family-preview-3 {
  font-size: 11px;
  line-height: 20px;
  color: #5A5A5A;
  border-top: 1px solid #969696;
}

.lmarginsetprev {
  margin-left: 1.69vw; /* 20px in 1180px window */
}

.family-preview-3demo {
  font-size: 200px;
  color: black;
  line-height: 200px;
}

.family-preview-3demo2 {
  font-size: 30px;
  color: black;
  line-height: 30px;
}

.family-preview-4 {
  font-size: 11px;
  line-height: 20px;
  color: #5A5A5A;
  border-top: 1px solid #969696;
}

.family-preview-4demo {
  font-size: 14px;
  color: #8C8C8C;
  line-height: 14px;
}

.family-preview-5 {
  font-size: 11px;
  line-height: 20px;
  color: black;
  border-top: 1px solid #969696;
}

.family-preview-5demo {
  font-size: 18px;
  color: #8C8C8C;
  line-height: 18px;
}

.family-preview-6demo {
  font-size: 400px;
  color: black;
  line-height: 400px;
}

.family-preview-7demo {
  font-size: 9.75vw; /* 115px in 1180 window */
  color: black;
  line-height: 10.5vw;
  text-align: center;
}

/* /font single page specific css */

.text-grayed-out {
  color: #CCCCCC;
}

.margintop45px {
  margin-top: 45px;
}

.margintop70px {
  margin-top: 70px;
}

.font250px {
  font-size: 250px;
  line-height: 250px;
}

.font30-32px {
  font-size: 30px;
  line-height: 32px;
}

.singledemobox260px {
  height: 260px;
  overflow-y: hidden;
}

.text-align-right {
  text-align: right;
}

.font225px {
  font-size: 225px;
  line-height: 225px;
}

.font26-28px {
  font-size: 26px;
  line-height: 28px;
}

.singledemobox200px {
  height: 200px;
  overflow-y: hidden;
}

.font200px {
  font-size: 200px;
  line-height: 200px;
}

.font24-26px {
  font-size: 24px;
  line-height: 26px;
}

.singledemobox186px {
  height: 186px;
  overflow-y: hidden;
}

.font175px {
  font-size: 175px;
  line-height: 175px;
}

.font22-24px {
  font-size: 22px;
  line-height: 24px;
}

.singledemobox146px {
  height: 146px;
  overflow-y: hidden;
}

.singledemobox136px {
  height: 136px;
  overflow-y: hidden;
}

.font150px {
  font-size: 150px;
  line-height: 150px;
}

.font20-22px {
  font-size: 20px;
  line-height: 22px;
}

.font80-85px {
  font-size: 80px;
  line-height: 85px;
}

/* cart */

table {
  border-collapse: separate;
  border-spacing: 0px;
  width: 100%;
}

td {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 1.7vw;
  padding-right: 1.7vw;
  background-color: #D1D1CF;
  border-bottom: 1px solid white;
  border-collapse: collapse;
}

.paddingtop-5px {
  padding-top: -5px;
}

td.valign-top {
  padding-top: 17px;
  vertical-align: top;
}

td.valign-middle {
  /* padding-top: 10px; */
  vertical-align: middle;
}

td.name {
  width: 30%;
}

td.cbox {
  width: 1.6vw;
}

td.volume {
  width: 21%;
}

td.remove {
  width: 11%;
  border-right: 1px solid white;
  text-align: right;
}

td.price {
  width: 15%;
  text-align: right;
}

td.rightborderwhite {
  border-right: 1px solid white;
}

td.nobordersright {
  text-align: right;
  border: 0px;
}


td.header {
  padding-top: 10px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}

.license-hidden {
  display: none;
  padding-top: 10px;
}

.paddingleft200px {
  padding-left: 175px;
}

.paddingleft40px {
  padding-left: 40px;
}

.cart {
  padding-top: 20px;
}

#delivery, #billing {
  width: 45vw;
  max-width: 550px;
  line-height: 30px;
  }

input.orderform {
  margin-right: 6px;
  margin-bottom: 5px;
  margin-top: -5px;
}

input[type="radio"].orderform-mac {
  padding:0 10px 0 0;
  position:relative;
  top:-2px;
}

input[type="radio"].orderform-others {
  padding:0 10px 0 0;
  position:relative;
  top: 1px;
}

input[type="text"].orderform {
  width: 99%;
  outline: none;
  background-color: #ebebeb;
  border: none;
  border-color: transparent;
  padding-left: 4px;
  font-size: 22px;
  line-height: 35px;
  transition:width 0.1s; /* for automatic size resize */
}

select.orderform {
  width: 100%;
  outline: none;
  background-color: #ebebeb;
  border: none;
  border-color: transparent;
  padding-left: 4px;
  font-size: 22px;
  line-height: 35px;
  height: 35px;
  transition:width 0.1s; /* for automatic size resize */
  /* if you want remove round corners and arrow
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
  */
  margin-bottom: 5px;
  margin-top: -5px;
}

select.prod-select {
  outline: none;
  background-color: transparent;
  border: none;
  border-color: transparent;
  font-size: 16px;
  line-height: 16px;
  height: 18px;
  transition:width 0.1s; /* for automatic size resize */
  /* if you want remove round corners and arrow */
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
}

#loader {
  display: none;
}

div#laheta {
  height: 60px;
  background-color:	gray;
  width: 100%;
}

#lahetanappi {
  border: 1px;
  padding-top: 5px;
  font-size: 14px !important;
  height: 26px;
  background-color:	#99ff99;
  width: 100%;
  margin-top: 50px;
  margin-bottom: 10px;
}


@media screen and (min-width:1250px) {

  .slickhome {
    font-size: 200px;
  }

  .lmarginsetnavi {
    margin-left: 0px;
  }

  .rmarginsetnavi {
    margin-right: 0px;
  }

}

@media screen and (max-width:1250px) {


  .fontboxdemo,
  .fontboxdemo a:link,
  .fontboxdemo a:visited,
  .fontboxdemo a:hover,
  .fontboxdemo a:active {
    font-size: 8.0vw; /* 100px in 1250px window */
  }

}

@media screen and (max-width:1180px) {

  .adbox, .custombox {
    margin-left: 0.67vw; /* 12px in 1180px window */
    margin-right: 0.67vw;
  }

  .hideunder1180px {
    display: none;
  }

  /* single font specific */
  .font250px {
    font-size: 21.19vw;
    line-height: 21.19vw;
  }

  .font225px {
    font-size: 19.07vw;
    line-height: 19.07vw;
  }

  .font200px {
    font-size: 16.95vw;
    line-height: 16.95vw;
  }


  .font175px {
    font-size: 14.83vw;
    line-height: 14.83vw;
  }

  .font150px {
    font-size: 12.71vw;
    line-height: 12.71vw;
  }

  .font80-85px {
    font-size: 6.78vw;
    line-height: 7.20vw;
  }

}

@media screen and (max-width:950px) {
  #topnavi-item-text-type {
    display: none;
  }
}

@media screen and (max-width:800px) {
  .topnavi-item-text {
    display: none;
  }
}

@media screen and (max-width:780px) {

  .hideunder780px {
    display: none;
  }

  .showunder780px {
    display: block;
  }

  .under780px-width-92-30 {
    width: 92.30vw;
  }

  .under780px-width-44-67-vw {
    width: 44.67vw;
  }

  .under780px-width-20-86-vw {
    width: 20.86vw;
  }

  .under780px-width-11-53-vw {
    width: 11.53vw;
  }
  .lmarginsetprev {
    margin-left: 2.96vw;
  }

  #showcases {
    height: 39.1vw; /* 305px in 780px window */
  }

  #showcases2 {
    height: 39.1vw; /* 305px in 780px window */
  }

  .adbox, .custombox {
    margin-left: 0.77vw; /* 6px in 780px window */
    margin-right: 0.77vw;
    width: 44.87vw;  /* 350px in 780px window */
  }

  .adbox {
    padding: 1.03vw;
    height: 33.2vw; /* 259px in 780px window */
  }

  .custombox {
    height: 44.87vw; /* 350px in 780px window */
  }


  .adt {
    height: 9.61vw; /* 75px in 780px window */
  }

  .showcaseimg {
    width: 44.5vw; /* 347px in 780px window */
  }

  .showcaseicon {
    width: 3.2vw; /* 25px in 780px window */
  }

  .lmarginset {
    margin-left: 4.49vw; /* 35px in 780px window */
  }
  .rmarginset {
    margin-right: 4.49vw;
  }

  .fonts {
    height: 25.64vw;
    max-height: 200px;
  }

  .fontbox {
    width: 36.41;
    max-width: 284px;
    height: 16.66vw;
    max-height: 130px;
    text-align: center;
    font-size: 12px;
  }

  .fontboxdemo,
  .fontboxdemo a:link,
  .fontboxdemo a:visited,
  .fontboxdemo a:hover,
  .fontboxdemo a:active {
    font-size: 62.4px;
  }

  /* /family specific css */

  .speci-item {
    width: 92.3vw;
  }

  .family-preview-1 {
    font-size: 12.82vw; /* 100px in 780px window */
    line-height: 12.82vw;
  }

  .family-preview-3 {
    /* family-container ylempänä 95.6vw */
    /* väli halutaan pitää samana kuin >780px versiossa eli 1.69vw */
    /* boxin koko = (95.6vw - 1.69vw) / 2 = 46.955 */
    /* max-width: 0.46955 * 780 = 343.746 */
    width: 46.96vw;
  }

  .family-preview-3demo {
    /* leiskassa fontti 200 / 670 = 29.85 vw */
    font-size: 29.85vw;
    color: black;
    line-height: 29.85vw;
  }

  .family-preview-4 {
    /* family-container ylempänä 95.6vw */
    /* väli halutaan pitää samana kuin >780px versiossa eli 1.69vw */
    /* boxin koko = (95.6vw - 1.69vw) / 2 = 46.955 */
    /* max-width: 0.46955 * 780 = 343.746 */
    width: 46.955vw;
  }

  .family-preview-5 {
    width: 95.6vw;
  }

  .fixedheight320under780px {
    overflow-y: hidden;
    height: 320px;
  }

  .fixedheight190under780px {
    overflow-y: hidden;
    height: 190px;
  }

@media screen and (max-width:500px) {

  .hideunder500px {
    display: none;
  }

  .showunder500px {
    display: block;
  }

  #showcases {
    height: 280px;
    max-height: 280px;
    margin-bottom: -3px;
  }

  #showcases2 {
    height: 280px;
    max-height: 280px;
    margin-top: -9px;
  }

  #showcase2 {
    margin-top: -6px;
  }

  .adbox, .custombox {
    width: 340px;
    max-width: 500px;
  }

  .adbox {
    padding: 1.6vw;
    height: 242.19px;
    max-height: 242.19px;
  }

  .custombox {
    height: 325.14px;
    max-height: 325.14px;
  }

  .adt {
    height: 75px;
    max-height: 75px;
    margin-top: -5px;
  }

  .showcaseimg {
    width: 100%;
    max-width: 340px;
  }

  .showcaseicon {
    max-width: 25px;
    width: 100%;
  }

  .custombox img {
    width: 100%;
    max-width: 340px;
  }

  .lmarginset {
    margin-left: 2vw; /* 25px in 500px window */
  }
  .rmarginset {
    margin-right: 2vw; /* 25px in 500px window */
  }

  .fonts {
    height: 18vw;
    max-height: 100px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .fontbox {
    width: 40vw;
    max-width: 200px;
    height: 17vw;
    max-height: 90px;
    text-align: center;
    font-size: 12px;
  }

  .fontboxdemo,
  .fontboxdemo a:link,
  .fontboxdemo a:visited,
  .fontboxdemo a:hover,
  .fontboxdemo a:active {
    font-size: 40px;
  }

  td {
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 0vw;
    padding-right: 0vw;
  }

}