:root {
  --color-cyan: #00A0E3;
  --color-grey: #83929e;  
  --color-green: #009900;
}
body{
  background: var(--color-dark); 
}

.app-login {
  width: 180px;
  margin: 20vh auto;
  display: table;
  color: var(--color);
  border: 0px solid var(--color);

}
.app-login input{
  width:180px;
  margin:1px;
  background: var(--color);
  border: 2px solid var(--color-sat);
  color:#fff;
  font-size: 20px;
}
.app-login button {
  font-size: 30px;
  color:var(--color-cyan);
  border: 2px solid var(--color-sat);
  background: var(--color-dark); 
  padding:3px 5px;
  position:absolute;
  margin-top:-23px;
  right:-15px;
  border-radius:50%;  
}
.app-copy-10{  font-size: 13px;}

#container {
  height:250px; 
  position:relative; 
  overflow:hidden;
}

.photobanner {
  position:absolute; 
  top:0px; 
  left:0px; 
  overflow:hidden; 
  white-space: nowrap;
  animation: bannermove 8s linear infinite;
}

.photobanner img {    
  margin: 0 0.5em; 

}

@keyframes bannermove {
  0% {
      transform: translate(0, 0);
  }
  100% {
      transform: translate(-50%, 0);
  }
}

#cont {
  overflow: hidden;
 
  height: 300px;
  margin: 0 auto;
  cursor: pointer;
  margin-top:0px;
}

#imgs {
  display: block;
  padding: 0;
  width: 200%;
}

#imgs li {
  width: 300px;
  height: 300px;

  display: inline-block;
 *display:inline;
}

#imgs img {
  margin:5px;
}

.title {
  display: block;
  width: 100%;
  height: 38px;
  line-height: 38px;
  color: white;
  font-weight: bold;
  text-align: center;
  background: #ddd;
}
.pb-title{  
  background: var(--color-sat);
    padding:5px;
    margin-top:-10px;
    color:var(--color);
  text-align: center
}
    .scroller {
        height:200px;
        position: relative;
    }
    .scroller .innerScrollArea {
        overflow: hidden;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }
   .scroller ul {
        padding: 0;
        margin: 0;
        position: relative;
    }
    .scroller li {
        padding: 0;
        margin: 0;
        list-style-type: none;
        position: absolute;
    }

.scroll-item-img {  
   display: flex;
      justify-content: center;
	  align-items: center;
   width: 130px;
   height:130px;
   cursor:pointer;

}
.scroll-item-img img{ 

  padding:15px;
}
.scroll-item-txt { 
  color:var(--color);
  text-align: center;
}

.app-order-table td{font-size: 24px;padding:2px!important;}


#pop_fly{ 
  position: absolute;
  z-index: 10000;
  top:60px;
  right:100px;
  padding:10px;
}
.app-wrap{

}
.app-wrap .wrap-1{
  display: grid;
  border-radius: 10px 0 0 10px;
  padding: 5px;
  text-align: center;
  justify-content: center;
	align-items: center;
  float: left;
}
.app-wrap .wrap-2{
  border-radius:0  10px 10px 0;
  text-align: center;
  float: left;
  width: calc(100% - 60px);
  min-height: 60px;
  background: #fff;
}
.app-wrap-input{margin:15px 2px;width:30%;}
.bg-1{  background: var(--color-green);color:#fff;}
.br-1{  border: 3px solid var(--color-green);}

.bg-2{  background: var(--color-cyan);color:#fff;}
.br-2{  border: 3px solid var(--color-cyan);}

.bg-3{  background: var(--color);color:#fff;}
.br-3{  border: 3px solid var(--color);}

.line{
  position: absolute;
  height:3px;
  top:18px;
    text-shadow: 2px 2px black;
}
.dots i{
  background: #fff; 
   border-radius:50%;
  padding:5px;
}
.app-wrap-main, .app-wrap-right{
  float:left;
  padding:10px;

  
  gap: 5px;
  display: grid;
}
.app-wrap-main{
width:60%;
display: grid;
}
.app-wrap-right{
width:40%;

}
.app-list{
 float:left; 
  margin:2px;
  border: 1px solid var(--color); 
}
.app-info-red {
  background: #f00;
  color:#fff;
  text-align: center;
  position:absolute;
  top:-25px;
  left:-15px;
  padding:5px;
  rotate: -7deg;
  z-index: 11;
  border: 3px solid #fff; 
}
.app-box{
   margin:5px;
   padding:15px;
   border: 1px solid var(--color); 
   border-radius:7px;
}
.app-box-title{
	font-size:26px;
   font-weight: bold;
   border-bottom: 1px solid var(--color); 

}

@media screen and (max-width: 900px) {
  
.app-wrap-main{
width:100%;

}
.app-wrap-right{
width:100%;
}
 
  
  
}
