.mobile_only{
  display:none  !important;
}
.desktop_only{
  Xdisplay:none  !impo
}


#ui-datepicker-div{
  z-index:10;
}

a img{
  border:0px;
}

#wrapper{
	width:100%;
	/*border:1px solid yellow;*/
}

table{
 	font-family:Lucida Grande,Verdana,Geneva,Sans-serif;
	font-size:12px;
}

.space{
  height:10px;
}

.td_space{
  width:20px;
}

.right{
  float:right;  
}

.done{
  background: url('../imgs/checkbox_checked.gif') right no-repeat;
  padding-right:20px !important;
  /*width: 20px;
  height: 20px;*/
}

.company_title{
  font-weight: bold;
	font-size: 20px;
	font-family: Arial;
	color: Orange;
}

.box_title{	
	font-weight: bold;
	font-size: 14px;
	color: black;
	background:#ffcc66;
}


.gray {
	color:#999999;
	font-weight:normal;
}
	
.underline {
	text-decoration:underline;
}

a {
	color:#0134C5;
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}
table {
  border-collapse: collapse;
} 
td.important{
	color:#6688ff;
	font-weight:bold;
}
td.veryimportant{
	color:red;
}
td.note{
	color:#777;
	font-style:italic;
}

#footer {
	margin:0 auto;
	width:950px;
	height:56px;
	margin:0 auto;
	padding-top:15px;
	padding-bottom:10px;
	color:#555555;
	font-size:14px;
	/*background:url('/blog/imgs/tutor-bottom-blog.jpg') no-repeat;*/
	Xbackground:url('/blog/imgs/footer_bg.jpg') no-repeat;
}

#footer3{
  width:100%;
  background:#33475b;  
  font-family: 'Microsoft JhengHei', Helvetica, Arial, sans-serif;
  Xfont-size:100%;
  padding:20px;
  padding-top:50px; 
  box-sizing:border-box;
  
}
#footer3, #footer3 a{
  color:#BCBCBC;
}
#footer3 .logo img{
  width:150px;
  border:20px solid white;
  border-radius: 20px;
}                
#footer3 .logo a{ font-size: 26px; color: white; font-weight: bold; }
#footer3 .footer_slogan{
      font-weight: bold !important;
      font-size:large;
}
#footer3 .email{
  color:#777;
  Xfont-size:90%;
}

.footer_links{ width:60%; margin-left:28%; padding: 20px 0 30px 0; overflow:hidden;}
.footer_links .col{ width:33%; box-sizing:border-box; float: left; }
.footer_links .title, .footer_links a{ display:block; margin-top:10px; font-size:14px; text-align: left; width:33%; box-sizing:border-box;}
.footer_links .title{ color:white; font-weight:bold; }
.footer_links a{  }

.copyright{ margin-top:20px; }
	
.staff_note{
	width: 25px;
}

.bold{
	font-weight: bold;	
}
.error{
	color: red;
}
.note{
	clear:both;
	color: blue;
	padding:0 0 10 0;
}
.fieldnote{
  color:green;
}
.wrap{
  white-space:normal !important;
}
.hidden{
  display:none;
}


/******* header ********/
#header {
  clear:both;
	margin:0 auto;
	padding:0;
	width:950px;
	height:130px;
	/*background: url('/blog/imgs/tutor-top-blog.jpg') no-repeat;*/
	background: url('/blog/imgs/blog_logo.jpg') no-repeat 0px 20px;
	border-bottom:1px solid #ddd;
}
#header a.logo{
  float:left;
  padding-left:10px;
}
#header .site_title{
  float:left;
  padding-top:50px;
  padding-left:20px;
  font-size:30px;
  font-weight:bold;  
}
#header H1{
	margin:0 auto;
	border:0;
	padding:0;
}
#tabs .tab ,
#tabs .tab_work_app,
#tabs .tab_template{  
    margin: 4 2 0 0;
    width: 90px;
    height:30;
    float:left; 
    background-color:#f8ecb9;
    font-size:13px;
    padding:0;
}
#tabs .tab a,
#tabs .tab_work_app a,
#tabs .tab_template a{  
    font-weight:normal;    
    color: #ff9900
}
#tabs .tab_work_app,
#tabs .tab_template {
	width:145px;
}

#tabs .tab.over,
#tabs .tab_work_app.over,
#tabs .tab_template.over  {   
    background-color:#ffcc66;   
}
#tabs .tab.over a,
#tabs .tab_work_app.over a,
#tabs .tab_template.over a {   
    color: #ff6600   
}
#tabs .tab.current,
#tabs .tab_work_app.current,
#tabs .tab_template.current {	 
    background-color:orange;
}
#tabs .tab.current a,
#tabs .tab_work_app.current a,
#tabs .tab_template.current a{ 
    color: white;
    font-size:15px;
    font-weight:bold;
}
#tabs .tab .tab_text,
#tabs .tab_work_app .tab_text,
#tabs .tab_template .tab_text {	
	font-weight:bold;
	font-size: 12px;	
	padding: 8 0 0 0;
	margin:0;
	width: 100%;
	height:100%;		
	left:0; top:0;
	text-align: center;
}



/***** TITLE *****/
span.h3_title{
	float:left;
	padding:0 5 0 0;
	margin:0;	
}

h3.admin{
	background-color: #DDEEDD;
}
h4 {
	font-family: Lucida Grande,Verdana,Geneva,Sans-serif;
	font-size: 13px;
	font-weight: bold;
	color:black;
	text-align:center;
	/*width:200;*/
	/*padding:5 5 5 10;*/
	/*background-color:#eeeebb;*/
	/*margin:0 0 10 0;*/
	padding:0 0 0 10;
	margin:0 0 0 0;		
}
h5 {
	font-family: Lucida Grande,Verdana,Geneva,Sans-serif;
	font-size: 12px;
	font-weight: normal;
	padding:0 0 0 10;
	text-align:center;
	margin:0 0 10 0;	
	color: #888855;
	white-space:nowrap;
}
h5 a{
	color: #888855;
	text-decoration: underline;
}
h5 a:hover{
	color: #555533;
}
h5.over{
	color: orange;
	font-size: 13px;
	font-weight: bold;	
	white-space:nowrap;
	padding-bottom:10px;	
}
h5.over a{
  text-decoration:none;
  color: orange;
}

/***** CONTENT *****/
#content .box{
  /*width:100%;*/
}
#content .box td, #content .box_no_border td {
	border-bottom:1px solid #E8E8E8;
	padding:5px; 
	text-align: left;
	white-space:nowrap;
}
#content .box_common td {
	padding:5px; 
	text-align: left;
	white-space:nowrap;
}
#content .box td.right, #content .box_no_border td.right, #content .box_create td.right,
#content .box th.right, #content .box_no_border th.right, #content .box_create th.right,
.box_common th {   
    text-align: right;
}
#content .box td.center, #content .box_no_border td.center, #content .box_create td.center,
#content .box th.center, #content .box_no_border th.center, #content .box_create th.center {   
    text-align: center;
}
#content .box_workshop_app td {
	border-bottom:1px solid #E8E8E8;
	padding:5px;  
}
#content .box_create td {
	text-align: left;
	border-bottom:1px solid #E8E8E8;
	padding:5px; 
	white-space:nowrap;
	vertical-align:top;
}
#content .box th label, #content .box_create th label, #content .box_workshop_app th label, #content .box_no_border th label{
	float:right;
	text-align: left;
	white-space:nowrap;
}
#content .box th, #content .box_workshop_app th, #content .box_no_border th{
	background: #bbbbff;
	text-align:left;
	padding:5px;
	white-space:nowrap;
}
#content .box_create th{
	/*font-weight:normal;*/
	border-bottom:1px solid #E8E8E8;
	vertical-align: top;
	padding-top: 5px;
	padding-left: 5px;
	width: 60px;
	/*color: #aaa;*/
}
#content .box_create .colored_area{
	background-color:#eee;
}
#content .box_create .box_header{	
	padding: 7px;
	background-color: #ccc;
	width:auto;
}
#content .box_create .sign{	
	color: blue;
	font-weight:bold;
	font-size:20px;
}

.box, .box_workshop_app, .box_create {
	background-color:#F9F9F9;
	border:1px solid #D0D0D0;
	font-size:12px;
	clear:both;
}
.box_no_border{
	background-color:#F9F9F9;
	font-size:12px;
	clear:both;
}
.box_text_gray{
	font-size: 10px;
	color: gray;
}
.box_right{
	background-color:#F9F9F9;
	border:1px solid #D0D0D0;
	font-size:12px;
	float:right;
}
#content .box .td_linebreak{
	white-space: normal;
}

#content .box_create .td_linebreak{
	white-space: normal;
}

#box_info{
	padding-top:30px;
	font-weight:bold;
	color:#7777dd; 
	width:800px;
	margin-top:30px;
}
#box_wide{
	width:800px;	
}

#csv{
	float:right;	
	margin-bottom: 5px;
}
.staff_name{
	color:#0000aa
}
#show_public{
	font-size:16px;
}
.show_public_3b{
	font:italic 12px gray;
	padding-top:20px;
}	
.show_app_no{
	color:blue;
	font-weight:bold;	
}
/***** PROGRESSBAR *****/
#progressbar{
	width:400px; 
	height:20px;	
}
.progressbar_text{
	font-size:12px;	
}

/***** FILTERS *****/
.filter_drop_label{
	padding-top:3px; 
	width:100%;
}
.filter_fields{
	padding-top:3px;	
}
/***** ICONS *****/
.list{
	background: url('../../imgs/list.jpg');
	padding: 5px 7px;
	text-decoration: none;
	margin-right: 5px;
}
*html .list{ 
  	background: url('../../imgs/list.jpg');
	padding: 3px 7px;
	text-decoration: none;
	margin-right: 5px;
}

.create{
	background: url('../../imgs/create.jpg') no-repeat;
	padding: 4px 10px 4px 25px;
	text-decoration: none;
	margin-right: 5px;
}
*html .create{
	background: url('../../imgs/create.jpg')  no-repeat;
	padding: 4px 10px 4px 25px;
	text-decoration: none;
	margin-right: 5px;
}
.export{
	background: url('../../imgs/export.jpg') no-repeat;
	padding: 1px 6px;
	text-decoration: none;
	margin-right: 5px;
}
*html .export{
	background: url('../../imgs/export.jpg');
	padding: 0px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 5px;
}
.view{
	background: url('../../imgs/view.gif');
	padding: 0px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
*html .view{
	background: url('../../imgs/view.gif');
	padding: 0px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
.update{
	background: url('../../imgs/edit.png');
	padding: 1px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
*html .update{
	background: url('../../imgs/edit.png');
	padding-bottom: 2px;
	padding-left: 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
.delete{
	background: url('../../imgs/delete.png');
	padding: 1px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
*html .delete{
	background: url('../../imgs/delete.png');
	padding: 0px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
a.report{
	background: url('../imgs/report.png') no-repeat;
	padding: 1px 6px;
	height: 16px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
*html a.report{
	background: url('../imgs/report.png') no-repeat;
	padding: 0px 6px;
	height: 16px;
	text-decoration: none;
	margin-right: 5px;
	color: red;
}
a.fansclub{
	background: url('../imgs/fansclub.jpg') no-repeat;
	padding: 1px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 0px;
	color: red;
}
*html a.fansclub{
	background: url('../imgs/fansclub.jpg') no-repeat;
	padding: 0px 6px;
	height: 15px;
	text-decoration: none;
	margin-right: 0px;
	color: red;
}
#content .box_workshop_app .icons{
padding: 2px;
}

/***** FILTER *****/
#filter, #filter_class{	
	width: 500px !important;
	padding: 10px;
	margin-top: 0px;
	/*border:1px solid black;*/
}
*html #filter_class{
	width: 330px;
}
*html #filter{
	margin: -6px 0px;
	width: 310px;
}
#filter_work_app{
	width: 370px;
	padding: 10px;
	margin-bottom: 15px;
}
*html #filter_work_app{
	width: 400px;
}
.filter_text{
	font-weight: bold;
	color: #223b6a;
}
.filter_label{
	font-weight: bold;
	float: left;
	color: #223b6a;
	margin-right: 3px;
	text-align:right;
}
#filter_class_row1{
	margin-bottom: 3px;
	margin-left: 54px;
}

*html #filter_class_row1{
	margin-left: 50px;
	margin-bottom: 3px;
}
#filter_class_row2{
	margin-right: 12px;
	float:left;

}
.filter_label_ws_app_row1{
	font-weight: bold;
	color: #223b6a;
	margin-left: 85px;
}
.filter_label_ws_app_row2{
	font-weight: bold;
	color: #223b6a;
	margin-left: 98px;
}
.filter_label_ws_app_row3{
	font-weight: bold;
	color: #223b6a;
	margin-left: 0px;
}
.filter_label_ws_app_row4{
	font-weight: bold;
	color: #223b6a;
	margin-left: 28px;
}

*html .filter_label_ws_app_row1{
	margin-left: 85px;
}
*html .filter_label_ws_app_row2{
	margin-left: 97px;
}
*html .filter_label_ws_app_row3{
	margin-left: 0px;
}
*html .filter_label_ws_app_row4{
	margin-left: 35px;
}

.submit_ws_app{
	margin-left: 28px;
}
*html .submit_ws_app{
	margin-left: 8px;
}
.filter_field{
	margin-bottom: 3px;
}

.filter_submit{
	float: right;
	width:80;
	margin-top:-25px;
}
.workshop_filt_row2{
	margin-left: 15px;
}
*html .workshop_filt_row2{
	margin-left: 22px;
}

/***** sorting & pager *****/
#sorting_pager{
	clear:both;
}
#sorting{
	float:right;
}
div.apagination{
	width:400px;
}

/***** general *****/

.clear{ clear: both; }
.red{ color: red; }
.blue{ color: blue; }
.big{ font-size: 20px; }
.medium{ font-size: 15px; }
.alignright{ float:right; }
.redNote{ background: red; color: white; padding:3px; margin-bottom:10px; line-height:19px; }
.blueNote{ background: blue; color: white; padding:3px; margin-bottom:10px; line-height:19px; }

tr.summary td{
	/*border-top: 2px solid #BBBBFF;
	border-bottom: 2px solid #BBBBFF;*/
	color: #8888cc;
	font-weight: bold;
	background: #ddddFF;
}

div.controls{
	padding-bottom: 10px;
	height: 30xp;
	float: right;
}

div.controls a{
	font-weight: bold;
}


/******** for background and pop up *********/

#background{
  background-color: black;
  opacity:0.6;
  filter:alpha(opacity=60);
  width:100%;
  height:100%;
  position:absolute;
  top:0px;
  left:0px;
  z-index: 9;
  display:none;
}

#detail_700_popup, #emailForm, #addPhotoForm, #loading{
  z-index: 10;
  display:none;
  position:absolute;
  width:700px;
  height:auto !important;
  background: white;
  border:1px solid gray;  
  top:50px;
  left:50px;
}
#detail_700_popup #wrap, #emailForm #wrap, #addPhotoForm #wrap, #loading #wrap{
  width:670px !important; /* overwrite */
}
#detail_700_popup #content, #emailForm #content, #addPhotoForm #content, #loading #content{
  width:600px !important; /* overwrite */
}
#detail_700_popup .content, #emailForm .content, #addPhotoForm .content, #loading .content{
  /*margin-top:20px;*/
  background: white;  
  /*width: 595px;
  height:455px;*/
  width: auto;
  height:auto;  
  /*
  padding:8px;  
  padding-top:15px;*/
  overflow: hidden;
  /*border: 1px solid gray;*/
  margin:0px;
  padding:10px;
}                     
#detail_700_popup .content img , #emailForm .content img, #addPhotoForm .content img{
  width:auto;
  height:auto;
}                                                           
#detail_700_popup .close, div.popup .close, #emailForm .close, #addPhotoForm .close{
  margin:0px;
  padding:0px;
  background: url('../imgs/popup_close.jpg') no-repeat;
  width: auto;/*595px;*/
  height: 25px;
  width: 25px;
  /*background-position:right top;*/
  float:right;
}









/**************** MAIN CONTAINER & common ********************/

body {
	color:black;
	background:white;
	font-family:Lucida Grande,Verdana,Geneva,Sans-serif;
	font-size:12px;
	margin-top:0px;
	margin: 0;
  text-align: center;
  width: 100%;
}

#wrap{
  clear:both;
  width:950px;
  padding:0px; 
  margin:0 auto;    
}

#main{    
    margin: 10px ;
    padding-bottom: 20px;
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 20px;
    text-align: left;
    width: 964px;
}

#content_main {
	margin:0 auto;
	width:100%;         
}

#content{
  clear:both;
  padding:15px;  
  padding-right:0px;
  padding-top:0px;
  _padding-top:15px;
  width:630px;
  _width:655px;
  float:left;
  text-align:left;  
  overflow:hidden;  
}
#content h1 {
	color: black;
	font-weight: bold;
	font-size: 2.25em !important;
	padding: 0px;
	margin-bottom: 0px;	
  line-height:150%;
}
#content h2 {
	color: black;
	font-weight: bold;
	Xfont-size: 15px !important;
  font-size: 2.25em !important;
  Xline-height:100% !important;
  line-height:150%;
	Xwidth:580px;
	padding-bottom:0px;
	margin-bottom:0px;
}

#right{
  width:270px;
  _width:250px;  
  float:right;
  padding-bottom:20px;  
  padding-top:20px;
}
#right .block{
  width:97%;
  box-sizing: border-box;
  padding:20px;
  Xpadding-left:20px;
  text-align:left;
}
#right .block h3{ color:black; font-size:125%; font-weight:bold; padding:0 0 0px 0; margin:0; }
#right .block h3::after{ display:block; width:50px; height:3px; background:orange; padding:0; margin:12px 0 5px 0; content:''; }
#right .block ul{ list-style: none; padding:0; margin:0; }
#right .block li{  padding:0; padding-top:12px; margin:0; text-align: justify; }
#right .block, #right .block a{ color:#797979; }
                 
.sspaguide-banner , .agreement-banner { text-align:left; padding: 20px 20px 25px 20px; }
.sspaguide-banner img, .agreement-banner img{ width:100%; }
.sspaguide-banner {  padding-top: 40px; }
.agreement-banner {  }

#right .block.stat > div { line-height:200%; padding-top:10px;  }

#right .fb-like-box{ margin-top:20px !important; margin-left: -10px !important; }

#dynamic_content{
  clear:both;
  padding-top:20px;
}

h3 {
	font-size: 15px;
	font-weight: bold;
	color:orange;	
	margin:0 0 0 0;
	padding-top:10px;
}

a:hover{
  text-decoration:none;
}

.pager{
  width:100%;  
  height:20px;
  Xpadding-left:20px;
  color:black;
  text-align:center;  
  margin:20px 0;
}
.pager span, .pager div{  Xfloat:left; display:inline; }
.pager div.apagination{ width:auto;} 
.pager a, .pager strong{ color:#888; padding: 0 10px; }



.social_medias_pre_icons{ position: relative; width: 37px; box-sizing: border-box; z-index:2; float: left; }
.social_medias_pre_icons img{ width:21px; height:21px;  
  filter: opacity(100%) contrast(100%) brightness(81%) drop-shadow(0px 0px 0px white) grayscale(0%) invert(0%) saturate(330%) hue-rotate(0deg) !important;
  -webkit-filter: opacity(100%) contrast(100%) brightness(81%) drop-shadow(0px 0px 0px white) grayscale(10%) invert(0%) saturate(325%) hue-rotate(0deg) !important;}
.social_medias_pre_icons img:hover{ top:-3px; position:relative;}
.addthis_sharing_toolbox{ position: relative; width: 150px; text-align: left; padding-right: 20px;  box-sizing: border-box; z-index:2; float: left;  clear:none !important; }       
.addthis_alignment_fixer{ height: 36px; width: 100%; top: 0; position: relative; z-index:1; }
.at-share-btn-elements a.at-icon-wrapper{ margin-left:10px; }
.at-share-btn-elements a.at-icon-wrapper:first-of-type{ margin-left:0px; }
.at-share-tbx-element .at-icon-wrapper, .at-share-tbx-element .at-icon {        width: 20px !important;    height: 20px !important; }
.fb{ width:calc(100% - 155px - 40px); float:left }
.fb-like{  margin:0px !important; padding:0px !important; }
.fb-like-box{  margin:0px !important; }          
@media only screen and (max-device-width:767px){ /*****************/
  .social_medias_pre_icons{ width:85px; }
  .social_medias_pre_icons img{ width:58px !important; height:58px !important; }
  .addthis_sharing_toolbox{ width:330px; }
  X.addthis_alignment_fixer{ height: 70px; }                           
  .at-share-tbx-element .at-icon-wrapper, .at-share-tbx-element .at-icon {        width: 55px !important;    height: 55px !important; }
  .fb{ width:0px;  max-width:100%;  height:0px; transform: scale(2.5);  overflow-x:visible; line-height:100%; }
}


/**************** TOP BAR ********************/

#top_line {
    border-top: 3px solid #8FBBB3;    
    clear: both;
    height: 3px;
    margin-top:0px;    
}

#topBar img.logo{
  float:left;
}
#topBar .slogan{
  float:right;  
  padding-right:52px;
  padding-top:40px;
  text-align:left;  
}
/*#topBar .slogan a{
  font-size:18px;
  color:#ED5E2E;
  line-height:30px;
  font-weight:bold;  
}
#topBar .slogan a:hover{
  text-decoration:underline;
} */
#topBar .slogan > a.button{ display:inline-block; padding:0 30px 4px 30px; background:white; border:1px solid #ff8c1a; color:#ff8c1a !important; border-radius:24px; box-sizing:border-box;}
#topBar .slogan > a.button span{ font-size:140% ; line-height:40px; font-weight:normal;  }


#admin_bar {
    float:right;
    margin:0px;
    padding:0px;    
    margin-top:80px;
    _margin-top:70px;
    clear:right;    
}
#admin_bar a{    
    color: black;
    font-size:15px;
    font-weight:bold;
    padding:0px;
    padding-left:15px;
	   padding-right:15px;
}
#admin_bar a:hover{
    color: mediumblue;
    text-decoration:none;
}
#admin_bar .admin {
	float:left;	
}
#admin_bar .admin.current {
    font-weight:bold;
}
#admin_bar .admin.current a{
    color: darkorchid;
}

#wellcome_msg {
    float:right;
    margin-top:2px;
    margin-right:10px;    
}
#wellcome_msg span{
    font-style:italic;
    font-weight:bold;
    margin-right:5px;
}

/***** LOGIN *****/
#login_form{	
	padding: 5px;
}
#username{
	float: left;
	color: #223b6a;
	font-weight: bold;

}
#username_input{
	float: left;
}
.block{
	display: block;
}
#password{
	display: block;
	float: left;
	color: #223b6a;
	font-weight: bold;
}
#pwd_input{
	
}
.login_box{
	width: 500px;
}
.login_box img{
  padding-bottom:3px; 
}
#login_form .login_box td{
	height: 30px;
	padding: 5px;
}

/******** table common **********/

tr.record.over{
  background:#eeeeee;
}

/******** iframe common setting *********/

iframe{
  border:0px;
  padding:0px;
}

/********** listing page in box form *************/

.list_box{
  background:#eee;
  padding:10px;
  clear:both;
  margin-top:15px;  
}
.list_box .manageDiv{
  float:right;
}
.list_box .manageDiv a{  
}
.list_box .pic{
  float:left;
  padding-right:15px;
  padding-bottom:15px;
}
.list_box .date{
  color:gray;
  padding-bottom:5px;
}
.list_box .title{
  color:#2C557F;
  font-weight:bold;
  padding-bottom:5px;
}
.list_box .langDiv{
  border-bottom:1px solid #ccc;
  padding-bottom:10px;
}
.list_box .showHideLangDiv{
  padding-top:10px;
  padding-bottom:10px;  
}
.list_box .noPhotoDiv{
  width:100px;
  height:100px;
  border:1px solid gray;
  text-align:center;
  padding-top:40px;
}

/***** sub menu *****/

.sub_menu{
	float: right;
	padding-top:10px;
	text-align:right;
}
.sub_menu a{
	color:white;
	background:#715C9A;
  margin-left:10px;
  margin-top:0px;
  padding:5 8 7 8px;
  border:1px solid green;
  line-height:22px;
}


/**** form ***/

#create_form textarea, #update_form textarea, #html___Frame{
  width:500px;
  height:100px;
}

input{
  margin-bottom:4px;
}

/***** article ******/

.action_list .social_mmedias_links{ margin-top: 50px; }
.action_list .social_medias_pre_icons{ margin-left: 10px; }
.action_list .fb {    width: calc(100% - 155px - 55px); }

.article_preview-box-top{
  width:630px;
  height:30px;
  background:url('/blog/imgs/tutor-box-top.jpg') no-repeat;
}
.article_preview-box-bottom{
  width:630px;
  height:36px;
  background:url('/blog/imgs/tutor-box-bottom.jpg') no-repeat;
}
.article_preview{
  background:url('/blog/imgs/tutor-box-middle.jpg') repeat-y;  
  width:620px;;  
  box-sizing:border-box;
  padding-bottom:60px;
  padding-top:10px;
  padding-left:30px;    
  text-decoration:none;
  color:black;
  clear:both;
  
}
.article_preview.show_page{  border-bottom:none !important; }
.article_preview.show_page .own_category_link{ Xtext-align:right; padding-bottom:20px; }
.article_preview.show_page .own_category_link a{ color:#797979; }
.article_preview .content{
  /*max-height:500px;  */
  width:570px;
  overflow:hidden;
  line-height:170%;
  position:relative;
}
.article_preview .content .internal_link_info{
  display:none;
  width:150px;
  position:absolute; 
  Xleft:-70px;
  Xtop:0px;  
  z-index:2;
        
}
.article_preview .content .internal_link_info span{
  display:block;           
  color:#000;                   
  border:orange 1px solid;
  border-radius:5px;
  padding:5px;     
  font-size:13px;
  line-height:16px;
  background-color: #eee; 
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#eee)); 
  background: -webkit-linear-gradient(top, #fff, #eee); 
  background: -moz-linear-gradient(top, #fff, #eee); 
  background: -ms-linear-gradient(top, #fff, #eee); 
  background: -o-linear-gradient(top, #fff, #eee);
  box-shadow:3px 3px 3px #aaa;
}
.article_preview .content .MsoNormal span{
  line-height:170%;
}                  
.article_preview .content img{ max-width:100%; }
.article_preview .content .misc{
  color:#ccc;
  padding-top:20px;
  line-height: 100% !important;
}
/*.article_preview .more{  color:blue;  text-align:right;  padding-top:10px;  padding-bottom:20px;  width:570px;  border-bottom:1px solid #ddd; }*/
.article_preview .more{   margin-top: 25px;  text-align:center; width: 570px; }
.article_preview .more span{  display:inline-block; padding:0 20px 0 20px; background:white; border:1px solid #ff8c1a; color:#ff8c1a !important; border-radius:38px; font-size:100% ; line-height:20px; font-weight:normal; }

.article_preview .content figcaption{
  display:inline !important;
}

.article_netvigator{  width:96%;  vertical-align:middle; display: flex; }
.article_netvigator > div{ width:50%; box-sizing:border-box; padding:13px 0px; display: flex;}
.article_netvigator a{  display:inline;  Xwidth:84%;  margin:0 10px; color:#ff8A00; font-weight:bold; font-size:130%; }
/*.article_netvigator .older:after{ display: flex; position: absolute; right: -20px; width: 100%; height: 100%; text-align: right; content: ''; Xcontent: "\276f"; color: orange; font-size: 14px; 
    background: url('../imgs/arrow_right_orange.jpg') no-repeat;    background-size: 18px auto; background-position: right 10px center; }*/

.article_netvigator .sign{
  font-weight:bold;
  font-size:16px;
  color:#FFA500 ;
  display:block;
  float:left;
}
.article_netvigator .sign_svg, .article_netvigator a{ display:inline-flex; align-content: center; align-items: center; }
.article_netvigator .sign_svg{ }
.article_netvigator .newer a, .article_netvigator .newer .sign_svg{ Xfloat:left;  }
.article_netvigator .older a, .article_netvigator .older .sign_svg{ Xfloat:right;  }    

.article_netvigator.bottom{
  clear:both;
  padding:40px 0 20px 0;
}
.article_netvigator .newer{
  float:left;  
  Xwidth:250px;
  Xpadding-left:0px;
  /*background: url("/imgs/pre_arrow.jpg") no-repeat;*/
  Xpadding-top:13px;  
}
.article_netvigator .newer a{
  Xmargin-left:10px;
}
.article_netvigator .older{
  float:right;
  Xwidth:280px;
  Xpadding-right:0px;
  /*background: url("/imgs/next_arrow.jpg") no-repeat 235px 0px;*/
  text-align:right;  
  Xpadding-top:13px;
}
.article_netvigator .older a{
  Xmargin-right:10px;
}

.comments{
  margin-top:40px;
  background:#eeeeee;
  width:570px;  
}
.comments div.title{
  width:555px;
  _width:570px;
  background:#F1EeBd;
  color:#555;
  font-weight:bold;
  font-size:15px;
  padding:5px;
  padding-left:10px;
}
.comments .leave_comment, .comments .existing_comments{  
  padding:10px;
  border-bottom:1px solid #dddddd;
}
.comments .leave_comment{  
  margin-top:10px;
}
.comments .leave_comment table{
  color:black;
}
.comments .existing_comments{
  background:#f6f6f6;  
}
.comments .existing_comments .comment{
  padding-bottom:10px;
  padding-top:15px;
  _padding-top:10px;
  border-bottom:1px dashed orange;
}
.comments .existing_comments .comment .leaveCommentLink{  
  clear:both;  
  padding-top:10px;
  display:block;
}
.comments .existing_comments .comment .leaveCommentLink .sign{  
  width:15px;
}
.comments .existing_comments .comment.last{
  border-bottom:none !important;
}
.comments .existing_comments .comment .name{
  color:orange;
  font-weight:bold;
}
.comments .existing_comments .comment .name.staff{
  /*color:red;*/
}
.comments .existing_comments .comment .email{
  color:blue;
}
.comments .existing_comments .comment .time{
  color:grey;
}
.comments .existing_comments .comment .message{
  color:black;
  display:block;
  margin-top:5px;
}
.comments .existing_comments .comment .leave_comment{
  margin-left:50px;
  margin-top:3px !important;
}
.comments .existing_comments .comment .leave_comment_2nd{
  background:#eee;
  margin-top:none;
  margin-bottom:none;
  padding-top:none;
  padding-bottom:none;
}
.comments .existing_comments .comment_2nd{
  padding-bottom:5px;
  _padding-bottom:0px;
  padding-top:7px;
  margin-left:50px;
  margin-top:10px;
  border-top:1px dashed #ddd;  
}

.comments_v2{
  margin-top:30px;
}


.comments_v2 textarea{
  resize: none;
}
.comments_v2 ::-webkit-input-placeholder,  
.comments_v2 :-moz-placeholder, /* Firefox 18- */
.comments_v2 ::-moz-placeholder,  /* Firefox 19+ */
.comments_v2 :-ms-input-placeholder, 
::placeholder{  
     color: #333;
}

.comments_v2 .leave_comment table{
  width:570px;
}

.comments_v2 .title{
  font-size: 22px;
  padding-bottom:20px;
  color: rgba(0, 0, 0, 0.6);
}

.comments_v2 .comment_block{
  position:relative;
}
.comments_v2 .comment_block textarea{
  width:100%;  
  height:145px;
  z-index:2;
  background:#fff;               
  border:1px solid #aaa;
  padding-left:10px;
  padding-right:10px;
}
.comments_v2 .comment_block .buttons{
  position:absolute;
  top:100px;
  right:25px;
  z-index:3;
}
.comments_v2 .comment_block .buttons input{
  padding:8px;
  background:#FFA500;
  color:white;
  border-radius:5px;
  border:0px;
}
.comments_v2 .comment_block .buttons a{
  color: grey;
  text-decoration: none;
  margin-right: 10px;
  display:none;
}

.comments_v2 .visitor_info{
  display:none;
  Xoverflow:hidden;  
}
.comments_v2 .visitor_info .note{    
  color:#888;
  padding-left:10px;
}
.comments_v2 .visitor_info input{  
  margin-bottom:8px;
  background:#fff;
  border:1px solid #aaa;
  width:300px;
  padding-left:10px;
}
.comments_v2 .visitor_info input.error,
.comments_v2 textarea.error{
  color:Red;
}  
.comments_v2 .comment_block textarea,
.comments_v2 .visitor_info input{
  font-size:13px;
  line-height:30px;
}

.comments_v2 .existing_comments{
  Xbackground:white;  
  width:570px;
  padding-top: 30px;
}
.comments_v2 .existing_comments .comment{
  position: relative;
  padding-bottom:30px;
  padding-top:15px;
  _padding-top:10px;
  border-bottom:1px solid #ccc;
}
.comments_v2 .existing_comments .comment .leaveCommentLink{  
  padding-top: 0px;
  display: block;
  position: absolute;
  top: 20px;
  right: 10px;
}
.comments_v2 .existing_comments .comment .leaveCommentLink .sign{
  display:block;  
  width:18px;
  height:18px;
  border-radius:9px;
  background:#aaa;
  color:white;
  font-size:17px;
  line-height:14px;
  font-weight:bold;
  text-align:center;   
}
.comments_v2 .existing_comments .comment.last{
  border-bottom:none !important;
}
.comments_v2 .existing_comments .comment .name{
  color:#777;
  font-size:20px;
  font-weight:bold;
}
.comments_v2 .existing_comments .comment .name.staff{
  /*color:red;*/
}
.comments_v2 .existing_comments .comment .email{
  color:blue;
  Xdisplay:none;
}
.comments_v2 .existing_comments .comment .time{
  color:#666;  
  padding-left:20px;
}
.comments_v2 .existing_comments .comment .message{
  color:#666;  
  font-size: 16px !important;
  line-height:20px;
  display:block;
  margin-top:15px;
}
.comments_v2 .existing_comments .comment .leave_comment{
  margin-left:50px;
  margin-top:3px !important;
}
.comments_v2 .existing_comments .comment .leave_comment_2nd{  
  margin-top:30px !important;
  margin-bottom:none;
  padding-top:none;
  padding-bottom:none;
}
.comments_v2 .leave_comment_2nd .comment_block{
  width:500px;
}
.comments_v2 .existing_comments .comment_2nd{
  padding-bottom:5px;
  padding-top:15px;
  margin-left:50px;
  margin-top:30px;
  border-top:1px solid #ccc;
  box-sizing:border-box; 
}

a.leaveCommentLink{
  margin-left:50px;
}