/* MAIN TAGS */
html {scroll-behavior: smooth;}
body, html {margin:0px; padding:0px; font-family: "Dosis", 'Dosis'; font-size: 20px; color: #434343;}
h1 {font-size: 40px; font-weight: 600; color: white; width: 300px; text-align: center; padding-bottom: 2px; line-height: 42px; background-color: #434343; margin-bottom:0px; text-transform: uppercase;}
h2 {font-size: 26px; color: #434343; font-weight: normal; line-height: 28px; margin-top:4px;}
a {color:#e22658; text-decoration: none;}
a:hover {color:#8c0000; text-decoration: none;}

/* EXPERIMENTAL */
.cta-position {width:100%; position:fixed; z-index:600}
#press-media {position:relative; width:100%; background-image: url(media-press-clippings-teacup-studio.jpg); height:20vh; min-height:1070px; background-size: cover; background-position: center;}
#about-img {position:relative; width:100%; background-image: url(onasbg.jpg); height:21vh; min-height:1100px; background-size: cover; background-position: top;}
.teeth-media {position: absolute; top:0; background-image: url(teeth-1.png); width: 100%; height: 5px;}
.teeth-media4 {position: absolute; top:0; background-image: url(teeth-2180.png); width: 100%; height: 5px;}
.teeth-media2 {position: absolute; bottom:0; background-image: url(teeth-2.png); width: 100%; height: 5px;}
.teeth-media3 {position: absolute; bottom:0; background-image: url(teeth180.png); width: 100%; height: 5px;}
.tmed {margin-top:16px; position: absolute; top:28px; left:15%}
#coop-desc {position:relative; width:100%; background-color: #ffffff; padding-bottom:26px; padding-top:2px; min-height:200px; background-size: cover; background-position: center;}
.tmed2 {padding-top:3px; width: 364px; margin-top:44px; margin-bottom:10px;}
.tmed2de {padding-top:3px; width: 380px; margin-top:44px; margin-bottom:10px;}
.coop-wrap {width:80%; margin:auto; margin-top:30px;}
.cta-wrap {background-color: #434343; padding-bottom: 10px;}
.cta-banner {width:821px; margin:auto; display: flex; padding-top: 2px;}
.cta-banner button {font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; cursor: pointer; background-color: #e22658; height:40px; width:190px; font-size: 20px; border-radius:5px; margin-top:6px; padding-bottom:5px; color:white; border:1px solid #434343;}
.cta-banner button:hover {border:1px solid white; cursor: pointer; flex-flow: row;}
.teeth-cta-b {background-color: #efddc5;}
.teeth-cta {background-image: url(teeth-cta.png); width: 100%; height: 5px;}
.teeth-cta-s {background-image: url(teeth-sticky.png); width: 100%; height: 4px; background-size: contain;}
.teeth-cta2 {background-image: url(teeth-cta2.png); width: 100%; height: 5px;}
.cta-text {text-align: center; padding-right:18px; width:620px; padding-top:12px; color:white; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 18px;}
.cta-button {width:200px; text-align: center;}
.cta-2l {font-size:14px; color:#ffffff; margin: auto; padding-top:6px;}
.gnew {width:100%; background-image:url(); margin-left: auto; margin-right:auto; }
.gallery-intro {width: 90%; margin:auto; font-size:26px; color:white; background-color: #434343; }
.gallery-intro-container {background-color: #434343; width:100%}
.gallery-intro span {width:100%; margin-bottom:18px; margin-top:18px; display: inline-block; text-align: center; font-size: 5vw;}
.instagram-link {padding-top:22px; padding-bottom:22px; width:100%; text-align: center; color:white; background-color: #434343; background-image: url('instbg.png'); background-repeat: repeat-x; background-size:contain;}
.instagram-link a {color: #e22658; text-decoration: none; font-size:24px;}
.instagram-link a:hover {color: #e22658; text-decoration: underline; font-size:24px;}
.gallery-desc {width:100%; background-color: #efddc5;}
.gallery-desc-text {width:82%; margin:auto; text-align: center; padding-top:30px; padding-bottom:30px; background-color: #efddc5;}
.media-list-wrap {background-color: #434343; height:90px; color:white; width:100%; margin:0px; padding:0px; border:0px;}
.media-list {width:88%; display: flex; margin:auto; padding-top:7px;}
.media-list div {flex:20%; height:70px;}
.mpimg {max-width:100%; margin:auto; max-height: 50px; position:absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%);}
.media-list-pos {width:76%; margin:auto; position: relative;}
.media-list-pos a img:hover {filter: brightness(80%);}
.cta-button-k {width:190px;}
.cta-button-k button {font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; cursor: pointer; background-color: #980000; height:42px; width:190px; font-size: 20px; border-radius:5px; margin-top:6px; padding-bottom:5px; color:white; border:1px solid #ffffff;}
.cta-button-k button:hover {border:1px solid #434343; cursor: pointer;}
#lightbox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.5s;
}

#lightbox.active {
  visibility: visible;
  opacity: 1;
}

#lightbox-content {

    width:75vw;
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
  position: relative;
}

#lightbox-content a {
  color: blue;
  text-decoration: none;
}

.lightbox-btn {
margin-top:1px; cursor: pointer; background-color: #efddc5;  border-radius:5px; height: 40px; font-size:22px; font-weight:bold; border-color:grey; border-width: 1px; font-family: "Dosis", 'Dosis'; -webkit-appearance: none;
  -moz-appearance: none; padding-left:6px; padding-right:6px;
  appearance: none; margin-right:6px; color: #434343 !important ;
}

.lightbox-btn {
  position: static;
}

.lightbox-btn:hover {-webkit-appearance: none;
-moz-appearance: none;
appearance: none; color: #ffffff !important; background-color:#434343;}

.lightbox-btn.navigate {
  margin-right: 10px;
}

.lightbox-p {
  padding:7px
}
.close-btn {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 1.5rem;
  background: none;
  border: none;
  cursor: pointer;
}

.close-btn:hover {
  animation: spin 0.5s linear;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.plbtn {
  font-weight: normal;
}



/* GENERIC ANIMATION CLASSES */
.appear {animation: opac 0.6s;}
.disappear {animation: opacrev 0.6s;}
.squeeze {animation: compac 0.6s;}
.unsqueeze {animation: compacrev 0.6s;}
.borderin {animation: bord 0.6s;}
.borderout {animation: bordrev 0.6s;}
.borderholdin {box-shadow: 14px 0px 0px 0px #434343;}
.borderholdout {box-shadow: 0px 0px 0px 0px #434343;}

/* PRELOADER */
#preldr {width:1px; height:1px; visibility: hidden; background-color: #efddc5;}

/* HEADER CONTAINER */
.header {width:100%; background-color: #efddc5; padding-top: 65px;}
.teeth {background-image: url(teeth-1.png); width: 100%; height: 5px;}
.teethb {background-image: url(teeth180.png); width: 100%; height: 5px;}

/* CTA BANNER */

/* HEADER UPPER PART */
.u-stripe {width:100%; display: flex; margin-bottom:20px;}
.logo {flex: 50%; padding-left:20px; padding-top:20px;}
.logo img {width: 290px; cursor:pointer;}
.menu {flex: 50%; text-align: right; padding-right:30px; padding-top:30px; font-size: 22px; font-family: "Comfortaa","Helvetica Neue", Helvetica, -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 400;}
.menu a {margin-left:8px;}
.menum {display:none;}

/* HEADER LOWER PART */
.l-stripe {width:90%; margin:auto; display:flex; flex-wrap: wrap; padding-bottom:30px;}
.lead {font-size: 20px; font-weight: 300; flex: 50%;}
.lead-cont {width:355px; margin:auto;}

/* TEACUP & TEAPOT ANIMATION */
.gfx {flex: 50%; margin:auto;}
.gfx-cont {width:390px; margin:auto;}
.teapot {width:100%; margin:auto; animation-name: sway; animation-duration: 9s; animation-iteration-count: infinite;}
.teapot-img {width:100%; margin-left:40px; max-width:360px; text-align: center;}
.teacup-img {width:60%; max-width:185px; text-align: center;}

/* SLIDESHOW */
.slideshow-container {height:300px; max-width: 86%; position: relative; margin-left: auto; margin-right: auto; margin-top: 40px; margin-bottom:10px;}
.fade {-webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s;}
.slides {display: none; width: 100%; height: 300px; position: relative;}
.gimg-con {margin-left: 120px; padding-top: 30px; height: 250px; position: absolute;}
.prev, .next {outline:none; cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; color: #434343; font-weight: normal; font-size: 30px; transition: 0.1s ease; border-radius: 0 3px 3px 0; user-select: none; text-decoration: none;}
.next {right: 0; border-radius: 3px 0 0 3px;}
.slideimg {max-height:290px; height:100%; display:block; margin:auto;}
.slideimg2 {max-height:270px; height:100%; display:block; margin:auto;}
.slide-position {display:flex; width: 100%; flex-direction: row;}
.slide-img {flex:40%; margin-left:9%;}
.slide-txt {flex:40%; margin:auto; margin-right:9%;}
.prevm {outline:none; display:none; cursor: default; position: absolute; top: 50%; width: auto; margin-top: -22px; color: #dbdbdb; font-weight: normal; font-size: 30px; transition: 0.1s ease; border-radius: 0 3px 3px 0; user-select: none; text-decoration: none;}
.nextm {outline:none; display:none; cursor: default; position: absolute; top: 50%; width: auto; margin-top: -22px; color: #dbdbdb; font-weight: normal; font-size: 30px; transition: 0.1s ease; right: 0; border-radius: 3px 0 0 3px; user-select: none; text-decoration: none;}
.prevm:hover {outline:none; color: #dbdbdb; cursor: default;}
.nextm:hover {outline:none; color: #dbdbdb; cursor: default;}

.slidesbs {width:84%; margin:auto; display: flex; margin-top:28px; flex-direction: row;}
.slidesbs-c {flex:29%; padding:2%}
.slidesbs-i {height:15vw;}
.slidesbs-i img {height:15vw; display:block; margin:auto;}
.slidesbs-i img:hover {animation-name: zoomy; animation-duration: 1s; animation-iteration-count:1; animation-fill-mode: forwards;}
.slidesbs-t {text-align: center; padding-top:12px;}

/* GALLERY */
.offer-banner {width:100%; background-color: #efddc5; padding-top:26px; padding-bottom:26px;}
.offer-main {width:100%;}
.offer {width:80%; margin:auto; margin-top:44px;}
.offer-intro {background-color: #efddc5; width:86%; margin:auto; text-align: center;}
.offer-intro span {display:inline-block; margin-bottom:14px; text-align: center; font-weight: bold; font-size: 40px; color: #434343;}
.pilinks {font-size:15px; margin:auto; padding-top:10px;}
.pilinks a {font-size:15px;}
.pilinks a:hover {font-size:15px;}
.galleryr {
  position: relative;
  width: 100%;
  padding: 0 10;
  background-color: #434343;
}

.gallery_scroller {
  scroll-snap-type: x mandatory;
  overflow-x: scroll;
  overflow-y: hidden;
  display: flex;
  align-items: center;

  -webkit-overflow-scrolling: touch;
}

.gallery_scroller div {
  scroll-snap-align: center;
  margin: 10px;
  position: relative;
}

.gallery_scroller img {
  border-radius: 10px;
}

.gallery_scroller div.colored_card {
  min-width: 85%;
  border-radius: 10px;
 }

.galleryr div.note {
  position: absolute;
  top:  50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  background: rgba(0,0,0, 0.6);
  padding: 20px;
  position: absolute;
  font-size: 4em;
  color: white;
}
.colored_card img {height:85%; width:100%}

.btn2 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: 30px;
  width: 30px;
  border-radius: 2px;
  background-color: rgba(0,0,0,0.5);
  background-position: 50% 50%;
  background-repeat: no-repeat;
  z-index: 1;
}

.btn2:hover {background-color: rgba(0,0,0,0.8);}

.b2next {background-image: url('data:image/svg+xml;charset=utf-8,<svg width="20" height="20" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>Shape</title><path d="M25.557 14.7L13.818 2.961 16.8 0l16.8 16.8-16.8 16.8-2.961-2.961L25.557 18.9H0v-4.2z" fill="%23FFF" fill-rule="evenodd"/></svg>'); right: 6px;}
.b2prev {background-image: url('data:image/svg+xml;charset=utf-8,<svg width="20" height="20" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>Shape</title><path d="M33.6 14.7H8.043L19.782 2.961 16.8 0 0 16.8l16.8 16.8 2.961-2.961L8.043 18.9H33.6z" fill="%23FFF" fill-rule="evenodd"/></svg>'); left: 6px;}
.gallery_scroller > div.colored_card:nth-of-type(1) { }
.gallery_scroller > div.colored_card:nth-of-type(2) { }
.gallery_scroller > div.colored_card:nth-of-type(3) { }
.gallery_scroller > div.colored_card:nth-of-type(4) { }
.gallery_scroller > div.colored_card:nth-of-type(5) { }
.gallery_scroller > div.colored_card:nth-of-type(6) { }
.gallery_scroller > div.colored_card:nth-of-type(7) { }
.gallery_scroller > div.colored_card:nth-of-type(8) { }
.gallery_scroller > div.colored_card:nth-of-type(9) { }
.gallery_scroller > div.colored_card:nth-of-type(10) { }

/* OFFER MAIN */
.th1 {margin-top:5px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 34px; font-weight: 600; color: white; width: 410px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 36px; background-color: #434343; text-transform: uppercase;}
.th2 {margin-top:5px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 34px; font-weight: 600; color: white; width: 410px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 36px; background-color: #434343; text-transform: uppercase;}
.th3 {margin-top:5px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 34px; font-weight: 600; color: white; width: 410px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 36px; background-color: #434343; text-transform: uppercase;}
.o-pos {position:relative; width:100%; padding-top: 18px;}
.tcss {padding-top: 14px;}
.o-poss {position:absolute; right:10px; top:0px; width:220px;}
.stx {font-weight: normal; font-size: 16px; color: #434343;}
.cena {font-weight: bold;}
.priceblock {display:flex;}
.pricenr {flex: 60px 0; padding-right:8px;}
.pricedesc {flex: 75%; padding-top:5px;}
.pricegfx {width: 98px;}
.redli {color: #e22658;}
.th1txt {padding-top:16px; padding-bottom:36px;}
.oclock {height: 15px; padding-right:6px}
.instaoffer {height: 18px; padding-right:2px;}
.staroffer {font-size:17px; display:inline-block;}

/* REVIEWS */
#reviews {display:flex; flex-direction: row;  background-color: #efddc5; padding-top: 34px; width:82%; margin:auto;}
.reviews-p {display:flex; flex-direction: row;  background-color: #efddc5; padding-top: 2px; width:82%; margin:auto; padding-bottom:22px;}
.revblock {flex:33%;}
.revprofile {display:flex; flex-direction: row;}
.revprofile2 {display:flex; flex-direction: row;}
.revpro-l {margin-left:8%}
.revpro-r {}
.revtext {font-style: italic; padding-left:5%; padding-right:5%; padding-top:8px; padding-bottom:3%;}
.revname {width:100%; text-align: left; font-weight: bold; padding-top: 7px;}
.revdesc {width:100%; text-align: left; font-size:14px;}
.revc {width:100%; background-color: #efddc5; padding-top:10px;}
.revt {width:80%; margin:auto;}
.revstars {width:100%; text-align: center; font-weight: bold;}
.revstars img {width:26px; }
.revicon {width:80px;}
.revicon img {width:64px; }
.more-reviews-c {width:100%; background-color: #efddc5; padding-bottom: 30px;}
.more-reviews {text-align: center; width:300px; flex-direction: row; margin: auto;}
.more-reviews img {width: 20px;}
.more-reviews-t {font-size: 18px; }
.more-reviews:hover #moreico {animation-name: rotatey; animation-duration: 1s; animation-iteration-count:1; animation-fill-mode: forwards;}

/* ABOUT */
.about-main {width:100%; background-color: #efddc5;}
.about {width:80%; margin:auto; background-color: #efddc5; padding-top:50px; padding-bottom:50px; display:flex; flex-direction: row;}
.iza {flex:45%; margin-left:4.5%;}
.iza-foto {margin-bottom:20px;}
.im {width: 80px; height: 18px; background-color: #434343; position: absolute; bottom: 0px; left:10px; z-index: 300; font-family: "Dosis", 'Dosis'; color: white; font-weight: 400; font-size: 16px; line-height: 18px; text-align: center; border-radius: 4px;}
.foto-bgi {margin:auto; width:174px; height:170px; position:relative;}
.foto-bgs {margin:auto; width:174px; height:170px; position:relative;}
.foto {width:160px; border-radius:50%; position:absolute; z-index:20; margin-top:6px; margin-left:6px; box-shadow: 0 0 0 0 transparent; transition: all 200ms ease-in-out;}
.foto:hover {box-shadow: 0 0 0 3px white; transition: all 200ms ease-in-out;}
.circle {width:180px; position:absolute; z-index:10; top:0px;}
.iza-text span {display:block; margin:auto; font-size: 20px; font-weight: 400; color: white; width: 174px; text-align: center; padding-bottom: 2px; line-height: 22px; background-color: #434343; margin-bottom:0px; text-transform: uppercase; padding-left:3px; padding-right:4px;}
.iza-text span a {color: white; text-decoration: none; transition: all 200ms ease-in-out;}
.iza-text p {color: #434343; margin-top:0px; margin-bottom:10px; text-align: right; padding-top: 10px;}
.iza-text span a:hover {text-decoration: underline; transition: all 200ms ease-in-out;}
.sandra {flex:45%; margin-right:4.5%;}
.sandra-text {}
.sandra-foto {margin-bottom:20px;}
.sandra-text span {display:block; margin:auto; font-size: 20px; font-weight: 400; color: white; width: 196px; text-align: center; padding-bottom: 2px; line-height: 22px; background-color: #434343; margin-bottom:0px; text-transform: uppercase; padding-left:3px; padding-right:4px;}
.sandra-text span a {color: white; text-decoration: none; transition: all 200ms ease-in-out;}
.sandra-text p {color: #434343; margin-top:0px; margin-bottom:10px; text-align: left; padding-top: 10px;}
.sandra-text span a:hover {text-decoration: underline; transition: all 200ms ease-in-out;}

/* CONTACT */
.th4 {font-size: 40px; font-weight: 600; color: white; width: 282px; text-align: center; padding-bottom: 2px; line-height: 42px; background-color: #434343; margin-bottom:0px; text-transform: uppercase;}
.contact-left {flex:34%}
.contact {width:100%; margin-top:50px; margin-bottom:50px;}
.contact-left img {max-height:360px; display: block; float: right}
.contact-right {flex:60%; margin-left:5%;}
.contact-position {width:80%; display:flex; flex-direction: row; margin:auto; margin-top:50px;}
.ctli {list-style-type:none; margin: 0px; padding: 0px;}
.ctli li img {display: inline-block; width: 20px; height: auto; margin-right: 5px; padding-top: 5px;}
.disclaimer {font-size:14px;}

/* VOUCHERS */
.rbutton {-webkit-appearance: none; height: 34px; font-size:18px; margin-top:10px; margin-bottom:20px; border-radius:4px; width:88%; margin-left:6%; cursor:pointer; background-color: #efddc5; border-width: 1px; font-family: "Dosis", 'Dosis'; color: #434343 !important ;}
.rbutton:hover {color: #ffffff !important; background-color:#434343;}
.v-ok {width:80%; margin:auto; margin-top:14px; margin-bottom:14px;}

/* KEYFRAMES */
@keyframes sway {
  0% {transform: rotate(0deg);}
  50% {transform: rotate(-9deg);}
  100% {transform: rotate(0deg);}
}

@keyframes opac {
0% {opacity: 0;}
100% {opacity: 1;}
}

@keyframes opacrev {
0% {opacity: 1;}
100% {opacity: 0;}
}

@keyframes compac {
0% {width: 48px; max-width:48px}
100% {width: 0px; max-width:0px}
}

@keyframes compacrev {
0% {width: 48px; max-width:48px; height:48px;}
100% {width: 0px; max-width:0px; height:48px;}
}

@keyframes bord {
0% {box-shadow: 0px 0px 0px 0px #434343;}
100% {box-shadow: 14px 0px 0px 0px #434343;}
}

@keyframes bordrev {
0% {box-shadow: 14px 0px 0px 0px #434343;}
100% {box-shadow: 0px 0px 0px 0px #434343;}
}

@keyframes not-fade {
0%   {display:block; opacity: 1;}
95%  {display:block; opacity: 0;}
100% {display:none;}
}

@keyframes zoomy {
0%   {transform: scale(1,1);}
100% {transform: scale(1.1,1.1);}
}

@keyframes rotatey {
  0% {transform: rotate(0deg);}
  50% {transform: rotate(180deg);}
  100% {transform: rotate(359deg);}
}

/* FOOTER */
.footer {background-color: #efddc5; width:100%}
.footer-position {width:80%; margin:auto; padding-top:30px; padding-bottom:30px; font-size:18px;}
.footer-position a {font-size:14px;}

/* MEDIA */
@media (max-width: 420px) {
  #about-img {position:relative; width:100%; background-image: url(onasbg.jpg); height:12vh; min-height:600px; background-size: cover; background-position: top;}
.logo {width:60%;}
.header {padding-top: 75px;}
.logo img {width: 100%; cursor:pointer;}
h1 {font-size: 34px; font-weight: 600; color: white; width: 250px; text-align: center; padding-bottom: 2px; line-height: 36px;}
.menu a {display:none;}
.menu {flex: 50%; text-align: right; padding-right:15px; padding-top:10px; font-size: 20px; font-family: "Comfortaa","Helvetica Neue", Helvetica, -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 400;}
.menum {display:block; position:relative; width:100%; float:right; margin-right:8px;}
.menum img {width:48px; cursor:pointer;}
.menumc {width: 100%; height: 100%; display:none; background-color: #efddc5; position: absolute; right:10px; padding: 4px 4px; top:168px; z-index: 10;}
.menumc a {display:block; padding-top:18px; padding-bottom:5px; padding-right:18px;}
.lead {flex:100%; order:2;}
.gfx {flex:90%; order:1; margin-top:20px;}
.lead-cont {width:90%; margin:auto; font-size:20px;}
.gfx-cont {width:100%; margin:auto;}
.teacup-img {width:38%; max-width:auto; text-align: center;}
.teapot-img {width:90%; margin-left:30px; max-width:auto; text-align: center;}
.slide-position {display:flex; flex-direction: column;}
.slide-img {flex:80%; margin:auto;}
.slide-txt {flex:60%; margin:auto; margin-top:20px; margin:bottom:0px; text-align: center;}
.slideshow-container {height:360px;}
.slideimg {max-height:220px; margin-bottom:20px;}
.slideimg2 {max-height:220px; margin-bottom:20px;}
.o-poss {position:relative; display:block; margin:auto; padding-left:5px; margin-bottom:20px;}
.th1 {margin-top:5px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 20px; font-weight: 600; color: white; width: 240px; padding-top: 2px; text-align: center; padding-bottom: 2px; line-height: 22px; background-color: #434343; text-transform: uppercase;}
.th2 {margin-top:5px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 20px; font-weight: 600; color: white; width: 240px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 22px; background-color: #434343; text-transform: uppercase;}
.th3 {margin-top:5px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 20px; font-weight: 600; color: white; width: 240px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 22px; background-color: #434343; text-transform: uppercase;}
.about {width:90%;}
.contact-position {width:90%; display:flex; flex-direction: column; margin:auto; margin-top:50px;}
.contact-left img {float: none; margin:auto; padding-bottom:30px; max-height: 260px;}
.th4 {margin-top: 5px; font-size: 20px; font-weight: 600; width: 140px; padding-top: 3px; padding-bottom: 2px; line-height: 22px;}
.iza-text p {font-size:19px; text-align: left;}
.sandra-text p {font-size:19px; text-align: left; margin-bottom: 50px;}
.about {flex-direction: column;}
.sandra {flex:100%; margin:0px}
.iza {flex:100%; margin:0px}
.prev {display:none;}
.next {display:none;}
.prevm {display:block;}
.nextm {display:block;}
.tmed2 {padding-top:3px; width: 200px; margin-top:5px; margin-bottom:10px; font-size:20px; padding-bottom: 2px; line-height: 22px;}
.tmed2de {padding-top:3px; width: 215px; margin-top:5px; margin-bottom:10px; font-size:20px; padding-bottom: 2px; line-height: 22px;}
.tmed {width: 180px; position: absolute; top: 28px; left: 15%; margin-top:5px; margin-bottom:10px; font-size:20px; padding-bottom: 2px; line-height: 22px;}
.bt-lefta {font-size:20px;}
.bt-righta {font-size:20px;}
.cta-wrap {background-color: #434343; padding-bottom: 10px;}
.cta-2l {font-size: 11px; text-align: center; width:88%; padding-bottom:10px; padding-top:9px;}
.cta-banner {width:92%; margin:auto; display: flex;}
.cta-banner button {height:40px; width:115px; font-size: 15px; margin-top:15px; padding-bottom:5px;}
.cta-text {padding-right:6px; padding-top:14px; color:white; font-size: 14px;}
.cta-button {width:115px;}
.cta-button-k {width:190px;}
.cta-button-k button {font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; cursor: pointer; background-color: #980000; height:34px; width:190px; font-size: 20px; border-radius:5px; margin-top:6px; padding-bottom:5px; color:white; border:1px solid #434343;}
.cta-button-k button:hover {border:1px solid white; cursor: pointer;}
#reviews {display:flex; flex-direction: column; padding-top:0px;}
.reviews-p {height:1px; padding-bottom:20px;}
.revprofile {display:none;}
.revblock {margin-top:30px;}
.slidesbs {display:none;}
.btn2 {display:none;}
.lightbox-btn {margin-bottom:8px;}
}

@media (min-width: 421px) and (max-width: 650px) {
  #about-img {position:relative; width:100%; background-image: url(onasbg.jpg); height:12vh; min-height:600px; background-size: cover; background-position: top;}
.logo {width:60%;}
.logo img {width: 240px; cursor:pointer;}
.menu a {display:none;}
.menu {flex: 50%; text-align: right; padding-right:15px; padding-top:10px; font-size: 20px; font-family: "Comfortaa","Helvetica Neue", Helvetica, -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 400;}
.menum {display:block; position:relative; width:100%; float:right; margin-right:8px;}
.menum img {width:48px; cursor:pointer;}
.menumc {width: 100%; height: 100%; display:none; background-color: #efddc5; position: absolute; right:10px; padding: 4px 4px; top:174px; z-index: 10;}
.menumc a {display:block; padding-top:18px; padding-bottom:5px; padding-right:18px;}
.lead {flex:100%; order:2;}
.gfx {flex:90%; order:1; margin-top:20px; margin-bottom:16px;}
.teacup-img {width:38%; max-width:auto; text-align: center;}
.teapot-img {width:90%; margin-left:30px; max-width:auto; text-align: center;}
.lead-cont {width:90%; margin:auto;}
.gfx-cont {width:400px; margin:auto;}
.slide-position {display:flex; flex-direction: column;}
.slide-img {flex:80%; margin:auto;}
.slide-txt {flex:60%; margin:auto; margin-top:10px; margin:bottom:20px; text-align: center;}
.slideshow-container {height:380px;}
.slideimg2 {margin-bottom:20px;}
.o-poss {position:relative; display:block; margin:auto; padding-left:5px; margin-bottom:20px;}
.th1 {margin:auto; margin-top:5px; margin-bottom:16px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 28px; font-weight: 600; color: white; width: 330px; padding-top: 2px; text-align: center; padding-bottom: 2px; line-height: 30px; background-color: #434343; text-transform: uppercase;}
.th2 {margin:auto; margin-top:5px; margin-bottom:16px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 28px; font-weight: 600; color: white; width: 320px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 30px; background-color: #434343; text-transform: uppercase;}
.th3 {margin:auto; margin-top:5px; margin-bottom:16px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 28px; font-weight: 600; color: white; width: 320px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 30px; background-color: #434343; text-transform: uppercase;}
.about {width:90%;}
.contact-position {width:90%; display:flex; flex-direction: column; margin:auto; margin-top:50px;}
.contact-left img {float: none; margin:auto; padding-bottom:30px;}
.th4 {margin:auto;}
.ctli {text-align:center; margin:auto;}
.contact-right {margin-left:0%;}
.iza-text p {font-size:19px; text-align: left;}
.sandra-text p {font-size:19px; text-align: left; margin-bottom: 50px;}
.about {flex-direction: column;}
.sandra {flex:100%; margin:0px}
.iza {flex:100%; margin:0px}
.prev {display:none;}
.next {display:none;}
.prevm {display:block;}
.nextm {display:block;}
.tmed2 {padding-top:3px; width: 330px; margin-top:28px; margin-bottom:10px; font-size:36px;}
.tmed2de {padding-top:3px; width: 350px; margin-top:28px; margin-bottom:10px; font-size:36px;}
.bt-lefta {font-size:20px;}
.bt-righta {font-size:20px;}
.cta-wrap {background-color: #434343; padding-bottom: 10px;}
.cta-2l {font-size: 11px; text-align: center; width:88%; padding-bottom:10px; padding-top:9px;}
.cta-banner {width:420px; margin:auto; display: flex;}
.cta-banner button {height:32px; width:140px; font-size: 15px; margin-top:10px; padding-bottom:5px;}
.cta-text {padding-right:10px; width:230px; margin-left:14px; padding-top:9px; color:white; font-size: 12px;}
.cta-button {width:142px;}
.cta-button-k {width:190px;}
.cta-button-k button {font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; cursor: pointer; background-color: #980000; height:34px; width:190px; font-size: 20px; border-radius:5px; margin-top:6px; padding-bottom:5px; color:white; border:1px solid #434343;}
.cta-button-k button:hover {border:1px solid white; cursor: pointer;}
.media-list {width:92%;}
#reviews {display:flex; flex-direction: column; padding-top:0px;}
.revprofile {display:none;}
.reviews-p {height:1px; padding-bottom:20px;}
.revblock {margin-top:30px;}
.slidesbs {display:none;}
.btn2 {display:none;}
}

@media (min-width: 651px) and (max-width: 900px) {
.logo {width:60%;}
.logo img {width: 240px; cursor:pointer;}
.menu a {display:none;}
.menu {flex: 50%; text-align: right; padding-right:15px; padding-top:10px; font-size: 20px; font-family: "Comfortaa","Helvetica Neue", Helvetica, -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 400;}
.menum {display:block; position:relative; width:100%; float:right; margin-right:8px;}
.menum img {width:48px; cursor:pointer;}
.menumc {width: 100%; height: 100%; display:none; background-color: #efddc5; position: absolute; right:10px; padding: 4px 4px; top:168px; z-index: 10;}
.menumc a {display:block; padding-top:18px; padding-bottom:5px; padding-right:18px;}
.lead {flex:100%; order:2;}
.gfx {flex:90%; order:1; margin-top:20px; margin-bottom:16px;}
.teacup-img {width:38%; max-width:auto; text-align: center;}
.teapot-img {width:90%; margin-left:30px; max-width:auto; text-align: center;}
.lead-cont {width:90%; margin:auto;}
.gfx-cont {width:400px; margin:auto;}
.slide-position {display:flex; flex-direction: column;}
.slide-img {flex:80%; margin:auto;}
.slide-txt {flex:60%; margin:auto; margin-top:10px; margin:bottom:20px; text-align: center;}
.slideshow-container {height:380px;}
.slideimg2 {margin-bottom:20px;}
.o-poss {position:relative; display:block; margin:auto; padding-left:5px; margin-bottom:20px; padding-top: 18px;}
.th1 {margin:auto; margin-top:5px; margin-bottom:16px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 28px; font-weight: 600; color: white; width: 330px; padding-top: 2px; text-align: center; padding-bottom: 2px; line-height: 30px; background-color: #434343; text-transform: uppercase;}
.th2 {margin:auto; margin-top:5px; margin-bottom:16px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 28px; font-weight: 600; color: white; width: 320px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 30px; background-color: #434343; text-transform: uppercase;}
.th3 {margin:auto; margin-top:5px; margin-bottom:16px; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 28px; font-weight: 600; color: white; width: 320px; padding-top: 3px; text-align: center; padding-bottom: 2px; line-height: 30px; background-color: #434343; text-transform: uppercase;}
.about {width:90%;}
.contact-position {width:90%; display:flex; flex-direction: column; margin:auto; margin-top:50px;}
.contact-left img {float: none; margin:auto; padding-bottom:30px;}
.th4 {margin:auto;}
.ctli {text-align:center; margin:auto;}
.contact-right {margin-left:0%;}
.prev {display:none;}
.next {display:none;}
.prevm {display:block;}
.nextm {display:block;}
.cta-wrap {background-color: #434343; padding-bottom: 10px;}
.cta-2l {font-size: 12px; text-align: center; width:88%; padding-bottom:10px; padding-top:9px;}
.cta-banner {width:630px; margin:auto; display: flex;}
.cta-banner button {font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; cursor: pointer; background-color: #e22658; height:36px; width:150px; font-size: 15px; border-radius:5px; margin-top:12px; padding-bottom:5px; color:white; border:1px solid #434343;}
.cta-text {text-align: center; padding-right:18px; width:480px; margin-left:10px; padding-top:20px; color:white; font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; font-size: 15px;}
.cta-button {width:152px; text-align: center;}
.cta-button-k {width:190px;}
.cta-button-k button {font-family: "Dosis","Helvetica Neue", Helvetica, -apple-system; cursor: pointer; background-color: #980000; height:34px; width:190px; font-size: 20px; border-radius:5px; margin-top:6px; padding-bottom:5px; color:white; border:1px solid #434343;}
.cta-button-k button:hover {border:1px solid white; cursor: pointer;}
.gallery-intro span {font-size: 3vw;}
#reviews {display:flex; flex-direction: column; padding-top:0px;}
.revprofile {display:none;}
.revblock {margin-top:30px;}
.reviews-p {height:1px; padding-bottom:20px;}
.slidesbs {display:none;}
.btn2 {display:none;}
}

@media (min-width: 901px) and (max-width: 1200px) {
.menu {flex: 50%; text-align: right; padding-right:30px; padding-top:30px; font-size: 22px; font-family: "Comfortaa","Helvetica Neue", Helvetica, -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 400;}
.lead {max-width:400px;}
.menum {display:none;}
.menumc {display:none;}
.menumc a {display:none;}
.menu a {display:inline;}
.teapot-img {width:100%; margin-left:30px; max-width:none; text-align: center;}
.teacup-img {width:44%; max-width:auto; text-align: center;}
.slide-position {flex-direction: row;}
.prev {display:block;}
.next {display:block;}
.prevm {display:none;}
.nextm {display:none;}
.gallery-intro span {font-size: 26px;}
.revtext {font-size:16px;}
.revprofile2 {display:none;}
.pricedesc {padding-top: 14px;}
.cta-2l {font-size: 14px; text-align: center; width:88%; padding-bottom:10px; padding-top:9px;}
.slideshow-container {display:none;}
.slidesbs {display: flex; flex-direction: row;}
.gallery_scroller div.colored_card {min-width: 36%; max-width: 37%;}
}

@media (min-width: 1201px) {
.menum {display:none;}
.menumc {display:none;}
.menumc a {display:none;}
.menu a {display:inline;}
.lead {max-width:none;}
.lead-cont {width:90%; margin:auto; max-width:650px;}
.teapot-img {width:100%; margin-left:30px; max-width:none; text-align: center;}
.teacup-img {width:44%; max-width:auto; text-align: center;}
.slide-position {flex-direction: row;}
.offer {width:70%; margin:auto; margin-top:30px;}
.prev {display:block;}
.next {display:block;}
.prevm {display:none;}
.nextm {display:none;}
.rbutton {height: 32px; font-size: 22px;}
.gallery-intro span {font-size: 26px;}
.revdesc {font-size: 15px;}
.revprofile2 {display:none;}
.pricedesc {padding-top: 14px;}
.cta-2l {font-size: 14px; text-align: center; width:88%; padding-bottom:12px; padding-top:9px;}
.slideshow-container {display:none;}
.slidesbs {display: flex; flex-direction: row;}
.slidesbs-i {height:200px;}
.slidesbs-i img {height:200px;}
.gallery_scroller div.colored_card {min-width: 36%; max-width: 37%;}
}

/* FONTS SELF-HOSTING */
@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/comfortaa-v29-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/comfortaa-v29-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/comfortaa-v29-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/comfortaa-v29-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/comfortaa-v29-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/comfortaa-v29-latin-regular.svg#Comfortaa') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/comfortaa-v29-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/comfortaa-v29-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/comfortaa-v29-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/comfortaa-v29-latin-500.woff') format('woff'), /* Modern Browsers */
       url('fonts/comfortaa-v29-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/comfortaa-v29-latin-500.svg#Comfortaa') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Comfortaa';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/comfortaa-v29-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/comfortaa-v29-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/comfortaa-v29-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/comfortaa-v29-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/comfortaa-v29-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/comfortaa-v29-latin-700.svg#Comfortaa') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/dosis-v18-latin-ext_latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/dosis-v18-latin-ext_latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v18-latin-ext_latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/dosis-v18-latin-ext_latin-300.svg#Dosis') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/dosis-v18-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/dosis-v18-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v18-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/dosis-v18-latin-ext_latin-regular.svg#Dosis') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/dosis-v18-latin-ext_latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/dosis-v18-latin-ext_latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v18-latin-ext_latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-500.woff') format('woff'), /* Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/dosis-v18-latin-ext_latin-500.svg#Dosis') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/dosis-v18-latin-ext_latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/dosis-v18-latin-ext_latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v18-latin-ext_latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-600.woff') format('woff'), /* Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/dosis-v18-latin-ext_latin-600.svg#Dosis') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/dosis-v18-latin-ext_latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/dosis-v18-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v18-latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/dosis-v18-latin-ext_latin-700.svg#Dosis') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/dosis-v18-latin-ext_latin-800.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/dosis-v18-latin-ext_latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/dosis-v18-latin-ext_latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-800.woff') format('woff'), /* Modern Browsers */
       url('fonts/dosis-v18-latin-ext_latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/dosis-v18-latin-ext_latin-800.svg#Dosis') format('svg'); /* Legacy iOS */
}