b, strong {font-weight: bold;}
body,html{overflow-x:hidden}
body{background-attachment:fixed;background-position:center;}
body.page0{background-color: #03bfa2;background-image: url(/static/img/main_background.jpg);background-size:cover;}
body.page1{background-image:url(/static/img/main_background.jpg);background-size:cover;}
body.page2{background-image:url(/static/img/contact_back.jpg);background-size: cover;}
body.page3{background-image:url(/static/img/Jewelry/saleBackground.jpg);background-size:cover;}
body.page4{background-image:url(/static/img/jewelry_back.jpg);background-size:cover;}
body.page5{background-image:url(/static/img/metals_back.jpg);background-size:cover;}
body.page6{background-image:url(/static/img/photos_back.jpg);background-size:cover;}


a:focus,a:hover{text-decoration:none}
h1,h2{margin:0}
p:last-child{margin-bottom:0}
.hide{display:none;}
.page{background-color:#222;font-family:'Long Cang',serif;font-size:18px;font-weight:300;padding:30px 15px;overflow-x:hidden}
.row{display:grid;grid-template-columns:450px 1fr}
.header{max-width:420px;overflow:visible}
.content-wrapper{margin-top:365px}
.content{max-width:600px;margin-left:auto;margin-right:0}
.content-gallery{max-width:900px}
.content-text{font-family:"Trebuchet MS",sans-serif;background-color:#fff;padding:40px}
.content-text h4{padding-top:10px}
.content-text-gallery{padding:5px;position:relative;height:auto;min-height:200px}
.box{display:block;padding:10px}
.box-text{border:1px solid #fff;color:#fff;font-style:italic;height:100%;display:flex;flex-direction:column;justify-content:center;align-content:center;text-align:center}
.box-white{background-color:rgba(255,255,255,.3)}
.box-black{background-color:rgba(0,0,0,.7)}
a.js-site-title{text-decoration-line:none}
.site-title-text{font-size:3.8em;padding-top:20px;padding-bottom:25px;text-align:center;height:auto;}
.page-title-text{font-size:2.2em;padding:15px 25px;text-align:left;height:auto;}
.nav-items-container{display:grid;grid-template-rows:repeat(3,208px);grid-template-columns:1fr 1fr;grid-gap:6px;justify-items:stretch;padding-left:0;margin-top:1em;}
.nav-item{margin-bottom:10px;font-size:1.9em;-webkit-transition:all .3s ease;transition:all .3s ease;height:185px;position:relative}
.nav-item-link{padding:10px;position:absolute;top:0;right:0;bottom:0;left:0;text-decoration-line:none}
.nav-item:focus,.nav-item:hover{background-color:rgba(241,241,241,.59)}
.nav-item:focus .box-text-nav-item,.nav-item:hover .box-text-nav-item{color:#000;border:1px solid #000}
.nav-item:hover, .nav-item:focus, .nav-item.active {
    background-color: rgba(241, 241, 241, 0.59);
}
.margin-b-20 {margin-bottom: 20px;}
.footer{position:fixed;top:10px;right:30px;justify-items:end;}
.footer p{margin-top:0;}
.footer a{color:rgba(255,255,255,.8)}
.copyright-text{color:rgba(255,255,255,.8);font-size:.8em}

.contact-form {
  display: grid;
  grid-gap: 15px;
}

/*#contact_name, #contact_email {
}
#contact_subject {
}
#contact_message {
}*/

.content-text:first-child {
  margin-top: 0;
}
.content-text p {
  margin-top: 0;
}
.contact-form input, .contact-form textarea {
  font-size: 1em;
  line-height: 1.5;
}
.twin {
    display: flex;
    justify-content: space-between;
}
#contact_name, #contact_email {
    max-inline-size: 12.75em;
}
.form-control:focus {
    border-color: rgb(0, 218, 79);
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(0, 200, 81,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(0, 200, 81, 0.6);
}
.submit-btn {
  color: #A0A0A0;
  background-color: transparent;
  border: 1px solid #A0A0A0;
  border-radius: 0;
  font-size: 1.1em;
  margin-top: 5px;
  width: 150px;
  height: 50px;
  text-transform: uppercase;
  transition: all 0.3s ease;
}
.submit-btn:hover {
  background-color: aquamarine;
  color: purple;
}

li { list-style: none; }
ul, ol, li { margin: 0; padding: 0; }
img { max-width: 100%; }
img:not(.tns-lazy-img), .lazyload img { height: auto; }
.autoWidth img { max-width: none; }
.autoHeight img { width: 100%; }
.img {
  font-size: 100px;
  font-weight: 100;
  color: #fff;
  text-align: center;
}
.img a {
  display: block;
  padding: 22% 0;
  color: inherit;
  text-decoration: none;
}
.visually-hidden {
  position: fixed;
  left: -10000px;
  opacity: 0;
}

/* nav */
.nav.active ul { left: 0; }
.nav.active .nav-toggle-handle { left: 17em; }
.nav.active .nav-toggle-handle:before { display: inline-block; }
.nav.active .nav-toggle-handle:after { display: none; }
.nav ul {
  position: fixed;
  top: 0;
  left: -17em;
  z-index: 100;
  width: 17em;
  height: 1000px;
  height: 100vh;
  background-color: #fff;
  -webkit-box-shadow: 2px 0 15px rgba(0, 0, 0, 0.15);
  box-shadow: 2px 0 15px rgba(0, 0, 0, 0.15);
  transition: left 0.25s;
  overflow-y: auto;
}
.nav a {
  display: block;
  padding: 0.7em 1em;
  color: inherit;
  text-decoration: none;
}
.nav a:hover { background-color: #F3F3F3; }
.nav .active {
  color: #fff;
  background-color: #af23ff !important;
}
.nav-toggle-handle {
  position: fixed;
  transition: left 0.25s;
  left: 0;
  top: 0;
  z-index: 100;
  padding: 10px;
  color: #fff;
  background-color: #af23ff;
  cursor: pointer;
}
.nav-toggle-handle:before {
  display: none;
  padding-right: 5px;
  content: '◄';
  font-size: 0.8em;
}
.nav-toggle-handle:after {
  padding-left: 5px;
  content: '►';
  font-size: 0.8em;
}
.customize-tools { position: relative; }
.thumbnails {
  margin: 20px 0;
  text-align: center;
}
.thumbnails li {
  display: inline-block;
  cursor: pointer;
  border: 5px solid #fff;
}
.thumbnails .tns-nav-active {
  background: none;
  border-color: #000;
}
.thumbnails li { width: 50px; }
.thumbnails img { vertical-align: bottom; height: auto; max-height: 50px; }
.controls { text-align: center; }
.controls li {
  display: block;
  position: absolute;
  top: 50%;
  height: 60px;
  line-height: 60px;
  margin-top: -30px;
  padding: 0 15px;
  cursor: pointer;
  transition: background 0.3s;
}
.controls li img { display: inline-block; vertical-align: middle; }
.controls .prev { left: 0; }
.controls .next { right: 0; }
.controls li:hover { background: #f2f2f2; }

.tns-controls { text-align: center; margin-bottom: 10px; }
.tns-controls [aria-controls] {
  font-size: 15px;
  margin: 0 5px;
  padding: 0 1em;
  height: 2.5em;
  color: #000;
  background: #66CCFF;
  border-radius: 3px;
  border: 0;
}
.lt-ie9 .tns-controls > [aria-controls] {
  line-height: 2.5em;
}
.tns-controls [disabled] {
  color: #999999;
  background: #B3B3B3;
  cursor: not-allowed !important;
}
.tns-nav {
  text-align: center;
  margin: 10px 0;
}
.tns-nav > [aria-controls] {
  width: 9px;
  height: 9px;
  padding: 0;
  margin: 0 5px;
  border-radius: 50%;
  background: #ddd;
  border: 0;
}
.tns-nav > .tns-nav-active { background: #999; }
.playbutton-wrapper { text-align: center; }
.playbutton-wrapper button { height: 34px; padding: 0 10px; font-size: 14px; background: #fff; border-radius: 3px; border: 1px solid  #ccc; cursor: pointer; }
.wrapper { padding: 0 5em; }
.customize-tools [hidden] { display: none; }
.right-stuff{
    opacity: initial;
    transition-property: all;
    transition-duration: 2s;
    transition-timing-function: ease-in-out;
}
.fast, .right-stuff.fast{transition-duration: 0.05s;}
.nosee{transform: scale(0);}
@media screen and (max-width:991px){
    .row{grid-template-columns:1fr;}
    .right-stuff{grid-column:1;justify-self:end;}
    .content{margin:0 0 0 auto}
    .content-wrapper{margin-top:30px;margin-bottom:30px}
    .footer{position:static}
}
@media screen and (max-width:620px){
  .twin {
    display: grid;
    grid-gap: 15px;
    justify-content: stretch;
  }
  #contact_name, #contact_email {
    max-inline-size: unset;
  }
}
@media screen and (max-width:1199px) and (min-width:992px){
    .nav-item{font-size:1.4em}
    .site-title-text{font-size:3em}
}
@media screen and (max-width:480px){
    .nav-item{font-size:1.4em}
    .site-title-text{font-size:3em}
    .page-title-text{font-size:1.6em}
    .content-text{padding:30px 25px}
    .content-text-gallery{padding:5px}
}
