﻿





/* Query .querybanner */
.querybanner {
    padding-bottom: 3px;
    /*background-color: #F4F4F4;*/
    margin-left: 3px;
    text-align: left;
}

.queryfilter1 {
    padding: 10px; /*10px 10px 2px 10px*/
    margin: 10px;
    border-radius: 8px;
    background-color: #3d816d;
    box-shadow: 0px 3px 5px darkgray;
    text-align: center;
    Display: inline-block;
    color: #E5E3C9;
    font-size: 1.2rem;
}


    .queryfilter1 input, .queryfilter1 span, .queryfilter1 select {
        font-family: 微軟正黑體;
        color: #595757;
        font-size: 1rem;
    }

    .queryfilter1 label, #rdosSign_Action label {
        margin-right: 3px;
        font-size: 1rem;
    }


/* Query .querybanner */



.font-primary{
  color: #3D816D;
}

table {
    /*border-collapse: collapse;
  border: 1px solid #cdcdcd;
  /*font: normal 12px arial;
  width: 100%;*/
/*    margin-top: 1rem;
    margin-bottom: 1rem;*/
}

/*form-control:focus {
     border-color: #D1E4D1;
     box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25); 
}*/

.PlasHoldr {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.msg {
    color: #F66B0E;
    font-family :'Microsoft JhengHei';
    font-weight: bold;
}

.input_head {
    width: 5%;
    background-color: lightgray;

}

.textbox:hover {
    border-color:dimgrey;
    /*box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);*/
    /*outline:solid !important;*/
    border:1px solid dimgrey;
    box-shadow: 0 0 6px dimgrey;
}

.textbox:focus {
    border-color: dimgrey;
    /*box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);*/
    /*outline:solid !important;*/
    border:1px solid #D1E4D1;
    box-shadow: 0 0 6px dimgrey;
}

    input[type=text], select, textarea {
        padding: 0.4rem; /* Some padding */
        border: 1px solid #ccc; /* Gray border */
        border-radius: 2px; /* Rounded borders */
        /*font-size: 12px;*/
        font-size: 1em;
        box-sizing: border-box; /* Make sure that padding and width stays in place */
        /*margin-top: 3px; /* Add a top margin */
        /* margin-bottom: 3px; /* Bottom margin */
        resize: vertical; /* Allow the user to vertically resize the textarea (not horizontally) */
    }


.txtbox-s {
    width: 40px;
}

.txtbox-m {
    width: 60px;
}

.txtbox-l {
    width: 90px;
}

.txtbox-100 {
    width: 100%;
}

.txtbox-20 {
    width: 20%;
}

.txtbox-30 {
    width: 30%;
}

.txtbox-40 {
    width: 40%; 
}

.txtbox-60 {
    width: 60%;
}

/*dateselect*/
.dateselect {
    width: 50%;
    text-align: left;
}

img.ui-datepicker-trigger {
    height: 20px;
}


/* btn 綠色按鈕 */

.btn-mg {
    margin: 10px 0px 10px 0px;
    padding-left: 10px;
}

.btn-mg .btn {
    background-color: #3d816d;
    color: #F0EBD2;
    font-size: 14px;
}

.btn-mg .btn:hover {
    background-color: white;
    color: #3d816d;
    border-color: #3d816d; /* 006141 */
}


/* btn 橘色按鈕 */
.btnOrng-mg {
    margin: 10px 0px 10px 0px;
    padding-left: 10px;
}

.btnOrng-mg .btn {
background-color: tomato; /* #3d816d */
color: whitesmoke; /* #3d816d */
font-size: 1rem;
}

.btnOrng-mg .btn:hover {
    background-color: #FF5330;
    color: white; /* #3d816d E5E3C9*/
    border-color: #8f1204; /* 006141 */
}





.ddl select, .ddl div select {
    color: #5B5B5B;
    border: 1px solid #ccc; /* Gray border */
    min-width: 100px;
    text-align: left;
    font-size: 1em;
    /*移除箭頭樣式*/
    appearance: none;
    -moz-appearance: none; /* Firefox */
    -webkit-appearance: none; /* Safari and Chrome */
    /*改變右邊箭頭樣式*/
    background: url("/img/icon/imgselect.jpg") no-repeat right center transparent;
    background-size: 30px;
    padding: 0.4rem; /* Some padding */
    border-radius: 2px; /* Rounded borders */
    box-sizing: border-box; /* Make sure that padding and width stays in place */
    resize: vertical; /* Allow the user to vertically resize the textarea (not horizontally) */
}


/* radiobutton 橘色按鈕 */





/*input[type="radio"] + label span {

    display: inline-block;
    width: 18px;
    height: 18px;
    margin: -2px 10px 0 0;
    vertical-align: middle;
    cursor: pointer;
    -moz-border-radius: 50%;
    border-radius: 50%;
    border: 3px solid #ffffff;
}

        input[type="radio"] + label span {
            background-color: #fff;
        }

    input[type="radio"]:checked + label {
        font-size: 1.1em;
        font-weight: bold;
        color: #F0EBD2;
        text-decoration: underline tomato 2px;
        text-underline-offset: 4px;
    }

        input[type="radio"]:checked + label span {
            background-color: #ff8800;
            border: 2px solid #ffffff;
            box-shadow: 2px 2px 2px rgba(0,0,0,.1);
        }*/



.checkmark:after {
  /*left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);*/
}

.b-plus {
    margin: 0px 2px 0px 10px;
    border: 0px;
    padding-left: 20px;
    background-image: url(/img/icon/b-plus.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 16px;
    background-color: #ffffff;
    height: 30px;
    width: 65px;
    vertical-align: middle;
}

.b-plus:hover {
    background-color: #dfdfdf;
}

.b-plus:active {
    background-color: #568297;
}

.b-remove {
    margin: -6px 2px 0px 0px;
    border: 0px;
    background-image: url(/img/icon/del.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    background-color: #ffffff;
    height: 30px;
    width: 30px;
    vertical-align: middle;
}

.b-remove:hover {
    background-color: #dfdfdf;
}

.b-remove:active {
    background-color: #cf2331;
}

.autocomplete_ddl {
    background: url("/img/icon/imgselect.jpg") no-repeat center center transparent;
    background-size: 25px;
    border: 0px;
    margin-left: -27px;
    width: 21px;
    vertical-align: middle;
}

.autocomplete_input_ddl {
    background: url("/img/icon/imgselect.jpg") no-repeat center center transparent;
    background-size: 25px;
    border: 0px;
    margin-left: 0px;
    width: 21px;
    vertical-align: middle;
}

.bg-color0 {
    background-color: #ffffff;
}

.bg-color1 {
    background-color: #33cc99;
}

.bg-color2 {
    background-color: #5EBA89; /**/
}

.bg-color3 {
    background-color: #ebebeb;
}

/*預設畫面高度*/
.Body-hight {
    min-height: 780px; /*min-height:780px;*/
}

/*Footer屬性*/
.footer {
    background-color:#3d816d;
    color:#F0EBD2;
    box-shadow: 0px 3px 8px 0px #000;
}


/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/

.navbar {}
.navbar a:hover { 
    color: #3d816d !important; 
    font-weight: bold;
}
.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}
.navbar .dropdown ul li a:active {
        /* 滑鼠點擊選單樣式*/
        background-color: #3D816D;
        color:#f3f8fa !important; /*red  */
    }
.navbar li {
  /*background-color: #006141;*/
  position: relative;
}
.navbar .navbar-nav .nav-item::after {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        background-color: #F0EBD2; 
        color: #3d816d ;/*red */
        width: 0%;
        content: "";
        height: 4px;
        transition: all 0.5s;
    }
.navbar a i, .navbar a:focus i {
        font-size: 12px;
        line-height: 0;
        margin-left: 5px;
    }
.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a {
  color: #a2cce3;

}

/*.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 1px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
}
*/

    .navbar .dropdown ul {
        margin: 0;
        visibility: hidden;
        background: #fff;
        /*    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);*/
        border-radius: 3px;
        box-shadow: 7px 7px 7px 0px rgba(0, 0, 0, 0.35);
    }

.dropdown:hover > .dropdown-menu, .dropend:hover > .dropdown-menu {
    display: block;
    position: absolute;
    left: 1px;
    top: calc(100% + 30px);
    margin: 0;
    z-index: 99;
    visibility: visible;
    background: #fff;
    /*    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);*/
    border-radius: 3px;
    box-shadow: 7px 7px 7px 0px rgba(0, 0, 0, 0.35);
    transition: 0.3s;
}



.navbar .dropdown ul li {
  min-width: 200px;

}
.navbar .dropdown ul a {
        padding: 10px 20px;
        font-size: 0.95rem;
        text-transform: none;
        color:#1c3745 ; /*red*/
    }
.navbar .dropdown ul a i {
  font-size: 12px;

}

.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {
            /*color: #68A4C4; 滑鼠移到選單上樣式*/
            background-color: #3D816D; /**/
            color: #F0EBD2 !important; /*#68A4C4*/
            border: #006141 1px solid;
        }

.navbar .dropdown:hover > ul {
        opacity: 1;
        top: 100%;
        visibility: visible;
    }
.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}
.navbar .dropdown .dropdown:hover > ul {
        opacity: 1;
        top: 0;
        left: 100%;
        visibility: visible;

    }
@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }
  .navbar .dropdown .dropdown:hover > ul {
    left: -100%;
  }
}


.dropend:hover > .dropdown-menu {
    position: absolute;
    top: 0;
    left: 100%;
}

.dropend .dropdown-toggle {
    align-items: center;
    color: #333 !important;
    text-align: center;
}

    /**
* Mobile Navigation 
*/

    .mobile-nav-toggle {
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}

@media (max-width: 991px) {
  .mobile-nav-toggle {
    display: block;
  }
  .navbar ul {
    display: none;
  }
}
.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(17, 38, 48, 0.9);
  transition: 0.3s;
}
.navbar-mobile .mobile-nav-toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}
.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  background-color: #fff;
  overflow-y: auto;
  transition: 0.3s;
}
.navbar-mobile a, .navbar-mobile a:focus {
  padding: 10px 20px;
  font-size: 15px;
    color: #3d816d;
}
.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {
  color: #68A4C4;
}
.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus {
  margin: 15px;
}
.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}
.navbar-mobile .dropdown ul li {
  min-width: 200px;
}
.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}
.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}
.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {
  color: #68A4C4;
}
.navbar-mobile .dropdown > .dropdown-active {
  display: block;
}

/*^^^^^^^^^^^^^^Navigation Menu^^^^^^^^^^^^^^^^^ */






/*------GRIDVIEW--------------- 
    CssClass="gvStyle" AlternatingRowStyle-CssClass="alt" PagerStyle-CssClass="pgr"
    -----------------------------------------*/
.gvStyle {
 border: 3px Double #CCC;
 width :100%;
}
.gvStyle caption {
     /*text-align:center;
     background-color: #5D7B9D;
    color: White;
    font-size: 16pt;
    font-weight:bold;*/
    padding:2px;

}
/*Header 標題*/
.gvStyle th
{
    background-color:#5ab197 ; /*#E2EAF2淡藍色*/
    color:#f6f5eb;
    font-weight: lighter;
    border: 1px solid #ccc;
    height:25px;
    text-align:center;
    padding :4px ;
}
/*OnMouseOver 滑鼠移過列表時, 背景色變更*/
.gvStyle tr:hover
{
    background-color:#F3FBF1;/*#FFF4DA淡橘色*/
}
/*Rows 列表顏色*/
.gvStyle td
{
  border: 1px solid #ccc;
 height:25px;
 text-align:center;
 padding :4px ;
}
/*Change Rows 如果想要有單、雙列不同顏色替換, 在這裡更換*/
.gvStyle .alt
{
    background-color:#D1E4D1;/*#efefef淡灰色*/
    border: 1px solid #ccc;
    height:25px;
}
/*Page 分頁顏色*/
.gvStyle .pgr table
{
    margin-left:auto;
    margin-right:auto;
}
.gvStyle .pgr td
{
    background-color:#D1E4D1;
    border-width: 0px;
    padding:0px 3px 0px 3px;
}
.gvStyle .pgr a
{
    color: #666; text-decoration:underline;
    padding:0px 3px 0px 3px;
}
.gvStyle .pgr a:hover
{
    color: #FF0000; text-decoration: none;
}


/*^^^^^^^^GRIDVIEW^^^^^^^^^^^^^^*/



/*.nav-link.active .nav-link {
    color: tomato;
    background-color: #5EBA89;
    border-color: #3d816d;
}

.nav-item.show .nav-link {
    color: #68A4C4;
    background-color: #5EBA89;
    border-color: #3d816d;
}
*/
