body{
  background: #f2f2f2;
  padding-bottom: 20px;
}
.white{
  background: #fff;
}

.logo{
  margin-top: 50px;
}

.btn, .well, .form-control{
  border-radius: 0;
}

.well, .navbar-default{
  background: #fff;
}
.navbar-default{
  border-radius: 0;
}

.form-login{
  margin-top: 30px;
  position: relative;
}
.form-login:before{
  content: "";
  bottom: -30px;
  height: 40px;
  background: url(../images/shadow.png) no-repeat bottom right;
  position: absolute;
  width: 100%;
  display: block;
}

.inner-form{
  margin-top: 8px;
  font-weight: bold;
  color: #939393;
}

.list2column{
  list-style: none;
  padding: 0;
  margin: 0; 
  clear: both;
}

.list2column li{
  width: 250px;
  float: left;
}

#bar1{
  height: 400px;
}

.graph_mine{

}

.main-title{
  margin-bottom: 40px;
}

.title-graph{
  margin-bottom: 30px;
}

.graphpie, .graphbar{
  height: 400px;
  margin-bottom: 30px;
}

#grapgh_DRisk_Factor_Trend_Report{
  height: 800px;
}


#graph_get_Functional_Capacity_Trend_Report, #graph_get_Safety_Trend_Report, #graph_get_Cognitive_Trend_Report{
  height: 900px;
}


#graph_get_Self_Reported_Problem_Trend_Report, #get_graph_Depression_Trend_Report{
  height: 1100px;
}

#graph_get_Dietary_Intake_Trend_Report, #get_graph_Safety_Trend_Report{ 
  height: 600px;
}



body.detail{
  padding-bottom: 80px;
}

.wait-xls{
  font-size: 12px;
  position: fixed;
  background: red;
  padding: 15px 25px;
  bottom: 20px;
  left: 10px;
  color: wheat;
}

.alert-danger{
  border-radius: 0;
  padding: 6px 20px;
  font-weight: bold;
  letter-spacing: 1px;
}

.alert {
  border-radius: 0;
  font-size: 12px;
}
.font-xs{
  font-size: 8px;
  top: -2px;
  position: relative;
}
.pagging{
  margin-bottom: 30px;
}
.pagging a, .pagging strong{
  display: inline-block;
  padding: 3px;
  background: #f9f9f9;
  min-width: 26px;
  text-align: center;
  color: #000;
  border: 1px solid #ddd;
}

.pagging strong{
  background: transparent;
  border: 1px solid transparent;
}

button.close{
  margin-top: -3px;
}

.font-sm{
  font-size: 12px;
  font-weight: 700;
}

.ml-20{
  margin-left: 20px;
  margin-top: 10px;
}

.code{
  padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4; 
  border-radius: 4px;
}

.hide-overflowx{
  overflow-x: auto;
}

/*cts helper*/
.cts_title{color: Maroon; font-size: 18px;}
.cts_box{border: 1px solid grey;margin-bottom: 5px; padding: 10px; font-size:16px; font-family: Arial; color: Navy; font-weight: normal;}
.cst_listdisc {list-style-type: disc;}
.cst_listsquare {list-style-type: square;}
.cts_listcircle{list-style-type: circle;}

/*new cts helper*/

.ctshelper .main {
  font-size: 14pt;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: rgb(255,255,255);
  text-shadow: 2px 2px 1px rgb(0,0,0);
  background-color: rgb(0,0,255);
  padding: 5px;
  border: 1px solid rgb(0,0,100);
  border-radius: 5px;
  text-align: left;
  text-indent: 1em;
  letter-spacing: 1px;
  max-width: 65%;
  box-shadow: 0px 10px 15px rgba(0,0,100,0.7) inset,
    0px -15px 20px rgba(0,0,100,07) inset,
    0px 15px 5px -5px rgba(0,0,0,0.7);
}



.ctshelper p, .ctshelper li {
  font-size: 12pt;
  color: black;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.ctshelper .codesample {
  text-align: center;
  color: black;
  padding: 3px;
  font-size: 12pt;
  margin: 5px;
  box-shadow: 1px 1px 1px rgba(0,0,0,0);
  -webkit-transition: background-color .5s;
  -webkit-transition: box-shadow .5s;
  transition: background-color .5s;
  transition: box-shadow .5s;
}

.ctshelper .codesample:hover {
  background-color: yellow;
  box-shadow: 8px 8px 4px rgba(0,0,0,0.8);
}

.ctshelper h3 span {
  width: 100%;
  padding: 3px;
  background: linear-gradient(left, rgb(0,0,200), rgb(255,255,255));
  background: -webkit-linear-gradient(left, rgb(0,0,200),rgb(255,255,255));
  color: rgb(255,255,255);
  border-bottom: 1px solid rgb(0,0,0);
  box-shadow: 3px 3px 0px rgba(0,0,0,0.7);
  margin-top: 10px;
}

.ctshelper ul {
  list-style-type:circle;
}

.ctshelper a:link {
  color: rgb(0,0,200);
  text-decoration: underline;
}

.ctshelper a:visited {
  color: rgb(0,0,200);
  text-decoration: underline;
}

.ctshelper a:hover {
  color: rgb(255,255,255);
  background-color: rgb(0,0,200);
}

.ctshelper a:active {
  color: rgb(0,0,200);
  text-decoration: underline;
}



.ctshelper2 {
  font-family: 'Century Gothic', Tahoma, Geneva, Verdana, sans-serif;
}

.ctshelper2 .subtitle {
  font-size: 21px;
  color: rgb(0,102,166) !important;
  text-decoration: underline;
  background-color: rgb(255,255,255);
}

.ctshelper2 a:link {
  color: rgb(33,64,154);
  text-decoration: underline;
}

.ctshelper2 a:visited {
  color: rgb(33,64,154);
  text-decoration: underline;
}

.ctshelper2 a:hover {
  color: rgb(255,255,255);
  background-color: rgb(33,64,154);
}

.ctshelper2 a:active {
  color: rgb(33,64,154);
  text-decoration: underline;
}

.ctshelper2 .wt1-box {
  border: 1px solid rgb(0,0,0);
  padding: 10px;
  font-family: 'Century Gothic' !important;
  font-size: 16px !important;
  color: rgb(0,0,0);
}

.ctshelper2 .title_line > span {
  background-color: rgb(171,186,195);
  color: rgb(255,255,255);
  border: none !important;
  padding: 5px !important;
  font-size: 24px !important;
  font-weight: normal !important;
  font-family: "Century Gothic" !important;
}

.no-padding{
  padding: 0;
}

.no-margin{
  margin: 0;
}

.white-space20{
  height: 20px;
}

.list_sql li{
  margin-bottom: 10px;
}


.list-template li{
  border-bottom: 1px solid #ddd;
  padding: 15px 0;
}

.list-template li:last-child{
  border-bottom: 0;
}

.ml-20{
  margin-left: 20px;
}

.v-mid{
  vertical-align: middle !important;
}
 
.tr_check_area{
  position: relative;
}

.tr_check_area:before{
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: transparent;
  position: absolute;
}

.modal{
  background: rgba(0,0,0,0.6);
}