/*ButtonStyle*/

/*置中按鈕*/
.btn +.btn{
    margin-left:3px;
}
.btn-group-separate .btn{
   margin-top:10px;
   padding:10px;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;

}
/*---暗---*/
.btn-bg-dark,button.btn-bg-dark:focus{
    background-color:#2C3E50;
    color:white;
    border:1px solid #2C3E50;
}
.btn-bg-dark:hover{
    /*background-color:rgb(85, 120, 155);
    color:white;
    border:1px solid;*/
    background-color:transparent;
    color:#2C3E50;
    border:1px solid #2C3E50;
}
.btn-bg-dark > a{
    color:white;
    text-decoration:none;
}
.btn-bg-dark:hover > a{
    color:#2C3E50;
   text-decoration:none;
}
/*---亮---*/
.btn-bg-light,button.btn-bg-light:focus{
    background-color:transparent;
    color:#2C3E50;
    border:1px solid;
  
}
.btn-bg-light:hover{
    background-color:#2C3E50;
    color:white;
    border:1px solid #2C3E50;
}
.btn-bg-light > a{
    color:black;
    text-decoration:none;
}
.btn-bg-light:hover > a{
    color:white;
   text-decoration:none;
}
/*---有icon-亮---*/
.btn-icon-light, button.btn-icon-light:focus{
    border:none;  
    color:black;
    background-color:transparent;
   
}
.btn-icon-light:hover{
    color:rgb(253,206,13);  
}
/*---綠---*/
.btn-bg-green,button.btn-bg-green:focus{
    background-color:rgb(0, 164, 145);
    color:white;
    border:1px solid;
}
.btn-bg-green:hover{
    /*background-color:rgb(85, 120, 155);
    color:white;
    border:1px solid;*/
    background-color:transparent;
    color:rgb(0, 164, 145);
    border:1px solid rgb(0, 164, 145);
}
/*---深綠---*/
.btn-bg-deepGreen,button.btn-bg-deepGreen:focus{
    background-color:rgb(4, 129, 133);
    color:white;
    border:1px solid rgb(4, 129, 133);
}
.btn-bg-deepGreen:hover{
    /*background-color:rgb(85, 120, 155);
    color:white;
    border:1px solid;*/
    background-color:transparent;
    color:rgb(4, 129, 133);
    border:1px solid rgb(4, 129, 133);
}
.btn-bg-deepGreen > a{
    color:white;
    text-decoration:none;
}
.btn-bg-deepGreen:hover > a{
    color:rgb(4, 129, 133);
   text-decoration:none;
}
.btn-bg-deepGreen:focus{
    background-color:rgb(248, 177, 24);
    color:white;
    border:1px solid rgb(248, 177, 24);     
}
.btn-group > .active , .btn-group > .active:hover > a ,.btn-group-separate > .active , .btn-group-separate > .active:hover > a {
    background-color:rgb(248, 177, 24);
    color:white;
    border:1px solid rgb(248, 177, 24);
}
.btn-group-separate a {
    font-size:1.6em;
}
/*---黃---*/
.btn-bg-yellow,button.btn-bg-yellow:focus{
    background-color:rgb(248, 177, 24);
    color:white;
    border:1px solid rgb(248, 177, 24);
}
.btn-bg-yellow:hover{
    /*background-color:rgb(85, 120, 155);
    color:white;
    border:1px solid;*/
    background-color:transparent;
    color:rgb(248, 177, 24);
    border:1px solid rgb(248, 177, 24);
}
.btn-bg-yellow > a{
    color:white;
    text-decoration:none;
}
.btn-bg-yellow:hover > a{
    color:rgb(248, 177, 24);
   text-decoration:none;
}
/*---共同設定---*/
.btn-bg-dark ,.btn-bg-light,.btn-icon-light,.btn-bg-green{
    margin-top:5px;
    /*margin-bottom:5px;*/
}
span.btn-bg-dark + span.btn-bg-dark ,span.btn-bg-light + span.btn-bg-light,span.btn-bg-green + span.btn-bg-green{
    margin-right:5px;
  
}
a > span.btn-bg-dark + a > span.btn-bg-dark , a > span.btn-bg-light + a > span.btn-bg-light , a > span.btn-bg-green + a > span.btn-bg-green,
a > span.btn-bg-dark + span.btn-bg-dark , a > span.btn-bg-light + span.btn-bg-light , a > span.btn-bg-green + span.btn-bg-green ,
span.btn-bg-dark + a > span.btn-bg-dark , span.btn-bg-light + a > span.btn-bg-light , span.btn-bg-green + a > span.btn-bg-green
{   
     margin-right:5px;
  
}

.btn-group-lg-adj > .btn{
    padding: 14px 21px;
    font-size: 20px;
    line-height: 0.9;
    border-radius: 6px;
}

.btn-inline{
    display:inline-block;
    position:relative;
    top:-65px;
}

/*大圖示按鈕*/
.btn-group-img {
    width:120px;
    height:120px;
    background-color:white;
    margin:0 auto;
    right:0px;
    left:0px;
    border-radius:99em;
    margin-top:15px;
    margin-bottom:15px;
    display:block;
}
.btn-group-img img {
    vertical-align:middle;
    margin-right:6px;

}
.imgHelper { /*幫助icon垂直置中 旅遊能力分析有用到*/
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

/*button + icon 設定*/
.lgIcon{ 
    /*使用glyphicon 大icon*/
    font-size:150%;
    vertical-align:middle;
}
.iconText{
    font-family:"Courier New"; /*讓文字置中對其於大圖標*/
}

@media all and (max-width: 480px) {
    .btn-inline{
        top:0px;
        margin-bottom:10px;
    }
}

@media all and (min-width: 481px) and (max-width: 767px) {
   .btn-inline{
        top:0px;
        margin-bottom:10px;
    }
}

@media all and (min-width: 768px) and (max-width: 991px) {/*ipad*/
    .btn-inline {
        top:0px;
        margin-bottom:10px;
    }
}

@media all and (min-width: 992px) and (max-width: 1199px){
}

@media all and (min-width: 1200px) {

}
/*分頁按鈕*/
.pagination li {
  border: solid 1px #eaf0ed;
  border-collapse: collapse;
   list-style-type: none;
}
.pagination li:hover {
  background: var(--c-eighth);
}
.pagination__img a {
  padding: 18px;
  display: block;
}
.pagination__img a img {
  width: 24px;
}
.pagination__list a {
  text-decoration: none;
  color: #3f5d45;
  display: block;
  padding: 20px 25px;
  line-height: 20px;
  font-size: 20px;
}
.pagination__list--focus {
  background: var(--c-fourth);
}
.pagination__list--focus a {
  color: #eaf0ed;
}
.shoppindCart{
  margin-bottom:20px;
  margin-left:20px;
}
.shoppindCart span{
    position: relative;
    top:10%;
    left:70%;
}
.shoppindCart a {
  text-decoration: none;
  color: #eaf0ed;
  display: block;
  padding: 20px 25px;
  line-height: 20px;
  font-size: 20px;
  background: var(--c-second)
}
.shoppindCart:hover a {
  background: var(--c-eighth);
}
/*按鈕上紅色標籤(ex.1,2....)*/
.notify-badge-number {
    font-size: 0.9em;
    padding: 2px 8px;
    border-radius: 10px;
    color: white;
    letter-spacing: 1px;
    font-weight: bolder;
}
/*li按鈕無效*/
.disabled {
    pointer-events:none; /*This makes it not clickable*/
    opacity:0.6;         /*This grays it out to look disabled*/
}