/*public*/ 
body,html{margin:0px;padding:0px;} 
.clear{clear:both;} 
.v{font-family: "Book Antiqua";font-size: 20px;font-style: italic;} 
.font{font-family: "times new roman";font-size: 15px;font-style: italic;}
.doge-top{height:70px;}
@media screen and (max-width:1200px){
	.doge-top{height:0px;}
}
input[type="number"]{display:none;}
/*header*/
.navbar{min-height:80px;}
.navbar .titleul{width:65%;}
.navbar .titleul .title{display:block;color:#333;font-family: "MicrosoftJhengHei" ;font-size:bold;font-size:50px;display:block;width:100%;text-align: center}
.navbar .info{background:url("../imgs/info.png") center center no-repeat;background-size:30px 30px;width:30px;height:80px;line-height:80px!important;border:none;display:block!important;}
.navbar .navbar-brand{height:auto;float:left;}
.navbar-nav > li > a{line-height:45px;}
@media screen and (max-width:768px){
	.navbar{margin-bottom: 0px;}
	.navbar .titleul{width:100%;float: none;margin: 7.5px 0px;}
	.navbar .titleul .title{width:100%;}
	.navbar .info{width:100%;text-align: center;}
	.tooltip{display:none!important;}
}

/*function*/ 
.function{text-align:center;width:27%;float:right;background-color: #faf8f8;padding:3% 1% 3%;margin-top:1%;border-radius: 15px;} 
.function #v_range{max-width: 300px;margin:15px auto;} 
.function .clock{position:relative;} 
.function .clock #preview-textfield{position: absolute;top: 55px;left: 0;right: 0;text-align: center;font-weight: bold;}
.function .ms{position:absolute;top:85px;left:0px;display:block;text-align:center;width:100%;}

#canvasThr{width:100%;padding:2.5% 0;}

.bottom{  border-top: 1px solid #E6E6E6;}
.bottom span{display: block;text-align: center;}
.ui-slider .ui-btn {background-color: #fff;border: 1px solid #999;color: #333;text-shadow: 2px 2px 3px #000;transition: 0.5s;-moz-transition: 0.5s;	-webkit-transition: 0.5s;	-o-transition: 0.5s;	
}
.ui-slider .ui-btn:active {background-color: #5e5e5e;border-color: #c7c7c7;transition: 0.5s;-moz-transition: 0.5s;-webkit-transition: 0.5s;-o-transition: 0.5s;	}
.ui-slider-track .ui-btn.ui-slider-handle{top: 100%;width: 20px;height: 20px;}


.ui-slider-track{margin: 0 15px 0 15px;height:10px;}
.ui-bar-a, .ui-page-theme-a .ui-bar-inherit, html .ui-bar-a .ui-bar-inherit, html .ui-body-a .ui-bar-inherit, html body .ui-group-theme-a .ui-bar-inherit{
  background-color: #a1a1a1;
 /* border-color: #616161;*/
  color: #333;
  text-shadow: 0 1px 0 #eee;
  font-weight: bold;
}
/*input[type=range] {-webkit-appearance: none; width: 100%; }
input[type=range]::-webkit-slider-thumb {-webkit-appearance: none; }
input[type=range]:focus {outline: none; }
input[type=range]::-ms-track {width: 100%; cursor: pointer; background: transparent; border-color: transparent; color: transparent; }
input[type=range]::-webkit-slider-thumb {-webkit-appearance: none; border: 1px solid #999; height: 20px; width: 20px; border-radius: 3px; background: #ffffff; cursor: pointer; margin-top: -5px; box-shadow: 1px 1px 1px #999, 0px 0px 1px #999; }
input[type=range]::-moz-range-thumb {box-shadow: 1px 1px 1px #999, 0px 0px 1px #999; border: 1px solid #999; height: 36px; width: 16px; border-radius: 3px; background: #ffffff; cursor: pointer; }
input[type=range]::-ms-thumb {box-shadow: 1px 1px 1px #999, 0px 0px 1px #999; border: 1px solid #999; height: 36px; width: 16px; border-radius: 3px; background: #ffffff; cursor: pointer; } 
input[type=range]::-webkit-slider-runnable-track {width: 100%; height: 8.4px; cursor: pointer; box-shadow: 1px 1px 1px #999, 0px 0px 1px #999; background: #999; border-radius: 1.3px; border: 0.2px solid #999; }
input[type=range]:focus::-webkit-slider-runnable-track {background: #525252;}

input[type=range]::-moz-range-track {width: 100%;height: 8.4px;cursor: pointer;box-shadow: 1px 1px 1px #999, 0px 0px 1px #999;background: #999; border-radius: 1.3px; border: 0.2px solid #999; }
input[type=range]::-ms-track {width: 100%; height: 8.4px; cursor: pointer; background: transparent; border-color: transparent; border-width: 16px 0; color: transparent; } 
input[type=range]::-ms-fill-lower {background: #999; border: 0.2px solid #999; border-radius: 2.6px; box-shadow: 1px 1px 1px #999, 0px 0px 1px #999; } input[type=range]:focus::-ms-fill-lower {
  background: #999;}
input[type=range]::-ms-fill-upper {background: #999; border: 0.2px solid #999; border-radius: 2.6px; box-shadow: 1px 1px 1px #999, 0px 0px 1px #999; } 
input[type=range]:focus::-ms-fill-upper {background: #999;}*/


@media screen and (min-width:768px){
	#canvasOne{width:35%;margin-left:0.5%;float:left;}
	#canvasTwo{width:35%;margin-right:0.5%;float:left;}
}
@media screen and (max-width:1030px){
	.function{padding: 1.5% 1% 2%;margin-top: 2%;}
}
@media screen and (max-width:768px){
	#canvasOne{width:48%;float:left;}
	#canvasTwo{width:48%;float:right;}
	.function{width:100%;float:none;}
}