
/* Style for our header texts
* --------------------------------------- */
h1{
  font-size: 5em;
  font-family: arial,helvetica;
  color: #fff;
  margin:0;
  padding:0;
}
.nopadding{
  padding: 0 !important;
}
/* Centered texts in each section
* --------------------------------------- */
.section{
  text-align:center;
}


/* Backgrounds will cover all the section
* --------------------------------------- */
[id*='section'] {
  background-size: cover;
  background-position: center;
}
.section{
  background-size: cover;
  background-position: center;
}
.slide{
  background-size: cover;
  background-position: center;
}

/* Defining each section background and styles
* --------------------------------------- */
#section0{
  background-image: url(../images/slide1.png);
  height: 800px;
}
#section1{
  background-color: #0F9DAF;
  /*background-image: url(../images/slide2.png);*/
}
#section2{
  background-color: #0F9DAF;
}
#section3{
  background-image: url(../images/slide4.png);
}
#section4{
  background-image: url(../images/white.png);
}
#section5{
  background-image: url(../images/white.png);
  /*background-image: url(../images/slide5.png);*/
}
#section6{
  background-color: #E1D06A;
}
#section6_img{
  height: 20vh;
  line-height: 20vh;
  margin-top: 1vh;
  background-image: url(../images/slide_img.png);
}
#section7_img{
  height: 20vh;
  line-height: 20vh;
  margin-bottom: 2vh;
  background-image: url(../images/slide_img.png);
}
#section8_img{
  height: 20vh;
  line-height: 20vh;
  margin-top: 3vh;
  background-image: url(../images/slide_img2.png);
}
#section0 h1{
  top: 50%;
  transform: translateY(-50%);
  position: relative;
}
#section3 h1{
  color: #000;
}

/*Adding background for the slides
* --------------------------------------- */
#slide1{
  background-image: url(../images/bg2.jpg);
  padding: 6% 0 0 0;
}
#slide2{
  background-image: url(../images/bg5.jpg);
  padding: 6% 0 0 0;
}


/* Bottom menu
* --------------------------------------- */
#infoMenu li a {
  color: #fff;
}
.h-100{
  height: 100%!important;
}
.ml-auto, .mx-auto {
    margin-left: auto!important;
}
.mr-auto, .mx-auto {
    margin-right: auto!important;
}
.img-fluid {
    width: 100%;
    height: auto;
}
img {
    vertical-align: middle;
    border-style: none;
}
.d-flex {
    display: -ms-flexbox!important;
    display: flex!important;
}
.align-items-center {
    -ms-flex-align: center!important;
    align-items: center!important;
}
/*表格樣式*/
input:focus,select:focus{
  border:1px solid RGBA(206, 87, 129, 1.00) !important;
}
.form-control:focus{
  border:1px solid RGBA(206, 87, 129, 1.00);
}
.form-control[readonly]:focus{
  border:1px solid #CCD0D7;
}
.memOrderMain {width: 100%; display: block; border: 1px solid RGBA(241, 241, 241, 1.00);overflow: hidden;}
.memOrderItem:hover {
    background-color: RGBA(245, 245, 245, 0.7);
}
.memOrderMain .inline-block{margin-right: -10px;}
.memOrderMain ul{ font-size: 14px;padding: 10px 0; list-style-type: none;}
.memOrderMain ul.memOrderTitle{ color: #111; padding:0; margin: 0;  background-color: RGBA(241, 241, 241, 1.00); }
.memOrderMain ul.memOrderItem{ color: #000 ; margin:0; padding:0; border-bottom: 1px solid #eee;}
.memOrderMain li{
  display: inline-block; 
  padding: 5px 10px;
  color: RGBA(115, 115, 115, 1.00); 
  vertical-align: middle; 
  word-break: break-all; 
}
.memOrderMain img{max-width:100px;}
/*width*/
.memOrderMain .field-width-5{width: 5%;}
.memOrderMain .field-width-10{width: calc(10% - 5px);}
.memOrderMain .field-width-15{width: calc(15% - 5px);}
.memOrderMain .field-width-20{width: calc(20% - 5px);}
.memOrderMain .field-width-25{width: calc(25% - 5px);}
.memOrderMain .field-width-30{width: calc(30% - 5px);}
.memOrderMain .field-width-35{width: calc(35% - 5px);}
.memOrderMain .field-width-40{width: calc(40% - 5px);}
.memOrderMain .field-width-45{width: calc(45% - 5px);}
.memOrderMain .field-width-50{width: calc(50% - 5px);}
.memOrderMain .field-width-55{width: calc(55% - 5px);}
.memOrderMain .field-width-60{width: calc(60% - 5px);}
.memOrderMain .field-width-65{width: calc(65% - 5px);}
.memOrderMain .field-width-70{width: calc(70% - 5px);}
.memOrderMain .field-width-75{width: calc(75% - 5px);}
.memOrderMain .field-width-80{width: calc(80% - 5px);}
.memOrderMain .field-width-85{width: calc(85% - 5px);}
.memOrderMain .field-width-90{width: calc(90% - 5px);}
.memOrderMain .field-width-95{width: calc(95% - 5px);}
.memOrderMain .field-width-100{width: calc(100% - 5px);}
.memOrderMain [class*='field-width'] button {
    margin: 0 2px;
}
@media screen and (max-width:1100px) {
.memOrderMain img{width:70px;}
}
@media screen and (max-width:768px) {
.memOrderMain ul.memOrderTitle{display: none;}
.memOrderMain ul{border-bottom: none;}
.memOrderMain ul.memOrderItem{padding: 15px; }
.memOrderMain ul.memOrderItem li::before{content: attr(data-title) ""; text-transform: uppercase; width:100px; }
.memOrderMain ul.memOrderItem .checked::before{width:35px; float: left;}
.memOrderMain [class*='field-width']{width: 100%; text-align: left; }
.memOrderMain .memOrderEdit a{width: 100px; height: 30px;}
}
/*表格樣式-css end*/
