


/* Main menu
 * */
.topmenu {
   border-top: 3px solid #0000cd;
   border-bottom: 3px solid #0000cd;
   font-size: .9em;
   font-weight: 500;
}
.topmenu .hcontainer {
   display: flex;
   flex-direction: column;
   row-gap: .5em;
   padding: .5em 0;
   align-items: center;
}
.topmenu a {
   text-decoration: none;
}
@media( orientation: landscape ) {
   .topmenu .hcontainer {
      flex-direction: row;
      column-gap: 2em;
   }
   .topmenu a:first-child {
      margin-right: auto;
   }
}
@media( min-width: 1024px ) {
   .topmenu {
      position: sticky;
      top: 85px;
      z-index: 5000;
      background: white;
   }
}



/* Thermometers
 * */
figure.thermo {
   margin: 0;
   padding: 0;
}
figure.thermo meter {
   width: 100%;
}
figure.thermo figcaption strong {
   font-weight: 600;
   display: block;
   font-size: 1.3em;
}



/* Big text with blue box background
 * */
.blueboxbig {
   background: #0000cd;
   color: white;
   padding: 3.5em 0;
   text-align: center;
}
.blueboxbig h5 {
   font-weight: 400;
   font-size: 1.4em;
}
.blueboxbig a {
   color: white;
   text-decoration: underline;
}
.blueboxbig a:hover {
   text-decoration: none;
}
@media( orientation: landscape ) {
   .blueboxbig h5 {
      max-width: 72%;
      margin: 0 auto;
   }
}



/* ANY AMOUNT FORM (except the ones inside item overlay)
 * */
.anyamountform {
   display: flex;
   flex-direction: column;
   row-gap: 1em;
}
.anyamountform p {
   margin: 0;
}
.anyamountform .fieldwbutton {
   column-gap: 1em;
}
.anyamountform .fieldwbutton input {
   border: .1px solid #0000cd !important;
   border-radius: 0 !important;
   padding: .2em 1em;
}
.anyamountform .fieldwbutton button {
   border-radius: 5em;
   border: .1px solid #0000cd;
   background: white;
   padding: .2em 1em;
   color: #0000cd;
   transition: 300ms;
}
.anyamountform .fieldwbutton button:hover,
.anyamountform .fieldwbutton button:active {
   background: #0000cd;
   color: white;
}
.anyamountform .fieldwithsymbol {
   flex: 1 1 50%;
}
.anyamountform .fieldwithsymbol path {
   fill: #0000cd;
}



/* Preview Vid
 * */
.previewvid {
   position: relative;
   margin-top: 3em;
}
.previewvid:hover {
   opacity: .7;
}
.previewvid video {
   display: block;
   width: 100%;
}
.previewvid > .txt {
   position: absolute;
   top: .75em;
   left: 0;
   width: 100%;
   display: block;
   font-weight: 500;
   color: white;
   font-size: 1.4em;
   text-align: center;
}
.previewvid > .txt > span {
   padding: 0.08em .25em;
   background-color: rgba(0, 0, 205, 0.7);
   box-decoration-break: clone;
}
.previewvid > .svg {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   border: .1em solid white;
   border-radius: 5em;
   line-height: 1;
   display: block;
   padding: .25em;
   font-size: 3em;
   opacity: .5;
}
.previewvid > .svg path {
   fill: white;
}
.previewvid.home > .txt {
   font-size: 1em;
}
@media( orientation: landscape ) {
   .previewvid > .txt,
   .previewvid.home > .txt {
      font-size: 1.5em;
   }
}


