@charset "utf-8";
/* CSS Document */

	@import url(notosanstc.css); 
	
	
	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {font-family: 'Noto Sans TC', sans-serif;}
	
	.navbar{ padding:.2em 1.6em;}
	
	.navbar-toggler-icon {
		width: 1em;
		height: 1em;
		border:0;
	}
	
	.navbar-light .navbar-nav .nav-link { color: rgba(0,0,0,.8);}

	.nav > li.dropdown.open {
	  position: static;
	}
	
	.nav > li.dropdown.open .dropdown-menu {
	  display: table;
	  border-radius: 0px;
	  width: 100%;
	  text-align: center;
	  left: 0;
	  right: 0;
	}
	
	.dropdown-menu > li {
	  display: table-cell;
	  height: 50px;
	  line-height: 50px;
	  vertical-align: middle;
	}
	
	
	@media screen and (max-width: 767px) {
	  .dropdown-menu > li {
		display: block;
	  }
	}
	
	
	.navbar-expand-lg .navbar-nav .nav-link {
		padding: 0 1.6rem ;
	}
	
	.carousel-indicators > li {
	  border-radius: 50%;
	  width: 5px;
	  height: 5px;
	}
	
	
	.boxhref{ border-bottom: solid 3px #eeeeee; border-top: solid 1px #eeeeee;  box-shadow: inset 0 0 5px white, 1px 0px 5px rgba(0, 0, 0, 0.2);}
	.boxhref:hover{ border-bottom: solid 3px #333333;}
	
	.sticky.is-sticky {
	  position: fixed;
	  left: 0;
	  right: 0;
	  top: 0;
	  z-index: 1000;
	  width: 100%;
	}
	
	.vhidden{ display:none;}
	
	.flight{ font-weight:100;}
	
	
	@media (max-width: 575.98px) { 
	.row {
	  margin-left: 0;
	  margin-right: 0;
	}
	.rowz{ padding:0; }	
	}
	
	
/*	Sidebar Styles */
/*!
 * Start Bootstrap - Simple Sidebar (https://startbootstrap.com/template-overviews/simple-sidebar)
 * Copyright 2013-2017 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-simple-sidebar/blob/master/LICENSE)
 */

body {
  overflow-x: hidden;
}

#wrapper {
  padding-left: 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#wrapper.toggled {
  padding-left: 250px;
}

#sidebar-wrapper {
  z-index: 1000;
  position: fixed;
  left: 250px;
  width: 0;
  height: 100%;
  margin-left: -250px;
  overflow-y: auto;
  background: #000;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#wrapper.toggled #sidebar-wrapper {
  width: 250px;
}

#page-content-wrapper {
  width: 100%;
  position: absolute;
  padding: 15px;
}

#wrapper.toggled #page-content-wrapper {
  position: absolute;
  margin-right: -250px;
}


/* Sidebar Styles */

.sidebar-nav {
  position: absolute;
  top: 0;
  width: 250px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.sidebar-nav li {
  text-indent: 20px;
  line-height: 40px;
}

.sidebar-nav li a {
  display: block;
  text-decoration: none;
  color: #999999;
}

.sidebar-nav li a:hover {
  text-decoration: none;
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
}

.sidebar-nav li a:active, .sidebar-nav li a:focus {
  text-decoration: none;
}

.sidebar-nav>.sidebar-brand {
  height: 65px;
  font-size: 18px;
  line-height: 60px;
}

.sidebar-nav>.sidebar-brand a {
  color: #999999;
}

.sidebar-nav>.sidebar-brand a:hover {
  color: #fff;
  background: none;
}

@media(min-width:768px) {
  #wrapper {
    padding-left: 0;
  }
  #wrapper.toggled {
    padding-left: 250px;
  }
  #sidebar-wrapper {
    width: 0;
  }
  #wrapper.toggled #sidebar-wrapper {
    width: 250px;
  }
  #page-content-wrapper {
    padding: 20px;
    position: relative;
  }
  #wrapper.toggled #page-content-wrapper {
    position: relative;
    margin-right: 0;
  }
}
	
	
	
	/* ---------------------------------------------------
		START
	----------------------------------------------------- */	

	
	.bgcolor{background:rgba(0,200,240,1);}
	.wcolor{color:rgba(0,200,240,1);}
	.wcolor1{color:#999999;}
	
	.btn-bd-primary {
		font-weight: 500;
		color: rgba(0,200,240,1);
		border-color: rgba(0,200,240,1);
	}
	
	
	.btn-primary {
		color: #fff;
		background-color: rgba(0,200,240,1);
		border-color: rgba(0,200,240,1);
	}
	
	.btn-primary:hover {
		color: #fff;
		background-color: #0069d9;
		border-color: rgba(0,200,240,1);
	}
	
	
	.btn-outline-primary {
		color: rgba(0,200,240,1);
		border-color:  rgba(0,200,240,1);
	}
	
	
	.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
		color: #fff;
		background-color: rgba(0,200,240,1);
	}
	

	/* model*/
		
	.modal {
		width: 100%;
		height: 100vh;
		background:rgba(0,200,240,.9);
		margin: 0;
		padding: 0;
	}
	
	.modal-box{
		display: block;
		padding:12px;
		background-color: #fff;
		border-radius: 8px;
		font-size: 15px;
		line-height: 1.5;
		letter-spacing: .06em;
		text-align: center;
		margin: auto;
		width:100%;
		max-width:360px;
		height:600px;
		box-shadow: 0px 0px 5px #aaaaaa;
		}
	

	/* abutton */
	.abutton {
	  display: inline-block;
	  margin-top:10px;
	  position: relative;
	  padding: 10px;
	  top: 0;
	  font-size: 24px;
	  text-align:center;
	  border-radius: 8px;
	  border-bottom: 1px solid rgba( 0, 200,240, 0.5 );
	  /* background: rgba(  0,200, 240, 1 ); */
	  border:2px solid rgba(  0,200, 240, 1 );
	  color: rgba(  0,200, 240, .8 );
	  /*box-shadow: 0px 0px 0px rgba( 0, 0, 0, .1 );*/
	  
	  -webkit-transform: translateZ(0);
		 -moz-transform: translateZ(0);
		  -ms-transform: translateZ(0);
			  transform: translateZ(0);
	  
	  -webkit-transition: all 0.2s ease;
		 -moz-transition: all 0.2s ease;
		  -ms-transition: all 0.2s ease;
			  transition: all 0.2s ease;
	}
	
	.abutton:hover {
	  /*top: -3px;*/
	  color: rgba(  0,200, 240, 1 );
	  background-color: rgba(  0, 200, 240, .1 );
	  /*box-shadow: 0px 10px 10px rgba( 0, 0, 0, 0.2 );*/
	  
	  /*-webkit-transform: rotateX(20deg);
		 -moz-transform: rotateX(20deg);
		  -ms-transform: rotateX(20deg);
			  transform: rotateX(20deg);*/
	}
	
	.abutton:visited{color: rgba(255,255, 255,.7);}
	
	.nav-pills .nav-link {
		border-radius: 8px;
	}

	
	.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
		color: #fff;
		border:#084887;
		background-color: rgba(  0, 200, 240, 1 );
	}
	
	.nav-pills .nav-linkx {
		border-radius: 8px;
		padding:10px;
		margin-bottom:10px;
		text-align:center;
		border:#b4c7e7 solid 2px;
		color:#333333;
	}

	
	.nav-pills .nav-linkx.active, .nav-pills .show>.nav-link x{
		color: #fff;
		border:#b4c7e7;
		background-color: #b4c7e7;
	}
	

	.nav-pills .nav-link1 {
		border-radius: 8px;
	}

	
	.nav-pills .nav-link1.active, .nav-pills .show>.nav-link1 {
		color: #fff;
		border:#084887;
		background:#084887;
		/*background-color: rgba(  0, 200, 240, 1 );*/
	}
	
	
	
	
	.nav-link1.active::after{
            content: '';
            display: block;
            position: absolute;
            bottom: -15px;
			left:30px;
            border-left: 20px solid transparent ;
            border-right: 20px solid transparent;
            border-top: 20px solid #084887;
	}


	.abutton2 {
	  background: #db504a;
	  border: #db504a;
	  color: rgba(  255,255,255, .5 );

	}
	
	.abutton2:hover {
	  padding:8px;
	  color: #db504a;
	  border:2px solid #db504a;
	  background: #ffffff;
	}
	
	.nav-pills .nav-link2.active, .nav-pills .show>.nav-link2 {
		padding:10px;
		color: #fff;
		font-weight:500;
		border:#db504a;
		background:#db504a;
	}
		
	.nav-link2.active::after{
            content: '';
            display: block;
            position: absolute;
            bottom: -15px;
			left:30px;
            border-left: 20px solid transparent ;
            border-right: 20px solid transparent;
            border-top: 20px solid #db504a;
	}
	
	.abutton3 {
	  background: #ffa530;
	  border: #ffa530;
	  color: rgba(  255,255,255, .5 );

	}
	
	.abutton3:hover {
	  padding:8px;
	  color: #ffa530;
	  border:2px solid #ffa530;
	  background: #ffffff;
	}
	
	.nav-pills .nav-link3.active, .nav-pills .show>.nav-link3 {
		padding:10px;
		color: #fff;
		font-weight:500;
		border:#ffa530;
		background:#ffa530;
	}
	
	.nav-link3.active::after{
            content: '';
            display: block;
            position: absolute;
            bottom: -15px;
			left:30px;
            border-left: 20px solid transparent ;
            border-right: 20px solid transparent;
            border-top: 20px solid #ffa530;
	}
	
	.abutton4 {
	  background: #24b2a4;
	  border: #24b2a4;
	  color: rgba(  255,255,255, .5 );

	}
	
	.abutton4:hover {
	  padding:8px;
	  color: #24b2a4;
	  border:2px solid #24b2a4;
	  background: #ffffff;
	}
	
	.nav-pills .nav-link4.active, .nav-pills .show>.nav-link4 {
		padding:10px;
		color: #fff;
		font-weight:500;
		border:#24b2a4;
		background:#24b2a4;
	}
	
	.nav-link4.active::after{
            content: '';
            display: block;
            position: absolute;
            bottom: -15px;
			left:30px;
            border-left: 20px solid transparent ;
            border-right: 20px solid transparent;
            border-top: 20px solid #24b2a4;
	}
	
	.abutton5 {
	  background: #735999;
	  border: #735999;
	  color: rgba(  255,255,255, .5 );

	}
	
	.abutton5:hover {
	  padding:8px;
	  color: #735999;
	  border:2px solid #735999;
	  background: #ffffff;
	}
	
	.nav-pills .nav-link5.active, .nav-pills .show>.nav-link5 {
		padding:10px;
		color: #fff;
		font-weight:500;
		border:#735999;
		background:#735999;
	}
	
	.nav-link5.active::after{
            content: '';
            display: block;
            position: absolute;
            bottom: -15px;
			left:30px;
            border-left: 20px solid transparent ;
            border-right: 20px solid transparent;
            border-top: 20px solid #735999;
	}
	
	
	
	/* 20190510 */
	.abutton-img1 {
	  background: url(../img/btn/vbtn-hot-0.png);
	  background-size:cover;
	}
	
	.abutton-img1:hover {
	  background: url(../img/btn/vbtn-hot-2.png);
	  background-size:cover;
	}
	
	.nav-pills .abutton-img1.active, .nav-pills .show>.abutton-img1 {
	  background: url(../img/btn/vbtn-hot-1.png);
	  background-size:cover;
	}
	
	.abutton-img2 {
	  background: url(../img/btn/vbtn-newest-0.png);
	  background-size:cover;
	}
	
	.abutton-img2:hover {
	  background: url(../img/btn/vbtn-newest-2.png);
	  background-size:cover;
	}
	
	.nav-pills .abutton-img2.active, .nav-pills .show>.abutton-img2 {
	  background: url(../img/btn/vbtn-newest-1.png);
	  background-size:cover;
	}

	
	.abutton-img3 {
	  background: url(../img/btn/vbtn-class-0.png);
	  background-size:cover;
	}
	
	.abutton-img3:hover {
	  background: url(../img/btn/vbtn-class-2.png);
	  background-size:cover;
	}
	
	.nav-pills .abutton-img3.active, .nav-pills .show>.abutton-img3 {
	  background: url(../img/btn/vbtn-class-1.png);
	  background-size:cover;
	}
	
	.abutton-img4 {
	  background: url(../img/btn/vbtn-course-0.png);
	  background-size:cover;
	}
	
	.abutton-img4:hover {
	  background: url(../img/btn/vbtn-course-2.png);
	  background-size:cover;
	}
	
	.nav-pills .abutton-img4.active, .nav-pills .show>.abutton-img4 {
	  background: url(../img/btn/vbtn-course-1.png);
	  background-size:cover;
	}
	
	
	


    
	/*
		DEMO STYLE
	*/

	body {
		background: #ffffff;
		color:#666;
	}
	
	p {
		font-size: 16px;
		font-weight: 300;
		line-height: 18em;
		color: #999;
	}
	
	a,
	a:hover,
	a:focus {
		color: inherit;
		text-decoration: none;
		transition: all 0.3s;
	}
	
	.navbar {
		padding: 8px 10px;
		background: #fff;
		border: none;
		border-radius: 0;
		margin-bottom: 40px;
		box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
	}
	
	#navsm a{color:#ffffff;}
	#navsm a:hover{color:rgba(  0,200, 240, 1 );}
	#navsm ul li.active>a, a[aria-expanded="true"] {
    color: #004a69;
    background: rgba(255,255,255,.7);
    }
	
	.navbar-btn {
		box-shadow: none;
		outline: none !important;
		border: none;
	}
	
	.line {
		width: 100%;
		height: 1px;
		border-bottom: 1px dashed #ddd;
		margin: 40px 0;
	}
	
	/* ---------------------------------------------------
		SIDEBAR STYLE
	----------------------------------------------------- */
	.nbody {
		background: url(../img/login_bg.jpg) no-repeat #ffffff 0 0; 
		background-size: cover;
	}

	
	.wrapper {
		display: flex;
		margin-top:50px;
		width: 100%;
		align-items: stretch;
		flex-wrap: nowrap!important;
	}
	
	.wrapper-mov {
		display: flex;
		margin-top:0px; /*  靠上 */
		background:#111; /*  bgc */
		width: 100%;
		align-items: stretch;
		flex-wrap: nowrap!important;
	}
	

	
	.sidebara {
		min-width: 200px;
		max-width: 200px;
		background-image: linear-gradient(to bottom, #c9923c, #ca8f33, #cc8c2a, #cd8920, #cf8613);
		color: #fff;
		transition: all 0.3s;
	}
	
	.sidebara.c1{background-image: linear-gradient(to bottom, #606060, #555455, #4b4949, #413d3c, #363330) !important;}
	.sidebara.c2{background-image: linear-gradient(to right bottom, #80a8a8, #7b969e, #78858e, #71747a, #666666) !important;}
	
	.sidebara.active {
		margin-left: -200px;
	}
	
	.sidebara .sidebar-header {
		padding: 20px;
		background: #7bd8ee;
	}
	
	.sidebara ul.components {
		padding: 20px 0;
	}
	
	.sidebara ul p {
		color: #fff;
		padding: 10px;
	}
	
	.sidebara ul li a {
		padding: 5px 10px; 
		font-weight:400;
		font-size: 1.3em;/*20190510*/
		display: block;
	}
	
	.sidebara ul li a:hover {
		color: #000 ;
		background: rgba(255,255,255,.8);;
	}
	
	.sidebara ul li.active>a,
	a[aria-expanded="true"] {
		color: #463315;
		background: rgba(255,255,255,.7);
	}
	
	a[data-toggle="collapse"] {
		position: relative;
	}
	
	.dropdown-toggle::after {
		display: block;
		position: absolute;
		top: 50%;
		right: 20px;
		transform: translateY(-50%);
	}
	
	ul ul a {
		font-size: 1em !important;
		padding-left: 30px !important;
		border-top:1px solid rgba(255,255,255,.6);
		color:#333;
		background: #7bd8ee;
	}
	
	
	
	ul.CTAs {
		padding: 20px;
	}
	
	ul.CTAs a {
		text-align: center;
		font-size: 0.9em !important;
		display: block;
		border-radius: 5px;
		margin-bottom: 5px;
	}
	
	a.download {
		background: #fff;
		color: rgba(0,200,240,1) ;
	}
	
	a.article,
	a.article:hover {
		background: #7bd8ee !important;
		color: #fff !important;
	}
	
	
	/* ---------------------------------------------------
		CONTENT STYLE
	----------------------------------------------------- */
	
	.content {
		width: 100%;
		background:#ffffff;	
		/*background-image: linear-gradient(to right bottom, #f8fdfd, #f2f8f6, #edf3ee, #ebede6, #e9e7df);	
		 background: url(../img/bg-title-3.jpg) no-repeat !important; 
		background-size:cover !important; */
		padding: 20px;
		min-height: 100vh;
		transition: all 0.3s;
		margin-bottom:0px;
	}
	
	/*20190513*/
	.pl-15{ padding-left:15px !important;}
	.pr-15{ padding-right:15px !important;}
	.pt-15{ padding-top:15px !important;}
	.pb-15{ padding-bottom:15px !important;}
	.p-15{ padding:15px !important;}
	
	
	
	/* ---------------------------------------------------
		MEDIAQUERIES
	----------------------------------------------------- */
	
	@media (max-width: 768px) {
		.sidebara {
			margin-left: -200px;
		}
		.sidebara.active {
			margin-left: 0;
		}
		.sidebaraCollapse span {
			display: none;
		}
	}
	
	/* ---------------------------------------------------
		popmenu
	----------------------------------------------------- */
	
	.popmenu{background:rgba(0,200,240,1); display:block; margin-top:50px;}
	.popmenu ul.components {padding: 20px 0;}
	.popmenu ul p {color: #fff; padding: 10px;}
	.popmenu ul li a {padding: 5px 10px; font-size: 1.1em; display: block;}
	.popmenu ul li a:hover {color: rgba(0,200,240,1) ;background: #fff;}
	.popmenu ul li.active>a,a[aria-expanded="true"] {color: #004a69;background: rgba(255,255,255,.7);}
	
	/* ---------------------------------------------------
		popmenu-live
	----------------------------------------------------- */
	
	.popmenu-live{background:#63090c; display:block; margin-top:50px;}
	.popmenu-live ul.components {padding: 20px 0;}
	.popmenu-live ul p {padding: 10px;}
	.popmenu-live ul li a {color: #ffffff; padding: 5px 10px; font-size: 1.1em; display: block;}
	.popmenu-live ul li a:hover {color: #111111 !important; background: #ffffff;}
	.popmenu-live ul li.active>a,a[aria-expanded="true"] {color: #111111; background: rgba(255,255,255,.7);}
	
	/* ---------------------------------------------------
		bg-meeting
	----------------------------------------------------- */

/* mark for old version
	.livemeeting{ display:block; background: url(../img/bg-meeting.jpg) no-repeat #492200; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting:hover{ background-size:150%;}
	.livemeeting1{ display:block; background: url(../img/bg-meeting1.jpg) no-repeat #b20000; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting1:hover{ background-size:150%;}
	.livemeeting2{ display:block; background: url(../img/bg-meeting2.jpg) no-repeat #b20000; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting2:hover{ background-size:150%;}
	.livemeeting3{ display:block; background: url(../img/bg-meeting3.jpg) no-repeat #b20000; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting3:hover{ background-size:150%;}
	
	.ninfo{display;block; max-height:28px; overflow:hidden; }
*/

	.live-ytch{ display:block; background: url(../img/bg-yt-ch.jpg) no-repeat #492200; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.live-ytch:hover{ background-size:150%; margin-top:-1px;}
	.livemeeting{ display:block; background: url(../img/bg-meeting.jpg) no-repeat #492200; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting:hover{ background-size:150%; margin-top:-1px;}
	.livemeeting1{ display:block; background: url(../img/bg-meeting1.jpg) no-repeat #b20000; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting1:hover{ background-size:150%; margin-top:-1px;}
	.livemeeting2{ display:block; background: url(../img/bg-meeting2.jpg) no-repeat #b20000; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting2:hover{ background-size:150%; margin-top:-1px;}
	.livemeeting3{ display:block; background: url(../img/bg-meeting3.jpg) no-repeat #b20000; background-size: cover; background-position: 50% 50%; border-radius:5px!important; color:#ffffff; padding:20px;}
	.livemeeting3:hover{ background-size:150%; margin-top:-1px;}

  	.ninfo{display;block; max-height:28px; overflow:hidden; }
	
	.borderxx{ border:solid 2px #eeeeee;}
	.borderxx:hover{ border:solid 2px rgba(247,5,5,.3);}  


	/* ---------------------------------------------------
		classbox
	----------------------------------------------------- */
	.vround{ border-radius: 50% !important;}
	.vround-5{border-radius: 5px !important;}
	.vround-10{border-radius: 10px !important;}
	.vround-15{border-radius: 15px !important;}
	.vround-20{border-radius: 20px !important;}
	.clearfix{ clear:both !important;}
	.classbox{display:block; width:100%; margin-bottom:2px; margin-top:2px; border:2px solid #dddddd; background:#ffffff; box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important; }
	.classbox:hover{ border:rgba(0,200,240,1) solid 2px;}
	
	.classbox2:hover{ border:#db504a solid 2px;}
	.classbox3:hover{ border:#ffa530 solid 2px;}

	
	.classbox4:hover{ border:#735999 solid 2px;cursor:pointer;}/*20190513*/

    .classbox4:hover .aoverlay100{
		height:60px;
		line-height:60px;
	    background:rgba(0,0,0,.95); 
		
	  -webkit-transform: translateZ(1px);
		 -moz-transform: translateZ(1px);
		  -ms-transform: translateZ(1px);
			  transform: translateZ(1px);
		
	}/*20190513*/
	
	.classbox5:hover{ border:#735999 solid 2px;cursor:pointer;}/*20190513*/

    .classbox5:hover .aoverlay100{
		height:60px;
		line-height:60px;
	    background:rgba(0,0,0,.95); 
		
	  -webkit-transform: translateZ(1px);
		 -moz-transform: translateZ(1px);
		  -ms-transform: translateZ(1px);
			  transform: translateZ(1px);
		
	}/*20190513*/
	

	.classbox-title{padding:5px; height:52px; overflow:hidden; clear:both;}
	.classbox-man{padding:0px 5px; height:20px; overflow:hidden; clear:both; margin-top:0;}
	.classbox-coin{padding:0px 5px; height:20px; overflow:hidden; clear:both; margin-top:0;}
	.classbox-coin img{height:18px; width:auto !important;}
	.coinbigger{height:24px; width:auto !important;}
	.coinmax{height:32px; width:auto !important;}
	.classbox-coin del{ color:rgba(0,0,0,.5);}
	.classbox-star{padding:0px 5px; height:20px; overflow:hidden; clear:both; margin-top:0;}
	.livetime-box{ display:block; padding:5px 5px; font-size:13px; margin-top:0; color:#222222;}
	
	.classbox .fsize12{ font-size:22px !important; line-height:22px !important;}/*20190510*/
	.classbox .fsize10{ font-size:18px !important; line-height:19px !important;}
	.classbox .fsize8{ font-size:16px !important; line-height:17px !important;}
	
	.classbox-sb1{padding:5px 5px 2px 5px ; height:54px; overflow:hidden; clear:both; color:rgba(0,0,0,1);}/*20190510*/
	.classbox-sb2{padding:2px 5px; height:16px; clear:both; color:rgba(0,0,0,.7);}
	.classbox-sb2-mb15{margin-bottom:15px !important;}/*20190513*/
	.classbox-sb3{padding:2px 5px; height:16px; text-align:right; font-weight:500; clear:both;}
	.classbox-sb3 img{ width:18px !important; height:auto !important; margin-top:-2px;}
	.classbox-sb3 div{ width:18px !important; height:auto !important; margin-top:-2px;}
	.classbox-sb3 del{ font-size:12px; color:rgba(147,147,147,1);}
	
	.classbox-sb3a{padding:2px 5px; height:16px; font-weight:500; clear:both;}
	.classbox-sb3a img{ width:18px !important; height:auto !important; margin-top:-2px;}
	.classbox-sb3a del{ font-size:12px; color:rgba(147,147,147,1);}
	
	.classbox-sb4{padding:2px 5px; height:16px; text-align:right; clear:both; color:rgba(0,0,0,.7);}
	
	
	/* aimg */ 	
	.aimg{ position: relative;}
	.aimg img{display: block; width:100%; height:auto !important;}
	.aoverlay{
	  position: absolute;
	  bottom: 0px;
	  right: 0px;
	  color:#ffffff;
	  background:red;
	  padding:3px 5px;
	  font-size:16px;
	  display:block;
	}
	
	.aoverlay100{
	  position: absolute;
	  bottom: 0;
	  width:100%;
	  height:36px;
	  color:#ffffff;
	  background:rgba(0,0,0,.8);
	  padding:0px 5px;
	  font-size:20px;
	  font-weight:bold;
	  text-align:center;
	  line-height:36px;
	  
	  display:block;
	}
	
    .aoverlay100:hover{
		height:60px;
		line-height:60px;
		cursor:pointer;
		background:rgba(0,0,0,.95);
		
	  -webkit-transform: translateZ(1px);
		 -moz-transform: translateZ(1px);
		  -ms-transform: translateZ(1px);
			  transform: translateZ(1px);
		
	}
	
	/* heartbtn 20190513*/
	
	.castbox-word{color:#183d7a;}
	.castbox{background-color:#FFF; color:#ffffff; padding:5px; margin-bottom:10px;}
	.castbox.actived{background-color:rgba(0,200,240,1);}
	.castbox:hover{background-color:rgba(0,200,240,1);}
	.castbox-r{width:60%; background:#d9e3e3; color:#183d7a; padding:8px; position:relative}
	.castbox-l{width:40%;}
	
	.castbox-heart{position:absolute; bottom:5px; right:5px;} 
	
	.heartbtn {
		-webkit-transition: all 2s ease;
		-moz-transition: all 2s ease;
		-o-transition: all 2s ease;
		transition: all 2s ease;
	}
	
	.heartbtn:before {
		content: "";
		display: block;
		background: url(../img/heart-24x24-0.png) no-repeat;
		width: 20px;
		height: 20px;
		float: left;
		margin: 0 3px 0 0;
	}
	
	
	.heartbtn.clicked {
		color:#d6437a;
	}
	
	.heartbtn.clicked:before {
		content: "";
		display: block;
		background: url(../img/heart-24x24-1.png) no-repeat;
		width: 20px;
		height: 20px;
		float: left;
		margin: 0 3px 0 0;
	}
	
	/* deletbtn */ 
	.deletbtn{
		-webkit-transition: all 2s ease;
		-moz-transition: all 2s ease;
		-o-transition: all 2s ease;
		transition: all 2s ease;
	}
	
	.deletbtn:before {
		content: "";
		display: block;
		background: url("../img/app-icon-delet-2.png") no-repeat ;
		width: 20px;
		height: 20px;
		float: left;
		margin: 0 3px 0 0;
	}
	
	
		
	
	.square{
	  display: block;
	   width:25px;
	   height:25px;
	}
	
	.square:before{content: url('../img/heart-24x24-1.png');}
	
	.square:before.clicked{content: url('../img/heart-24x24-0.png');}
	
	
/*	   <svg xmlns='http://www.w3.org/2000/svg' version='1.1'><circle cx='50' cy='50' r='40' stroke='black' stroke-width='3' fill='red' /></svg>*/
	   	
	
	/* starbtn */ 	
	.starbtn {
		font-size:16px;
		color:#999999;
		-webkit-transition: all 2s ease;
		-moz-transition: all 2s ease;
		-o-transition: all 2s ease;
		transition: all 2s ease;
	}
	
	.starbtn.clicked {
		color:#e99b21;
	}
	
	.starbtn1 {
		font-size:20px;
		color:#999999;
		-webkit-transition: all 2s ease;
		-moz-transition: all 2s ease;
		-o-transition: all 2s ease;
		transition: all 2s ease;
	}
	
	.starbtn1.clicked {
		color:#F09;
	}
	 
	/* tbox */ 		 
	 .tbox td{ text-align:left;}
	 .tbox.listno{ text-align:center; display:block; width:30px;}
	 
	/* tab content hover */ 	 
	 .infoboxtab{ display:block;}
	 .infoboxtab:hover{ background:#eeeeee;}
	 
	 
	 
	 /*login form*/
	 
/*	.cline {width: 100%;margin: 10px 0;padding: 0;ext-align: center;}
	.cline:after {
								display: inline-block;
								margin: 0 0 8px 20px;
								height: 1px;
								content: " ";
								text-shadow: none;
								background-color: #999;
								width: 40%;
					}
	.cline:before {
								display: inline-block;
								margin: 0 20px 8px 0;
								height:  1px;
								content: " ";
								text-shadow: none;
								background-color: #999;
								width: 40%;
					}*/
					
					
					
	.cline{ width:100%; text-align:center; border-bottom: 1px solid #eeeeee; line-height:0.1em; margin:20px 0 20px; } 
	.cline span { background:#fff; padding:0 10px; }
	
	
	
	
	/* ---------------------------------------------------
		aboutus
	----------------------------------------------------- */
	
	.v-ababtn-rea{ position:relative;}
	.v-bgcolor1{ background:#8399a5;}	
	.v-bgcolor2{ background:#aabfbf}
	.v-btn-ab-fb{ background: url(../img/title-aboutus-fb-btn.png); background-size: cover;}	
	.v-btn-ab-fb:hover{ background: url(../img/title-aboutus-fb-btn1.png); cursor:pointer;background-size: cover;}
	.v-btn-ab-teacher{ background: url(../img/title-aboutus-teacher-btn.png); background-size: cover;}	
	.v-btn-ab-teacher:hover{ background: url(../img/title-aboutus-teacher-btn1.png); cursor:pointer;background-size: cover;}	
	
	.v-title-bline30{ background:url(../img/bg-line-h30.png) repeat-x; font-size:16px; line-height:30px;}
	.v-title-bline30 span{background:#eeeeee; padding:0 15px;}	
	
	
	
	
	/* ---------------------------------------------------
		npall
	----------------------------------------------------- */	
	
	.tmenu a{}
	.tmenu a:hover{ color:#6d0019 !important;}
	
	
	.ntext24{ font-size:24px !important; line-height:26px !important;}
	.ntext20{ font-size:20px !important; line-height:24px !important;}
	.ntext18{ font-size:18px !important; line-height:20px !important;}
	.ntext16{ font-size:16px !important; line-height:18px !important;}
	.ntext15{ font-size:15px !important; line-height:15px !important;}
	.ntext14{ font-size:14px !important; line-height:14px !important;}
	.ntext13{ font-size:13px !important; line-height:15px !important;}
	.ntext12{ font-size:12px !important; line-height:12px !important;}
	
	.texthid{ width:100%; overflow:hidden;}
	.texthid:after{content: '…';}
	
	
	.ntextc-black{ color:#000000 !important;}
	
	
	.carousel-twrap{position:relative;}
	.carousel-tc{font-size:12px; line-height:12px; display:block; float:right; padding:3px; color:#eeeeee; background:#000000; z-index:99; position:absolute; bottom:5px; right:5px;}
	.carousel-tc1{font-size:12px; line-height:12px; display:block; float:right; padding:3px; color:#eeeeee; background:#000000; z-index:99; position:absolute; bottom:5px; right:20px;}
	.carousel-tc2{font-size:12px; line-height:12px; display:block; float:right; padding:3px; color:#eeeeee; background:#000000; z-index:99; position:absolute; top:5px !important; right:5px;}
	
	.modal{ background:rgba(46, 140, 212, 0.3); !important;}
	.sellayout{ border:3px solid #eeeeee;}
	.sellayout:hover{ border:3px solid red; cursor:pointer;}
	.sellayout.active{ border:3px solid red;}
	
	.btn-primary { color: #fff !important; background-color: rgba(162,42,45,1); border-color: rgba(162,42,45,1) !important;}
	.btn-primary:visited { color: #fff !important; background-color: rgba(162,42,45,1); border-color: rgba(162,42,45,1) !important;}
    .btn-primary:hover { color: rgba(162,42,45,1) ; background-color: #fff; border-color: rgba(162,42,45,1) !important;}
    .btn-primary:active { color: #fff !important; background-color: rgba(162,42,45,1); border-color: rgba(162,42,45,1) !important;}
	
	.nbg-red{ background:#9c2b2c; color:#fff !important;}
	.bg-white{ background:#ffffff !important;}
	.bg-black{ background:#000000 !important;}
	
	.text-power5{ color:#33A821;}
	.text-power4{

background: #33a821; /* Old browsers */
background: -moz-linear-gradient(left,  #33a821 88%, #c0c4c0 90%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #33a821 88%,#c0c4c0 90%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #33a821 88%,#c0c4c0 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33a821', endColorstr='#c0c4c0',GradientType=1 ); /* IE6-9 */

	}
	.text-power{ color:#33A821;}
	.text-power0{ color:#C0C4C0;}	
	
	.hppic{width:30px !important; height:auto !important;}