* {
font-family: "Noto Sans TC", sans-serif;
}
body {
font-family: "Noto Sans TC", sans-serif;
color: #0e435d;
font-size: 16px;
margin: 0;
}
.container,
.container-fluid {
margin: 0;
padding: 0;
}
button {
outline: none;
}
.row,
.col {
margin: 0;
}
.btn:focus {
box-shadow: none;
}
ul {
list-style: none;
}
// reset end
// --------------------------------------------------
// --------------------------------------------------
// component share start
// --------------------
// .main {
// .leftColumn {
// padding: 0px;
// background-color: #35a9e1;
// overflow: auto;
// // padding: 0px 40px 30px 40px;
// .nav-left{
// background-color: #f8f8f8;
// color: #2e2e2e;
// /* height: 84px; */
// width: 100%;
// padding-bottom: 12px;
// // display: flex;
// // flex-direction: row;
// width: 100%;
// &.logins{
// font-size: 16px;
// background-color: #f8f8f8;
// color: #2e2e2e;
// display: flex;
// flex-direction: row;
// justify-content: end;
// width: 100%;
// }
// &.headerBarSmall {
// margin-left: 0px;
// margin-right: 0px;
// padding: 10px;
// }
// .login-cont {
// display: flex;
// flex-direction: row;
// justify-content: space-between;
// align-items: center;
// font-size: 16px;
// color: #0e435d;
// }
// .navbar-light {
// .navbar-collapse-adminSchool{
// padding-bottom: 50px;
// // width: 100%;
// }
// }
// }
// .navbar-collapse {
// width: 160px;
// .navbar-collapse-adminSchool {
// padding-bottom: 50px;
// width: 100%;
// }
// }
// }
// .rightColumn {
// width: 100%;
// .headerBar{
// background-color: #a4d3e6;
// color: #2e2e2e;
// height: 44px;
// padding-top: 12px;
// padding-bottom: 12px;
// width: 100%;
// .login{
// font-size: 16px;
// color: #2e2e2e;
// display: flex;
// flex-direction: row;
// justify-content: end;
// }
// }
// }
// }
// @media screen and (min-width:768px){
// .main {
// .leftColumn{
// height: 100vh;
// }
// }
// }
.btn-wt {
border: 1px solid #35a9e1;
border-radius: 0px;
padding: 4px 16px;
// line-height: 32px;
font-size: 16px;
color: #35a9e1;
background-color: #fff;
outline: none;
cursor: pointer;
img {
margin-right: 5px;
padding-bottom: 3px;
}
&:hover {
// color: #fff;
// opacity: 85%;
// background-color: #ababab;
// border: 1px solid #ababab;
background-color: #f1f8fb;
text-decoration: none;
outline: none;
}
&:focus {
box-shadow: none;
}
&.blue {
background-color: #35a9e1;
color: #fff;
outline: none;
// border-radius: 0px;
&:hover {
background-color: #5dbae7;
outline: none;
}
}
&.bt48, &.add {
height: 48px;
background-color: #35a9e1;
color: #fff;
outline: none;
// border-radius: 0px;
&:hover {
background-color: #5dbae7;
outline: none;
}
}
// &.nopic {
// padding: 6px 30px;
// }
// &.back {
// width: 170px;
// height: 45px;
// // margin-right: 15px;
// padding: 0;
// }
}
.loginBG {
height: 100vh;
background: rgba(245, 251, 253, 1);
background: -moz-linear-gradient(top, rgba(245, 251, 253, 1) 0%, rgba(233, 246, 252, 1) 100%);
background: -webkit-gradient(
left top,
left bottom,
color-stop(0%, rgba(245, 251, 253, 1)),
color-stop(100%, rgba(233, 246, 252, 1)));
background: -webkit-linear-gradient(top, rgba(245, 251, 253, 1) 0%, rgba(233, 246, 252, 1) 100%);
background: -o-linear-gradient(top, rgba(245, 251, 253, 1) 0%, rgba(233, 246, 252, 1) 100%);
background: -ms-linear-gradient(top, rgba(245, 251, 253, 1) 0%, rgba(233, 246, 252, 1) 100%);
background: linear-gradient(to bottom, rgba(245, 251, 253, 1) 0%, rgba(233, 246, 252, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5fbfd', endColorstr='#e9f6fc', GradientType=0 );
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
.login-area {
// display: flex;
// flex-direction: row;
justify-content: center;
align-items: center;
}
.login-title {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-bottom: 30px;
.topic {
font-size: 22px;
color: #0e435d;
display: block;
}
}
.form-group {
margin-bottom: 32px;
}
}
#nav-btn {
fill: white;
// height: 40px;
position: absolute;
right: 10px;
top: 7px;
display: none;
}
.vertical-line {
margin-top: 30px;
margin-bottom: 30px;
width: 35px;
border-bottom: #f7f7f7 4px solid;
}
// body {
// -webkit-font-smoothing: antialiased;
// font: normal 15px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
// color: #232525;
// }
.dropdown-group {
font-size: 0;
.w-72px {
width: 312px;
}
.dropdown {
display: inline-block;
vertical-align: top;
margin-right: 16px;
.dropdown-toggle {
height: 48px;
border: 1px solid #35a9e1;
border-radius: 2px;
padding: 0 10px;
font-size: 16px;
line-height: 32px;
color: #35a9e1;
}
.dropdown-toggle:after {
margin-left: 16px;
}
.dropdown-toggle:focus {
box-shadow: none;
}
.dropdown-toggle::after {
border-top: 0.5em solid;
}
.dropdown-menu {
border: #35a9e1 1px solid;
}
}
}
.search-group {
display: flex;
flex-direction: row;
.title {
display: inline-block;
vertical-align: middle;
font-size: 16px;
margin-bottom: 0;
padding-right: 5px;
}
.input {
display: inline-block;
vertical-align: middle;
border: 1px solid #35a9e1;
width: 240px;
// width: 100%;
height: 48px;
padding: 3px 10px;
margin-right: 12px;
outline: none;
color: #85a0ad;
&::placeholder {
color: #85a0ad!important;
}
}
.input:focus {
box-shadow: 0 0 0 0;
border: 1px solid #35a9e1;
box-shadow: 0 0 3px rgba($color: #35a9e1, $alpha: 0.5);
}
// input[type="date"].form-control,
// .custom-select,
// .form-control {
// display: inline-block;
// vertical-align: middle;
// width: 195px;
// height: 32px;
// border: 1px solid #0e435d;
// border-radius: 0;
// margin-right: 12px;
// padding: 3px 10px;
// }
.unit {
margin-right: 12px;
display: inline-block;
vertical-align: middle;
font-size: 16px;
}
}
.custom-select {
border: 1px solid #0e435d;
border-radius: 0;
&.blue {
height: 48px;
border: 1px solid #35a9e1;
border-radius: 2px;
padding: 0 10px;
font-size: 16px;
line-height: 32px;
color: #35a9e1;
width: 72px;
background: #fff url(../images/icon/icon_selectBG.gif) no-repeat right;
margin-right: 14px;
.items {
color: #35a9e1;
// background-color: #35a9e1;
height: 48px!important;
}
}
}
.custom-control-input:checked ~ .custom-control-label::before {
color: #fff;
border-color: #35a9e1 !important;
background-color: #35a9e1 !important;
}
.form-check-input[type="radio"]:checked + label:after,
.form-check-input[type="radio"].with-gap:checked + label:after,
label.btn input[type="radio"]:checked + label:after,
label.btn input[type="radio"].with-gap:checked + label:after {
background-color: #35a9e1 !important;
}
.table {
color: #0e435d;
&.table-hrm {
color: #0e435d;
margin-top: 16px;
td, th {
border: #3e697d 1px solid;
// vertical-align: -webkit-baseline-middle;
// padding: 16px!important;
}
th {
padding: 15px;
min-width: 75px;
&.twoword {
min-width: 85px;
}
&.fourword {
min-width: 135px;
}
}
td {
vertical-align: middle;
line-height: 1.6;
&.pic {
padding: 8px 16px;
}
}
}
&.table-bordered {
border: 1px solid #fff;
}
/* vertical-align: top; */
&.table-striped tbody tr:nth-of-type(odd) {
// background-color: #f5fbfd;
background-color: rgba(53, 169, 225, 0.05);
}
thead {
tr {
.tr-rwd-hide {
font-size: 16px;
}
}
th.pic-edit {
width: 48px;
}
}
tbody {
td.pic-edit {
width: 48px;
text-align: center;
}
}
}
.pagination {
font-size: 0;
display: flex;
flex-direction: row;
justify-content: end;
align-items: center;
margin-top: 65px;
.pren, .pren:hover {
// display: inline-block;
vertical-align: middle;
border: 0;
width: 24px;
height: 24px;
background-image: url("../images/icon/icon-pren.svg");
background-repeat: none;
background-position: center;
// cursor: pointer;
text-decoration: none;
&.active, &.active:hover {
background-image: url("../images/icon/icon-pren2.svg");
cursor: pointer;
}
&.all, &.all:hover {
background-image: url("../images/icon/icon-front.svg");
// cursor: pointer;
}
&.all.active, &.all.active:hover {
background-image: url("../images/icon/icon-front2.svg");
cursor: pointer;
}
}
.next, .next:hover {
display: inline-block;
vertical-align: middle;
border: 0;
width: 24px;
height: 24px;
background-image: url("../images/icon/icon-next.svg");
background-repeat: none;
background-position: center;
// cursor: pointer;
&.active, &.active:hover {
background-image: url("../images/icon/icon-next2.svg");
cursor: pointer;
}
&.all, &.all:hover {
background-image: url("../images/icon/icon-end.svg");
// cursor: pointer;
}
&.all.active, &.all.active:hover {
background-image: url("../images/icon/icon-end2.svg");
cursor: pointer;
}
}
.page-number {
display: inline-block;
vertical-align: middle;
width: 32px;
height: 32px;
margin-right: 2px;
margin-left: 2px;
line-height: 28px;
// border: 1px solid #ddd;
// border-radius: 4px;
// padding: 2px 14px;
font-size: 16px;
text-align: center;
background-color: #fff;
color: #35a9e1;
cursor: pointer;
text-decoration: none;
&.active {
background-color: #35a9e1;
color: #fff;
cursor: pointer;
}
}
// .page-total {
// margin-right: 14px;
// font-size: 16px;
// color: #525252;
// line-height: 24px;
// }
}
.sorter:after{
// font-family: "Font Awesome 5 Free";
// font-weight: 900;
// content: " \f079";
// color: #0e435d;
content:url(../images/icon/icon-sort.svg);
height: 18px;
width: 9px;
margin-left: 8px;
}
.sortable{
/*cursor: default;*/
cursor: pointer;
}
.unsortable:after{
content: "";
}
.asc:after{
// font-family: "Font Awesome 5 Free";
// font-weight: 900;
// content: " \f077";
// color: #0e435d;
content:url(../images/icon/icon-sort-up.svg);
margin-left: 8px;
}
.desc:after{
// font-family: "Font Awesome 5 Free";
// font-weight: 900;
// content: " \f078";
// color: #0e435d;
content:url(../images/icon/icon-sort-down.svg);
margin-left: 8px;
}
aside {
position: fixed;
float: left;
width: 160px;
// padding-top: 30px;
// padding-left: 25px;
top: 0;
bottom: 0;
background-color: #35a9e1;
z-index: 400;
.navbar-light .navbar-toggler {
// border-color: rgba(251, 251, 251, 1);
border-color: rgba(0,0,0,0);
&.navbar-toggler-admin{
// color: rgba(14, 67, 93, 1) !important;
// border-color: rgba(14, 67, 93, 0) !important;
// border: 5px;
padding: 0px;
}
// .navbar-toggler-icon {
// width: 1.5em;
// height: 1.5em;
// border-color: rgba(14, 67, 93, 1) !important;
// }
}
.navbar-light .navbar-toggler-icon {
background-image: url(../images/icon/icon-nav.svg);
width: 45px;
height: 45px;
outline: none;
}
nav {
display: block;
&.leftColum {
padding-top: 96px;
}
ul {
padding: 0;
&.item-list {
// margin-top: 64px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.items {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 19px;
letter-spacing: -0.032rem;
margin-bottom: 46px;
color: #fff;
width: 120px;
height: 120px;
img {
width: 64px;
height: 64px;
margin-bottom: 5px;
}
&:hover, &.active {
// background-color: rgba(#fff, .5);
// border-radius: 50%;
// position: absolute;
// position: relative;
// top: 0px;
// left: 50%;
// transform: translateX(-50%);
text-decoration: none;
background-image: url(../images/icon/icon-bg.png);
background-repeat: none;
background-position: top center;
}
}
.version {
padding: 10px;
text-align: left;
font-size: 10px;
// font-family: "Noto Sans TC", sans-serif;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
}
}
}
}
.ham-area {
display: none;
}
}
header {
float: left;
width: calc(100% - 160px);
// padding-left: calc(230px + 7%);
// padding-top: 30px;
// padding-bottom: 30px;
background-color: #a2d2e6;
// border-bottom: #2b99ff 2px solid;
position: fixed;
height: 64px;
z-index: 300;
&.headerbar {
width: calc(100% - 0px);
padding-left: 180px;
padding-right: 32px;
display: flex;
justify-content: end;
align-items: center;
// display: none;
.btn-wt {
outline: none;
}
}
.login-cont {
display: flex;
flex-direction: row;
justify-content: end;
align-content: center;
label {
font-size: 16px;
color: #0e435d;
padding-top: 6px;
padding-right: 8px;
margin-bottom: 0;
}
}
.menubg {
height: 64px;
background-color: #a2d2e6;
// display: none;
}
}
/* login */
article {
float: left;
// margin-left: calc(230px + 9%);
margin-left: calc(160px + 50px);
margin-right: 5%;
padding-top: 136px;
width: calc(95% - 160px);
// width:calc(82% - 230px);
padding-bottom: 150px;
.article-topic {
display: none;
}
.tab-cont {
padding: 0 20px;
}
.nav-tabs {
border-bottom: 1px solid rgba(14, 67, 93, 0.5);
margin-bottom: 30px;
// margin-top: 35px;
.nav-link {
padding: 12px 16px;
font-size: 16px;
color: #35a9e1;
background-color: #ecf3f7;
border-bottom: #86a1ae 1px solid;
margin-right: 8px;
border-radius: 0;
.line{
border-bottom: #fff 2px solid;
// line-height: 32px;
// :hover {
// border-bottom: #2bb5c1 2px solid;
// }
}
.nav-link:hover{
// border-top-left-radius: 8px;
// border-top-right-radius: 8px;
// border-color: #bfbfbf #bfbfbf #fff;
border-color: #86a1ae #86a1ae #fff;
border-bottom: 2px solid #86a1ae;
.nav-link:hover .line{
border-bottom: #2bb5c1 2px solid;
padding-bottom: 3px;
}
}
}
.nav-link.active {
font-size: 16px;
color: #0e435d;
// border-top-left-radius: 8px;
// border-top-right-radius: 8px;
border-color: rgba(14, 67, 93, 0.5) rgba(14, 67, 93, 0.5) #fff;
font-weight: 500;
// border-color: #808080 #808080 #fff;
.line{
border-bottom: #2bb5c1 2px solid;
padding-bottom: 3px;
}
}
}
.welcome-topic {
font-size: 24px;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top: 98px;
.welcome-pic {
max-width: 480px;
margin-top: 85px;
}
}
.erron-cont {
padding: 0 20px;
font-size: 24px;
// display: flex;
// flex-direction: row;
// justify-content: center;
align-items: center;
margin-top: 98px;
}
}
// nav {
// display: block;
// }
// nav ul {
// padding: 0;
// }
// nav ul li {
// line-height: 30px;
// }
// nav ul li a {
// color: #e3e2e2;
// }
// nav ul li a:hover {
// color: #2b99ff;
// }
#products {
padding-top: 40px;
font-weight: bold;
color: #f7f7f7;
}
h1 {
font-family: Arial, Helvetica, sans-serif;
color: white;
margin-bottom: 50px;
font-size: 1.5em;
}
// h2 {
// font-family: Arial, Helvetica, sans-serif;
// font-size: 2.4em;
// font-weight: bold;
// color: #474958;
// -webkit-transition: font-size 0.3s;
// -moz-transition: font-size 0.3s;
// -o-transition: font-size 0.3s;
// transition: font-size 0.3s;
// }
.message-group {
display: flex;
flex-direction: row;
justify-content: center;
label {
color: #0e435d;
}
}
.form-control {
height: calc(24px + 12px + 2px);
padding: 4px 8px;
font-size: 16px;
border-radius: 4px;
border: 1px solid #0e435d;
border-radius: 0px;
flex: none;
&.login {
height: calc(18px + 12px + 2px);
padding: 2px 8px;
}
&.noline {
border: 1px solid rgba(14, 67, 93, 0);
}
}
.modal {
.admin {
border-radius: 0;
}
.modal-dialog {
padding: 0px;
&.changecode {
width: 400px;
}
&.success {
width: 302px;
}
}
.modal-content {
border: 0px solid rgba(0,0,0,.2);
border-radius: 0rem;
.modal-header{
background-color: #0e435d;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom: 0px solid #dee2e6;
padding: 0.5rem 1rem;
// &.whitebg {
// background-color: #fff;
// }
.topic{
font-size: 24px;
margin-bottom: 0;
color: #fff;
}
.close {
color: #fff;
font-size: 1.5rem;
opacity: 1;
outline: none;
&.whitebg {
color: #0e435d!important;
font-weight: 900;
text-shadow: 0 1px 0 #0e435d;
padding: 16px;
}
}
&.whitebg {
background-color: #fff;
}
}
.modal-body {
color: #0e435d;
padding: 48px;
&.password{
padding: 64px 64px 30px;
}
&.checkcont {
padding: 24px 20px 30px;
}
&.height100{
height: 100vh;
}
&.Addcont {
padding: 48px 48px 10px;
}
.message-group {
display: flex;
flex-direction: row;
justify-content: center;
label {
color: #0e435d;
}
}
.form-group {
margin-bottom: 15px;
align-items: center;
span {
padding: 0;
}
}
.adminbg {
background-color: rgba(14, 67, 93, 0.05);
padding: 15px;
display: flex;
flex-direction: column;
}
}
.modal-footer {
border-top: 1px;
border-top: 0px solid #dee2e6;
}
}
}
.NB-show {
display: inline-block;
}
.phone-show {
display: none;
}
// 圖表設定
.highcharts-credits {
fill:#ffffff!important;
}
// .highcharts-root {
// width: 685px;
// height: 600px;
// }
// .highcharts-figure,
// .highcharts-data-table table {
// min-width: 320px;
// max-width: 1900px;
// margin: 1em auto;
// }
.highcharts-background {
opacity: 0;
}
.HC-area {
margin-top: 72px;
.chart-topic {
border-left: #35a9e1 8px solid;
font-size: 24px;
color: #0e435d;
display: flex;
flex-direction: column;
padding-left: 16px;
height: 96px;
margin-bottom: -50px;
margin-left: 10%;
.math {
font-size: 48px;
line-height: 40px;
}
}
.chart-cont {
display: flex;
justify-content: center;
height: 650px;
label {
font-size: 24px;
color: #fff;
}
}
.HC-list {
display: flex;
flex-direction: column;
.topic {
font-size: 24px;
line-height: 21px;
color: #0e435d;
margin-bottom: 20px;
}
.HC-cont {
display: flex;
flex-direction: row;
margin-bottom: 50px;
.cont-city {
padding-right: 35px;
}
}
.fam-order {
background-color: rgba(14, 67, 93, 0.05);
padding: 20px;
.title {
padding: 4px 8px;
border-radius: 16px;
color: #fff;
background-color: #0e435d;
}
.fam-cont {
display: flex;
justify-content: center;
}
.order-cont {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
margin-top: 20px;
img {
width: 72px;
height: 72px;
margin-bottom: 8px;
}
label {
margin-bottom: 0px;
font-size: 15px;
letter-spacing: -.05rem;
}
}
}
}
}
@media (max-width: 1366px) {
.HC-area {
.chart-topic {
margin-left: 25px;
}
}
}
@media (min-width: 1366px) {
.HC-area {
.fam-order {
width: 85%;
}
}
}
@media screen and (min-width: 768px) and (max-width: 1023px){
.fam-order {
.fam-cont {
justify-content: start!important;
}
}
}
@media (max-width: 768px) {
article {
width: 88%;
float: left;
margin-left: 25px;
margin-right: 20px;
padding-top: 0px;
&.chart {
width: 100%;
padding: 0;
margin: 0;
}
.article-topic {
font-size: 24px;
display: flex;
flex-direction: row;
justify-content: center;
align-content: center;
align-self: center;
margin: 35px;
label {
margin-top: 5px;
margin-left: 16px;
}
}
.tab-cont {
padding: 30px 20px;
.tab-pane {
padding: 0 20px;
}
}
.welcome-topic {
.welcome-pic {
width: 100%;
margin-top: 35px;
}
}
}
.custom-select {
width: 100%!important;
margin-bottom: 8px;
margin-top: 8px;
&.blue {
margin-right: 0px!important;
}
}
.search-group {
flex-direction: column;
.input {
width: 100%;
}
.dropdown-group {
width: 100%;
.dropdown {
width: 100%;
.dropdown-toggle {
width: 100%;
margin-bottom: 8px;
margin-top: 8px;
}
}
}
.btn-wt.blue {
width: 100%;
margin-bottom: 8px;
height: 48px;
}
.btn-wt.add {
// width: 100%;
margin-bottom: 8px;
height: 48px;
}
}
.phone-show {
display: inline-block!important;
}
.phone-row {
display: flex!important;
flex-direction: row!important;
}
.NB-show {
display: none!important;
}
.pagination {
justify-content: center;
}
.table {
color: #0e435d;
&.table-hrm {
color: #0e435d;
margin-top: 16px;
td, th {
border: #3e697d 0px solid;
&.pic {
padding: 0px;
}
}
}
}
.table-rwd{
min-width: 100%;
tr {
display: block;
border: 1px solid #0e435d;
margin-top: 5px;
padding-top: 8px;
padding-bottom: 8px;
}
th {
text-align: left !important;
padding-top: 5px;
padding-bottom: 5px;
}
td:before{
content: attr(data-th) " : "; /*關鍵語法*/
display: inline-block;
font-weight: 400;
// color: #aaaaaa;
margin-right: 8px;
}
td {
text-align: left !important;
/*font-size: 15px;*/
overflow: hidden;
width: 100% !important;
display: block;
padding-top: 5px;
padding-bottom: 5px;
// font-weight: 500;
.specialTD{
color: #35a9e1;
}
.specialTD:before{
content: attr(data-th) "*";
color: #35a9e1;
margin-right: 0px;
}
.emptyTD{
display: none;
}
.buttonTD{
padding-top: 15px;
color: #35a9e1;
text-align: center !important;
}
}
}
.table-rwd td.buttonTD:before{
content: attr(data-th) "";
color: #35a9e1;
margin-right: 0px;
}
/*針對tr去做隱藏*/
tr.tr-rwd-hide {
display: none !important;
}
.table-rwd-noDataTh td:before{
content: attr(data-th) "";
margin-right: 0px;
}
// .table-rwd tr{
// display: block;
// border: 1px solid #0e435d;
// margin-top: 5px;
// padding-top: 8px;
// padding-bottom: 8px;
// }
// .table-rwd th {
// text-align: left !important;
// padding-top: 5px;
// padding-bottom: 5px;
// }
// .table-rwd td {
// text-align: left !important;
// /*font-size: 15px;*/
// overflow: hidden;
// width: 100% !important;
// display: block;
// padding-top: 5px;
// padding-bottom: 5px;
// font-weight: 500;
// }
// .table-rwd td:before{
// content: attr(data-th) " : "; /*關鍵語法*/
// display: inline-block;
// margin-right: 10px;
// }
// .table-rwd-noDataTh td:before{
// content: attr(data-th) "";
// margin-right: 0px;
// }
// .table-rwd td.specialTD{
// color: #35a9e1;
// }
// .table-rwd td.specialTD:before{
// content: attr(data-th) "*";
// color: #35a9e1;
// margin-right: 0px;
// }
// .table-rwd td.emptyTD{
// display: none;
// }
// .table-rwd td.buttonTD{
// padding-top: 15px;
// color: #35a9e1;
// text-align: center !important;
// }
// .table-rwd td.buttonTD:before{
// content: attr(data-th) "";
// color: #35a9e1;
// margin-right: 0px;
// }
.table-rwd td.buttonTD a, .table-rwd td.buttonTD button{
// display: inline-block;
/* background-color: #35a9e1;
color: #fff; */
padding: 4px 30px;
text-align: center;
}
.table-rwd td.buttonTD a.btn-blue-text, .table-rwd td.buttonTD button.btn-blue-text{
/* display: block; */
background-color: #35a9e1;
color: #fff;
border-radius: 0;
width: 100%;
height: 48px;
line-height: 36px;
padding-left: 28px;
img {
padding-right: 8px;
margin-bottom: 3px;
}
/* padding: 4px 30px;
text-align: center; */
}
.table-rwd td.buttonTD a.btn-darkGrey-solid, .table-rwd td.buttonTD button.btn-darkGrey-solid{
// display: inline-block;
background-color: #464646;
color: #fff;
/* padding: 4px 30px;
text-align: center; */
}
aside {
float: left;
width: 100%;
// padding-left: 5%;
position: relative;
float: left;
// height: 72px;
// padding-top: 10px;
// padding-bottom: 10px;
nav.leftColum {
padding-top: 0;
ul.item-list {
display: none;
}
}
.ham-area {
display: block;
background-color: #9ecde1;
height: 64px;
text-align: right;
padding: 10px;
}
}
header {
float: left;
position: relative;
width: 100%;
padding-left: 5%;
&.headerbar {
padding-left: 0px;
display: none;
}
// .phone-none {
// display: none;
// }
// .menubg {
// display: none;
// }
}
nav {
display: none;
.leftColum {
background-color: #35a9e1;
}
}
#nav-btn {
fill: white;
// height: 40px;
// width: 40px;
position: absolute;
right: 7px;
top: 7px;
display: block;
cursor: pointer;
}
h1 {
margin-bottom: 0px;
}
.vertical-line {
margin-top: 20px;
margin-bottom: 20px;
display: none;
}
#products {
padding-top: 0;
}
.modal {
&.modal-backdrop.ItemsIcon.fade {
opacity: 0;
}
&.modal-backdrop.ItemsIcon.show {
opacity: 0.8;
}
&.ItemsIcon {
background-color: rgba(0, 0, 0, .3);
}
// .modal-dialog {
// }
.modal-content.ItemsIcon {
background-color: rgba(0, 0, 0, 0);
.modal-header.ItemsIcon{
background-color: rgba(0, 0, 0, 0);
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom: 0px solid #dee2e6;
padding: 0.5rem 1rem;
// &.whitebg {
// background-color: #fff;
// }
.topic{
font-size: 24px;
margin-bottom: 0;
color: #fff;
}
.close {
color: #fff;
font-size: 1.5rem;
opacity: 1;
&.whitebg {
color: #fff!important;
font-weight: 400;
// text-shadow: 0 1px 0 #fff;
padding: 36px;
}
}
}
.modal-body {
color: #0e435d;
padding: 48px;
background-color: rgba(0, 0, 0, 0);
&.checkcont {
padding: 24px 20px 30px;
}
.phoneItem {
display: block;
&.leftColum {
padding-top: 96px;
}
ul {
padding: 0;
&.item-list {
// margin-top: 64px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.items {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 19px;
letter-spacing: -0.032rem;
margin-bottom: 46px;
color: #fff;
width: 120px;
height: 120px;
img {
width: 64px;
height: 64px;
margin-bottom: 5px;
}
&:hover, &.active {
// background-color: rgba(#fff, .5);
// border-radius: 50%;
// position: absolute;
// position: relative;
// top: 0px;
// left: 50%;
// transform: translateX(-50%);
text-decoration: none;
background-image: url(../images/icon/icon-bg.png);
background-repeat: none;
background-position: top center;
}
}
}
}
}
}
.modal-footer {
background-color: rgba(251, 251, 251, 0);
}
}
}
.HC-area {
margin-top:0px;
.chart-cont {
height: 450px;
}
.HC-list {
text-align: center;
}
.HC-cont {
justify-content: center;
}
}
}
@media (max-width: 420px) {
.HC-area {
height: 400px;
}
}