@charset "utf-8";
/* page component */
body,h1,h2,h3,h4,h5,h6 {font-family: "Karma", sans-serif}
.w3-bar-block .w3-bar-item {padding:20px}
a{text-decoration: none;}

@media(min-width: 768px){
  a[href^="tel:"]{
      pointer-events: none;
             }
  }

/* scroll component */
.back-to-top {
    position: fixed;
    right: 10px;
    bottom: 10px;
    color: #fff;
    font-size:0.9em;
    width: 40px;
    height: 40px;
    z-index: 2;
    display: none;
   }
.back-to-top:before {
       content: "";
       display: block;
       width: 40px;
       height: 40px;
       border-radius: 20px;
       position: absolute;
       left: 0;
       top: -0.2em;
       background: #885B00;
      }
.back-to-top:after {
      content: "Top↑";
      display: block;
      text-align: center;
      width: 40px;
      height: 40px;
      line-height: 40px;
      position: absolute;
      left: 0;
      top:  -0.2em;
       }

/*Sidebar (hidden by default)*/
#mySidebar {display:none;z-index:2;width:40%;min-width:300px}

/* content component */
#container{max-width:1200px;margin-top:100px}
div .flex h3{color:#000}
div .flex p{color:#808080}
div .more{margin-top:-0.8rem;margin-bottom:1rem;color:#ff0000;width:100%;text-align: right;}
div .images{
  width: 100%;
  background: #fff;
  position: relative;
  animation: mymove infinite;
  animation-duration: 3s;
  animation-iteration-count: 1;
}
div .images img{width:100%;border: 1px solid #fff;padding: 0px;border-bottom-left-radius: 35px;border-bottom-right-radius: 35px;overflow:hidden;box-shadow: 0 4px 8px 0 #00000033, 0 6px 20px 0 #00000030}

@keyframes mymove {
  from {top: 100px;}
  to {top: 0px;}
}