/* Minification failed. Returning unminified contents.
(1018,2): run-time error CSS1031: Expected selector, found '}'
(1018,2): run-time error CSS1025: Expected comma or open brace, found '}'
 */
@charset "utf-8";
body {
	font: 105% Verdana, Arial, Helvetica, sans-serif;
	background: #fff;
	margin: 0;
	padding: 0;
	color: #000;
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif";
	text-align:justify; 
	text-justify: inter-ideograph;
	
	/*background-image:url("/publicimages/testbg.png") ;
	background-size: 100% 100%;
    background-repeat: no-repeat;*/
	/*background-image:url("/publicimages/shadow.png") ;
	background-position-x:center;
	background-repeat:repeat-y;
	*/

}

.sqdropdown{
	padding:5px;
}

/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
	padding: 0;
	margin: 0;
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif";

}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
	padding-right: 15px;
	padding-left: 15px;
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif"; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
}

li,td {
	font-family: Arial, "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體", "MS Serif";
}

sup {
	line-height: 0;
}
h1{
	/*color: #16A796; 2014 color*/
	color: #016BB5;
	font-size:1em;
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif";
}

h2{
	/*color:#3b3b3d;*/
	color:#472f91;
	font-size:1.5em;
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif";
}

h3{
	/*color:#026CB8;*/
	color:#016BB5;
	font-size:1em;
}

h4{
/*	color:#026CB8;*/
	color:#016BB5;		
	padding:0;
	font-size:1em;
	margin-bottom:0;
}

h5 { 
	 margin-bottom:0px;
	 padding-left:0px;
}

/*#A7DBD8 #E0E4CC #F38630 #FA6900 */


p{
	text-align:justify; 
	text-justify: inter-ideograph;
	font-size:1em;
	line-height:1.6em;
}

p.imp
{
	text-align:inherit;
	text-justify:none;
	color:#016BB5;
	
	/*color:#026CB8;*/
	font-size:0.8em;
	padding-top:0;
	top:-15px;
	padding-left:15px;
}


.body .content p {
    	font-size:1em;
}

.body .content h1{
	font-size:1em;
}

.body .content h2{
	font-size:1.6em;
}

.body .content h3{
	/*color:#026CB8;*/
	font-size:1.2em;
}

.body .content h4 {
    font-size:1.2em;
}


.publicinfocontent h4{
	margin-left:15px;
}


.imp {
	color: #5f9a26;
	padding: 0;
}

.star {
	text-align:inherit;
	text-justify:none;
	color:#F60;
	padding:0;
}
.remark{
	font-size:0.9em;
	margin-bottom:5px;
}
.sqexplain{
	color:#093;
}

/*
.swal2-html-container {
	text-align: left !important;
}
*/

.studentmenu ul li span.star {
	color:#ffffff;
	padding:5px;
	font-size:1.4em;
}


a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
}

/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color:#414958;
	text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
	color: #4E5869;
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	text-decoration: none;
}

div#fbbutton a:hover
{
	opacity:0.8;
}

div#fbbutton a
{
	opacity:1;
}
/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
.container {

	width: 80%;
	max-width: 1150px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
	min-width: 780px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
	background: #FFF;
	margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
}


/* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */
.header {
	min-height: 400px;
	background-image: url(Untitled-1.png);
}

/* ~~ These are the columns for the layout. ~~ 

1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.

2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.

3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.

4) If you prefer your nav on the right instead of the left, simply float these columns the opposite direction (all right instead of all left) and they'll render in reverse order. There's no need to move the divs around in the HTML source.

*/


.sidebar1 {
	float: left;
	width: 13%;
	background: #ffffff;
	padding-bottom: 10px;
	padding-left:10px;
	padding-top: 10px;
	margin:0;
	border:0;

}

/* fr internet */

.sidebar1 ul,
.sidebar1 ul li {
  list-style: none;
  margin: 0;
  padding:0;
}

.sidebar1 ul {
	border: solid #BCBCBC 1px;
	background-color:#16A796;
	
}

.sidebar1 ul li {
	border-bottom: solid #E9E9E9 1px;
	font-size:small;

}

.sidebar1 a{
	display:block;
	padding: 8px 10px;
	color: #e9e9e9;
	
}

.sidebar1 ul li.first a{
	color:#e9e9e9;
	
	background-color:#026CB8;
	
	padding-bottom: 8px;
	text-decoration:none;

}

.sidebar1 ul li.first a:hover{
	color:#e9e9e9;
	background: #3b3b3d;
	padding-bottom: 8px;

}

.sidebar1 a:hover{
	color:#e9e9e9;
	background: #3b3b3d;
	padding-bottom: 8px;

}

.content {
	width:100%;
	padding: 10px 0;
	max-width:940px;
	min-width:600px;
	float: left;
	padding-top:40px;
	padding-bottom:40px;
}

.pt_none {
    padding-top:0px !important;
}


.content1 {
	min-width:800px;	
	padding: 10px 0;
	max-width:940px;
	float: left;
	padding-bottom:40px;
}

/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol { 
	padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}


.contenta {
	
	padding: 10px 0;
	max-width:940px;
	float: none;
	padding-top:40px;
	padding-bottom:40px;
}


/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.contenta ul, .contenta ol { 
	padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}

.warpitup{
	position:relative;
	display:inline;
	float:left;

	border:solid 1px #472f91;
/*	border:solid 1px #16A796;*/
	padding-top:30px;
	padding-bottom:30px;
	padding-left:100px;
	padding-right:100px;
	border-right:solid 80px #472f91;
	/*border-right:solid 80px #16A796;*/
	
	-moz-border-radius:0 0 0 50px;
	-webkit-border-radius:0 0 0 50px;
	border-radius:0 0 0 50px;
	width:80%;
}




.warpname{
	width:400px;
	position:absolute;
	right:-430px;
	top:10px;
	transform: rotate(90deg);
	transform-origin:0% 0%;
	-ms-transform: rotate(90deg); /* IE 9 */
	-ms-transform-origin:0% 0%; /* IE 9 */
	-webkit-transform: rotate(90deg); /* Safari and Chrome */
	-webkit-transform-origin:0% 0%; /* Safari and Chrome */
	-moz-transform: rotate(90deg); /* Firefox */
	-moz-transform-origin:0% 0%; /* Firefox */
	-o-transform: rotate(90deg); /* Opera */
	-o-transform-origin:0% 0%; /* Opera */
	color:#f6f6f6;
}



ol.sqpoint{
	list-style:outside decimal;
	font-size: 1em;	
}

ol.sqpoint li{
	line-height:1.3em;
	margin-top:1.2em;
}

ul.sqpoint{
	list-style:outside decimal;
	font-size: 1em;	
}

ul.sqpoint li{
	
	line-height:1.3em;
	margin-top:1.2em;
}

ul.sqpoint li h4{
	
	line-height:1.4em;
}

ul.sqpoint li ul.sqlist li

{
	margin-top:0;

}

ul.sqpoint li ul.sqlist {
	padding-bottom:1px;
		padding-right:0;
	margin-right:0;
}

ul.sqlist {
	padding-left:30px;
	list-style:circle outside;
	/*font-size: 0.8em;	*/
	line-height:1.6em;	
}

ul.sqschoollist {
	padding-left:30px;
	list-style:circle outside;
	font-size: 1em;	
	line-height:1.6em;	
}

ul.sqnonelist {
	list-style:none;
	font-size: 1em;	
	margin:0;
	padding-left:15px;
}

ul.sqnonelist li{
	margin-bottom:0.8em;
}

ul.sqsafe{
	padding-left:30px;	
	list-style:outside decimal;
	font-size: 0.8em;	
	line-height:1.6em;	
}

table#phonelist{
	width: 80%;
	border:none;
	padding-bottom: 15px;
	padding-left: 15px;
	
}

table#phonelist td{
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif"; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
	border:none;
	font-size:1em;
}

table.publicinfotable{
	margin-left:15px;
}

table.publicinfotable td {
	padding-left:15px;
	padding-right:15px;
	padding-top:10px;
	padding-bottom:10px;
	font-size: 0.9em;
	text-align: left;
	background: none;
	background-color: none;
	border: none;
	border-bottom: solid 0.5px #2e9ce9;
}


	table.publicinfotable tr:last-child td{
		border-bottom:none;
	}

	table.publicinfotable {
		border: 1.5px solid #2e9ce9;
		border-radius: 15px;
		background-color: #fdfdfd;
	}



table.remark_text{
	margin-bottom:20px;
	margin-left:15px;
	font-size:0.8em;
}


ul.publicinfolist {
	list-style:disc outside;
	font-size:1em;
	padding-left:30px;
}

	ul.publicinfolist li {
		margin-bottom:10px;
		padding-left:5px;

	}
	
	p.listprefix{
	margin-bottom:5px;
}

ul.sqcourselist {
	list-style: none;
	font-size: 0.8em;
}


ul.sqcourselist li{
	float:left;	
	*padding:10px;
}


ul.sqcourselist li a{
	border: 1px #BCBCBC solid;
	width:130px;
	height:130px;
	float:left;
	padding:5px;
	
	margin-left:20px;
	margin-bottom:20px;
	text-decoration:none;
	
}


.flow-content-container {
	display: flex;
	flex-direction: column;
	margin:15px;
	
	
}

	.flow-content-container .content-item {
		box-sizing: border-box;
		/*width: calc(50% - 30px);
		margin-left: auto;
		margin-right: auto;*/
		padding: 15px;
		border: 1.5px solid #2e9ce9;
		border-radius: 15px;
		background-color: #fdfdfd;
		margin-bottom: 20px;
	}

		.flow-content-container .content-item h3 {
			text-align: center;
		}



#lastblockimg {
	margin-top:30px;
	height: 8px;
	background-color:#ff9c8c;}

ul.sqcourselist a:hover, ul.sqcourselist a:active, ul.sqcourselist a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
	color: #FFF;
	/*background-color: #09F;*/
	background-color: #66CC66;
	display:block;
}


/** search course details css**/

.sqsearch_result_warp {
	width:100%;
	padding: 0px 0px 10px 0px;
	margin-top:10px;
	float:none;
	display:block;
	border-bottom: 1px solid #333;
}

ul.sqsearch_result {
	list-style:none;
	width:100%;
	padding-left:5px;
}


ul.sqsearch_result li{
	/*background-color:white;*/
	width:46%;
	min-width:46%;
	background: none;
	display:inline;
	padding:0px;
	text-decoration:none;
	float:left;	
	
	
	}

/* Start Mode Changer*/
.modewrapper
{
	border-bottom:solid; border-width:1px;margin-left:15px;margin-right:20px;margin-bottom:20px;
}


.modewrapper div 
{
	height:70px;
}

.modewrapper > div.lastclear
{
	height:0px;
	float:none;
	clear:both;
}

.modewrapper > div 
{
	float: right;
	width:144px;

}
.modewrapper > div >div
{
	float: left;
	
}
.modewrapper > div:first-child
{
	float:left;
	margin-left:-15px;
	line-height:70px;
	
}

.modewrapper a > div
{

	height:70px;
	width:70px;
	background-size:70px 70px;
	padding:0px;
	margin:0px;
	margin-left:2px;
}

.modewrapper a.modea div
{
	background-image:url('../PublicImages/bycourse_dim.png');
}

	.modewrapper a.modea:hover div {
		background-image: url('../PublicImages/bycourse.png');
	}

	.modewrapper a.modea div.active {
		background-image: url('../PublicImages/bycourse.png');
	}
.modewrapper a
{
	text-decoration:none;
}
	.modewrapper a.modeb div {
		background-image: url('../PublicImages/byschool_dim.png');
	}

	.modewrapper a.modeb:hover div {
		background-image: url('../PublicImages/byschool.png');
	}


	.modewrapper a.modeb div.active {
		background-image: url('../PublicImages/byschool.png');
	}

/* End Mode Changer*/


ul.sqsearch_result li.sqbullet{
	margin:5px;
	min-width:0;
	width:20px;
	height:80px;
	padding:0;
 
}

div.sqsearch_tablewrapper
{
	display:table;
	margin-left:45px;
}

div.sqsearch_tablewrapper div.sqsearch_tc_colorblock
{
	display:table-cell;
	width:65px; 
	vertical-align:top;
}
/*

div.sqsearch_tablewrapper div.sqsearch_tc_colorblock div
{
	width:65px;		
	height:65px;
	margin-top:5px;
	box-shadow: 1px 1px 2px #888888;
}
	*/

div.sqsearch_tablewrapper div.sqsearch_tc_result
{
	display:table-cell;
	width:100%;
}




#Architecture{
	
background-color:#3399ff;

}
#Arts{

background-color:#663399;

}
#Beauty{

background-color:#ff3366;

}
#Business{
background-color:#156094;
}

#Computer{
background-color:#5c5757;
}
#Economics{
background-color:#ccff99;
}
#Education{
background-color:#336633;
}
#Engineering{
background-color:#ff6633;
}

#Fineart{
background-color:#ff0000;
}

#GeneralEducation {
    background-color: #a8add8;
}

#Hotel{
background-color:#005845;
}

#Law{
background-color:#993300;
}
#Media{
background-color:#990000;
}

#Medical{
background-color:#003399;
}

#Sciences{
background-color:#669900;
}

#Security{
background-color:#cccc33;
}

#Social{
background-color:#cc3366;
}

#Transport{
background-color:#462b07;
}


ul.sqsearch_result li.course_code_name{
	width:98%;
	margin-left:0px;
	font-weight:700;
}



ul.sqsearch_result li.details_button{
	float:left;
	width:auto;
	min-width:0px;
	margin-left:30px;

}


	
.details_button input{
	margin:0px;
	vertical-align:bottom;
}

.sqsearch_result_warp2{
	margin-left:95px;
	position:relative;
	padding: 0px 0px 0px 0px;
	float:left;
	display:block;
	width:100%;

}



/** search course details css end**/





/* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
ul.nav {
	list-style: none; /* this removes the list marker */
	 /* this creates the top border for the links - all others are placed using a bottom border on the LI */
	margin-bottom: 15px;
	padding-top: 20px; /* this creates the space between the navigation on the content below */
}
ul.nav li {
	border-bottom: 1px solid #f1f1f1;
	font-size:small; /* this creates the button separation */
}

ul.nav li.topnav {
	border-bottom: 1px solid; /* this creates the button separation */
	border-bottom-color: #036;
	font-size:smaller;
	background-color:#036;
}

ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
	padding: 5px 5px 5px 15px;
	display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
	text-decoration: none;
	color: #333;
	background-color: #ffffff;	
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
	color: #FFF;
	background-color: #09F;
}

#safelist{
	float:left;
	max-width: 55%;
	min-width: 200px;
	padding: 20px 0px;
	padding-bottom:40px;
	}
#register1 {
	float: left;
	width: auto;
}
#register {
	float: left;
	max-width: 40%;
	padding: 20px 0px 0px 40px;
}


/*

	



#register2{
	float:left;
	}

#register3{
	float:left;
	max-width:70%;
	
	}
	*/
div#register3 p
{
	margin-bottom:5px;
}

div#register3 p.imp
{
	margin-bottom:20px;
}


#register3 .field-validation-error{
	margin-left:15px;
}

p.hkid_readonly {
	font-size: 0.8em;
	padding-top: 0;
	margin-bottom: 20px;
	padding-bottom: 20px;
}


#paymentreg{
	
	float:left;
	/*width:50%;*/
	margin-left:80px;
	}

/*
#register5,#register6,#register7,#register10,#register11,#register12,#register9{
	text-align:left;
	float:left;
	width:70%;
	}
	*/

#register5 h1, #register6 h1, #register7 h1, #register10 h1, #register11 h1, #register12 h1, #register9 h1, #register3 h2, #register4 h2 {
	margin-bottom: 0px;
}
	#register8{
	text-align:left;
	float:left;
	width:60%;
	}
	
#reglist2{
	position:relative;
	margin:auto;
	top:-60px;
	left:0px;
	max-width:20%;
	}


#reglist {
	float: left;
	max-width: 20%;
	min-width: 170px;
	display: none;
}
	

.enrollformlist{
	display:none;
	position:absolute;
	left:-115px;
	top:0;
	width:115px;


}

.formtableholdercontainer{
	display:flex;
}

.formtableholder {
	background-color: #fafafa;
	display: flex;
	flex-direction: column;
	padding: 40px 30px 40px 30px;
	/*justify-content: center;*/
	align-items: flex-start;
	margin-left: 15px;
	margin-right: 15px;
	/*border: solid 1px #ccc;*/
	border-radius: 20px;
}

.formtableholder.left {
	width:72%;
	margin-right:3%;
}

.formtableholder.right {
	position:relative;
		width: 25%;
			font-size:0.9em;
}


	.formtableholder.right .chevon {
		position: absolute;
		left: -30px;
		top: 60px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 30px 30px 30px 0;
		border-color: transparent #fafafa transparent transparent;
	}
.formtableholder.right
	}
	h3.section_title {
		color: black;
		font-size: 25px;
		margin-bottom: 0px;
	}

div.remark.imp{
	font-size:0.8em;
	color:#188BC0;
}

.application .button.green {
	background: rgb(120,210,48);
	color: white;
	border: none;
	text-shadow: none;
}


.listbuttonXL.db {
	display: block;
}
.formtableholder .content-wrapper {
	background-color: transparent;
	width: 100%;
	max-width: 750px;
	margin: 0 auto;
}

.formtableholder.left .content-wrapper {
	max-width: 500px;
}

.formtableholder.right .content-wrapper {
	max-width: 200px;
}

	.enrollform_step1 {
	/*
	overflow:auto;
	position:relative;
	float:left;
	border-left:100px #472F91 solid;
	border-right:2px #472F91 solid;
	border-top:2px #472F91 solid;
	border-bottom:2px #472F91 solid;
	-moz-border-radius: 0 0 0 50px;
	-webkit-border-radius:0 0 0 50px;
	border-radius:0 0 0 50px;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:10%;
	padding-right:15px;
	margin-left:15px;
	min-width:500px;
	text-align:left;
	width:85%;
	*/
}

	.enrollform_step1.wide
	{
		/*width:100%;*/
	}


ul.sqyjdregflow{
	/*list-style:none;
	font-size: 1em;
	padding:0px;
	margin-left:15px;
	width:auto;
	padding-top:1px;*/
	display:none;
}

ul.sqyjdregflow li {

	border-bottom: 1px #fff solid;
	text-align:center;
	padding:5px;
	text-decoration:none;
	color: #F9FBD0;
	/*background-color: #69B1E1;*/

	background-color: #006666;
}

ul.sqyjdregflow li:first-child {
	margin-top:15px;
	border-top: 1px #fff solid;
}


ul.sqyjdregflow li.current{
	border-right:none;
	/*background-color:#add864;*/
	background-color:#add864;
	color:#F9FBD0;
}


ul.sqyjdflow{
	list-style:none;
	font-size: 1em;
	display:inline;
}




ul.sqyjdflow li {
	border: 1px #bdbdbd solid;
	width:110px;
	text-align:center;
	float:left;	
	padding:20px 20px 20px 20px;
	margin-left:20px;
	margin-top:5px;
	margin-bottom:5px;
	text-decoration:none;
	color: #999;

	
}


ul.sqyjdflow li.current {
	border: medium #E0E4CC solid;
	/*background-color:#1570A6;*/
	background-color:#c71489;
	color: #ffffff;
	
}

ul.sqyjdflow li.head {
	border: 1px #bdbdbd solid;	
	text-align:center;
	text-decoration:none;
	background-color:#472F91;
	padding:10px 21px 10px 21px;
	color: #fff;
}

.formtable {
	border:none;
	border-collapse:collapse;
}


	.formtable.sqformtable {
		width: 100%;
		
	}


	.formtable.wide
	{
		width:100%;
	}


.addressline {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex:0 0 100%;
	margin-bottom:10px;
}
	.addressline.line1 div.words, .addressline.line2 div.words {
		width: 14%;
	}

	.addressline.line1 div.fields{
		width:18%;
	}

	.addressline.line2 div.fields {
		width: 86%;
	}

		.formtable.sqformtable .bdaytable {
			margin: 0px;
			width: 100%;
			box-sizing: border-box;
		}
.formtable.sqformtable .bdaytable td {
	padding: 0px;
	margin: 0px;
}

.readonlyborder {
	border: solid 1px #dedede;
	padding: 3px;
	width: 100%;
	box-sizing: border-box;
	min-height:25px;
}
.formtable.sqformtable td {
	padding:5px;	
	
}
	.formtable.sqformtable td input[type=text], .formtable.sqformtable td input[type=email] {
		width: 100%;
		border: solid 1px #0caa93;
		box-sizing: border-box;
	}

	.formtable.sqformtable td select {
		border: solid 1px #0caa93;
		box-sizing: border-box;
		border-radius: 2px;
	}


	.formtable > tbody > tr > td {
		font-size: 0.8em;
		padding: 6px 6px 6px 0px;
		text-align: left;
		font-family: "Adobe 黑体 Std R", "微軟正黑體", "新細明體", "細明體", Arial, "MS Serif";
		color: #3b3b3d;
	}





.formtable td.mid{
	font-size:0.8em;
	padding:6px 6px 6px 15px;
	text-align:left;
	font-family:"Adobe 黑体 Std R", "微軟正黑體", "新細明體", "細明體", Arial, "MS Serif";
	color:#3b3b3d;
	width:auto;
}


.formtable th{
	font-size:0.8em;
	padding:6px;
	color:#999;
	text-align:left;
	font-family:"Adobe 黑体 Std R", "微軟正黑體", "新細明體", "細明體", Arial, "MS Serif";
	font-weight: normal;
}



/* ~~ The footer ~~ */
.footer {

	*height:100%;
	padding: 0;
	position: relative;/* this gives IE6 hasLayout to properly clear */
	/* this clear property forces the .container to understand where the columns end and contain them */
	background-color:none;
	border-top-color:#000;
	clear: both;
	border-top-style: solid;
	border-top-width:thin;
	/*margin-top:10px;*/
}



.mapside{
	margin:0;
	padding:0;
	float:left;
}

.sitecolumnwarp{
	list-style:none;
	float:left;
	min-width:150px;
}


	
.sitecolumnwarp ul{
	padding-left:3px;
	list-style:none;
	
	}


	
.sitecolumnwarp li {
	min-width:100px;
	float:none;
	
}

.sitecolumnwarp li.bottitle a {
	color: #333;
	padding-top:15px;
	font-size:1em;
	display:block;
}

.sitecolumnwarp li a {
	padding:2px 2px 2px 5px;
	text-decoration:none;
	color:#8F8F8F;
	font-size:0.8em;
	display:block;
	
}


.sq_contactus{
	padding-top:20px;
	display:block;
	float:left;
	width:300px;
	padding-left:5px;
		font-family: "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體", Arial, "MS Serif";

}

.sq_contactus a{
	color: #333;
	font-size:1em;
	font-weight:normal;

}

div.logoside{
	margin:0;
	padding:0;
	width:auto;
	padding:1px;
	min-width:404px;
	float:right;
}
	
table.logos{
	width: 400px;
	border-bottom: 0px solid #333;
	margin:0;
	padding:0;
}

.headerline2{
	max-height:1px;
	width:  420px;
	border-bottom: thin #999 solid; 
	padding:0;
	margin-left:1px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-left:10px;
}

.logos td{
	border:0px solid #999;
	padding-left:10px;
	padding-right:0px;
	padding-top:0px;
	margin:0;
}


.logos th{
	padding-left:10px;
	border:none;
	margin:0;
	font-size:0.6em;

}


input{
	padding:5px 10px 5px 10px;
	border: 1px solid #BBBBBB;
	background: #fff;
	/* 邊角圓弧化，不同瀏器覧設定不同　*/
    -moz-border-radius:3px; /* Firefox */
	-webkit-border-radius: 3px; /* Safari 和 Chrome*/
	border-radius: 3px; /* Opera 10.5+*/
	width: 200px;
	
	margin-left: 15px;
	font-size:0.8em;
	font-family:Arial, Helvetica, sans-serif;
}


input[type="checkbox"]{
	border: 0 none;
	width: 20px;
	margin-left:0px;
}

input[type="radio"]{
    border: 0 none;
	width: 40px;
}



.listbutton {
	background-color:#F0F0F0;
	border:1px solid #333333;
	display:inline;
	color:#333333;
	font-family:arial;
	font-size:0.8em;
	padding:2px 15px;
	/**padding:2px 5px;
	*height:20px;*/
	width:unset;
	margin-left:0px;
	margin-top:5px;
	text-decoration:none;
}

a.listbuttonHeader {
	background-color: #4267b2;
	border: 1px solid #4267b2;
	border-radius: 2px 3px;
	display: inline;
	color: #fff;
	font-family: arial;
	font-size: 0.9em;
	padding: 4px 15px;
	width: auto;
	text-decoration: none;
}

.button {
    text-decoration:none;
    color:#FFF;
}

.button.buttonXL {
    width:150px !important;
    font-size:1em !important;
}

a.button.listbuttonblue {
	/*	background-color:#14B0E2;*/
	color: white;
	background-color: #016bb5;
	border: 1px solid #b5b5b5;
	display: inline;
	color: #FFF;
	font-family: arial;
	font-size: 0.8em;
	padding: 8px 15px;
	*padding: 6px 2px;
	width: auto;
	*height: 30px;
	text-decoration: none;
}

a.button.listbuttonorange {
	/*	background-color:#14B0E2;*/
	color: white;
	background-color: #FA6900;
	border: 1px solid #CA3900;
	display: inline;
	color: #FFF;
	font-family: arial;
	font-size: 0.8em;
	padding: 8px 15px;
	*padding: 6px 2px;
	width: auto;
	*height: 30px;
	text-decoration: none;
}


.details_button .listbuttondetail {
	background-color:#F0F0F0;
	border:1px solid #333333;
	color:#333333;
	margin-top:10px;
	width:auto;
	font-family:arial;
	font-size:0.8em;
	padding:2px 15px;
	*padding:2px 5px;
	*height:20px;
}


.listbuttonnomargin {
margin-left:0px;
width:auto;

}


.listbuttonL {
	background-color:#F38630;
	border:1px solid #b5b5b5;
	display:inline;
	color:#ffffff;
	font-family: "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體", Arial, "MS Serif";
	font-size:1.5em;
	padding: 5px 18px;
	*padding: 5px 2px;
	text-decoration:none;
	
}

	.listbuttonL.ml {
		margin-left: 15px;
	}

	.listbuttonXL.grey {
		background-color: #AAA;
		color: #fff;
	}

.listbuttonXL {

	background-color:#F38630;
	border:1px solid #b5b5b5;
	display:inline;
	color:#ffffff;
	font-family: "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體", Arial, "MS Serif";
	font-size:1.5em;
	padding:5px 50px 5px 50px;	
	text-decoration:none;
	width:unset;
	margin-left:0px;
	margin-top: 15px;
}

.listbutton:hover,.listbuttonL:hover ,.listbuttonXL:hover,.listbuttonnomargin:hover,.details_button .listbuttondetail:hover{
	background-color:#FA6900;
	color:#ffffff;

	position:relative;
	top:1px;

	*position:inherit;
	*top:auto;
}


.listbuttonblue:hover{
	background-color:#1197C4;
	color:#ffffff;
	position:relative;
	top:1px;
	*position:inherit;
	*top:auto;	
}

.listbuttonorange:hover{
	background-color:#FA6900;
	color:#ffffff;
	position:relative;
	top:1px;
	*position:inherit;
	*top:auto;

	
}



/**.listbutton:active,.listbuttonL:active ,.listbuttonXL:active{
	position:relative;
	top:1px;
}**/


#yjdcover{
	padding-bottom:20px;
}
/**** Progress Bar ****/
.lds-ring {
	display: inline-block;
	position: relative;
	width: 80px;
	height: 80px;
}

	.lds-ring div {
		box-sizing: border-box;
		display: block;
		position: absolute;
		width: 64px;
		height: 64px;
		margin: 8px;
		border: 8px solid #fff;
		border-radius: 50%;
		animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
		border-color: #fff transparent transparent transparent;
	}

		.lds-ring div:nth-child(1) {
			animation-delay: -0.45s;
		}

		.lds-ring div:nth-child(2) {
			animation-delay: -0.3s;
		}

		.lds-ring div:nth-child(3) {
			animation-delay: -0.15s;
		}

@keyframes lds-ring {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}


h3.sectiontitle {
	font-size: 17px;
	font-weight: 700;
	color: black;
	padding:0px;
	margin:0px;
}

.newswrapper {
	margin-top: 10px;
	margin-bottom: 15px;
	margin-right:10px;
}



.newsitem {
	background-color: white;
	width: 100%;
	border: solid #2e7de9 1px; /*dark oranage*/
	border-radius: 12px;
	margin-bottom: 20px;
	padding: 15px;
	padding-top: 35px;
	line-height: 1.2em;
	font-size: 17px;
	box-sizing: border-box;
	position: relative;
}

	.newsitem .newsbadge {
		position: absolute;
		top: -4px;
		left: 30px;
		width: 40px;
	}

	.newsitem .newsname {
		color: #2e7de9;
		font-weight: 700;
		margin-bottom: 7px;
		text-align: center;
	}

	.newsitem .newsshort {
		margin-bottom: 5px;
		font-size: 15px;
	}

		.newsitem .newsshort.abs {
			padding-left: 15px;
			padding-right: 15px;
			position: absolute;
			left: 0;
			z-index: 50;
			background-color: white;
		}

	.newsitem .newscontent {
		margin-bottom: 5px;
		font-size: 15px;
	}

	.newsitem .newsdate {
		position: absolute;
		top: 5px;
		right: 15px;
		background-color: #2e7de9;
		color: white;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 11px;
		padding: 3px;
		width: 100px;
		border-radius: 5px;
	}
	.newsitem .newsshowbtn {
		text-align: center;
	}
	
	.newsitem .showhidebutton {
		text-align: center;
		margin-top: 10px;
	}

	.newsitem .newsshowbtn a {
		text-decoration: none;
		color: #25A6E1;
	}

	/*** Swiper Customization ***/
.swiper-button-next::after, .swiper-button-prev::after {
	content: "" !important;
	
}
.swiper-button-next, .swiper-button-prev{
	border:solid 1px #ddd;
	border-radius:50%;
	width:30px !important;
	height:30px !important;
	display:flex;
	justify-content:center;
	align-items:center;
}


	.swiper-button-next:hover, .swiper-button-prev:hover {
		box-shadow: rgba(100, 100, 111, 0.2) 0px 3px 14px 0px;
	}


.swiper-button-next i, .swiper-button-prev i {
	font-size: 14px;
	color: #444;
}


	/*** Course Cat Card*/
/*** College Catd ****/
/****** College Card *******/
.collegecardcontainer {
	/*/justify-content: center;*/
}

	.collegecardcontainer .collegecard {
		border-radius: 15px;
		width: 45%;
		margin-top: 15px;
		margin-bottom: 15px;
		margin-right: 3%;
		overflow: hidden;
		/*border:solid 1px #ddd;*/
		display: flex;
		flex-direction: column;
		background-color: #fff;
		border: solid 1px rgba(0, 0, 0, 0.1);
	}
		.collegecardcontainer .collegecard:hover {
			box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
			transform: translateY(-6px);
			transition: ease-in-out 0.2s;
		}

		.collegecardcontainer .collegecard .collegebanner {
			width: 100%;
			/*min-height: 125px;*/
		}

		.collegecardcontainer .collegecard .collegename {
			min-height: 35px;
			font-weight: 700;
			display: flex;
			justify-content: center;
			align-items: center;
		}




.floatingchat {
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 9999;
}

.chatbutton {
	background-color: #0ed81f;
	color: white;
	width: 70px;
	height: 70px;
	border-radius: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 38px;
}

	.chatbutton:hover {
		background-color:#07ec22;
	}
	.chatbutton a {
		color:white;
	}
	/****** Course Cat Card ******/
	.coursecatcontainer, .collegecardcontainer {
	display: flex;
	flex-wrap: wrap;
	background-color: #f7f7f7;
	position: relative;
}

	.coursecatcontainer a{
		text-decoration:none;
	}

	.coursecatcontainer.transparent, .collegecardcontainer.transparent {
		background-color: transparent;
	}

	.coursecatcontainer.nopadding {
		padding-left: 0px;
		padding-right: 0px;
		padding-bottom: 0px;
		padding-top: 15px;
	}

	.coursecatcontainer .coursecatcard {
		border-radius: 15px;
		width: 28%;
		margin-right: 2%;
		margin-left: 2%;
		margin-top: 15px;
		margin-bottom: 15px;
		overflow: hidden;
		/*border:solid 1px #ddd;*/
		min-height: 215px;
		display: flex;
		flex-direction: column;
		background-color: #fff;
		border: solid 1px rgba(0, 0, 0, 0.1) ;		
	}

		.coursecatcontainer .coursecatcard:hover {
			box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
			transform:translateY(-6px);
			transition:ease-in-out 0.2s;
		}

	.coursecatcontainer .myCatSwiper .coursecatcard {
		border-radius: 15px;
		margin-right: 0;
		margin-left: 0;
		margin-top: 0;
		margin-bottom: 0;
		overflow: hidden;
		/*border:solid 1px #ddd;*/
		width: 27%;
		min-height: 200px;
		display: flex;
		flex-direction: column;
		background-color: #fff;
		
	}

		.coursecatcontainer .myCatSwiper .coursecatcard:hover {
			box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
			transform: translateY(-1px);
		}

		@media (max-width:800px) {
		}

		.coursecatcontainer .myCatSwiper .coursecatcard.swiper-slide{
			height:98%;
		}

		.coursecatcontainer .coursecatcard .catimage {
			width: 100%;
		}

	.coursecatcontainer .coursecatcard .catcontent {
		min-height: 115px;
		padding: 15px;
	}

		.coursecatcontainer .coursecatcard .catcontent p {
			line-height: 1.1em;
			font-weight: 700;
		}

			.coursecatcontainer .coursecatcard .catcontent p.cattitle {
				font-size: 12px;
				color: #bbbaba;
				margin-bottom: 7px;
			}


			.coursecatcontainer .coursecatcard .catcontent p.catname {
				font-size: 15px;
				color: black;
				margin-bottom: 5px;
			}

			.coursecatcontainer .coursecatcard .catcontent p.catremark {
				font-size: 15px;
				color: #0caa93; /*light orange*/
				margin-bottom: 0px;
			}

.catcontent .catremark span {
	color: #bbbaba;
}


























.miniflyer_pop
{
	border: 1px #666 solid;
	display: block;

	position: relative;
	z-index:1010;
	background-color: #FFF;
	overflow:auto;
}










.news-wrapper {
	width: 65%;
}







.cart_content_pop {
	/*border: 1px #666 solid;*/
	/*/padding: 20px;*/
	display: block;
	min-height:400px;
	max-height: 90%;
	position: relative;
	z-index: 1010;
	/*background-color: #FFF;*/
	width: 100%;
	overflow: auto;
}
.news_content_pop
{
	border: 1px #666 solid;
	padding: 20px;
	display: block;
	
	height: 480px;
	
	position: relative;
	z-index:1010;
	background-color: #FFF;
	width: 620px;
	
	left: -310px;
	top: -260px;

	 *top: -270px;
	*height:500px;
		
	overflow:auto;
}

    .news_content_pop.large {
        height: 550px;
        top: -280px;
    }

.compare_course {
	height: 430px;
	overflow: auto;
}

.compare_course table {
	border-collapse:collapse;
	margin-left:12px;
	min-height:410px;

   
}
.compare_course td{
	text-align: left;
	border-left: solid 1px #666;
	padding:3px;
	vertical-align:top;
	

}

.compare_course th{
	text-align: left;
	font-weight:normal;
	padding:3px;
	vertical-align:top;
	width:85px;
	min-width:85px;
	padding:3px;
}

input.removecompare{
	border:none;
}

.detail_content {
	height: 330px;
	overflow: auto;
}

.individual_course_detail {
	height: 370px;
	overflow: auto;
	padding-left:15px;
}

	.individual_course_detail table
	{
		margin-top:10px;	
	
	}

.individual_course_detail table tr td:first-child
{
	color:#016bb5;
}


	.individual_course_detail table tr td.coursetext
	{
		color:#333;
	}

	

.centerpoint {
	z-index:1011;
    top: 50%;
    left: 50%;
    position: fixed;
}


/** Course Details */

.centerpopup {
	border-radius: 10px;
	max-height: 90%;
	width: 100%;
	max-width: 800px;
	position: fixed;
	z-index: 1010;
	left: 50%;
	top: calc(50% + 20px);
	transform: translate(-50%, -50%);
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	padding: 10px;
	background-color: #f7f7f7;
	border: solid 1px #666;
	display: flex;
	flex-flow: column;
}

.centerpopup.centerpopup2 {
	max-height: 80%;
	max-width: 600px;
	padding:20px;
}

	.right-arrow-move {
	-webkit-animation: right-move 1500ms infinite;
	-moz-animation: right-move 1500ms infinite;
	-o-animation: right-move 1500ms infinite;
	animation: right-move 1500ms infinite;
}

@keyframes right-move {
	0% {
		transform: translate(0, 0);
	}

	50% {
		transform: translate(0, 0);
	}

	80% {
		transform: translate(3px,0);
	}

	100% {
		transform: translate(0,0);
	}
}


	.centerpopup .container {
		scroll-behavior: smooth !important;
		-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0) !important;
		overflow-y: auto;
		width: 100%;
		flex-grow: 1;
		background-color: #f7f7f7;
	}

	.centerpopup .container::-webkit-scrollbar {
		width: 0.5em !important;
		scroll-behavior: smooth !important;
	}

	.centerpopup .container::-webkit-scrollbar-track {
		-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0) !important;
	}

	.centerpopup .container::-webkit-scrollbar-thumb {
		background-color: darkgrey !important;
		outline: 1px solid slategrey !important;
		border-radius: 15px !important;
	}

.coursesearchcontent, .coursedetailcontent {
	z-index: 10;
	padding: 15px;
	padding-top: 20px;
	background-color: #f7f7f7;
}

.centerpopup .container a{
	text-decoration:none;
	cursor:pointer;
	color:#188BC0;
}

.individual_course_details {
	padding-left: 10px;
	padding-right: 10px;
}

.individual_course_details {
	font-size: 0.9em;
}

	.individual_course_details .sectionfeature {
		font-weight: 700;
		margin-top: 10px;
	}

	.individual_course_details .iconinfo {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		margin-top: 5px;
		margin-bottom: 5px;
	}

		.individual_course_details .iconinfo > div {
			width: 50%;
			display: flex;
			flex-direction: row;
			align-items: center;
		}

		.individual_course_details .iconinfo div.iconholder {
			margin-right: 10px;
			color: #0caa93;
			display: flex;
			align-items: center;
			justify-content: center;
			width: 25px;
			height: 25px;
		}

			.individual_course_details .iconinfo div.iconholder svg {
				height: 14px;
			}

			.individual_course_details .iconinfo div.iconholder.larger svg {
				height: 19px;
			}

			.individual_course_details .iconinfo div.iconholder i {
				font-size: 19px;
			}

	.individual_course_details .recommendation {
		font-size: 0.9em;
		padding: 15px 15px 25px 15px;
		border: 1px solid #aaa;
		border-radius: 10px;
		margin-top: 25px;
		margin-bottom: 15px;
		position:relative;
	}

		.individual_course_details .recommendation .title {
			position: absolute;
			top: -10px;
			left: 0px;
			color: #555;
			font-weight: 700;
			border: 1px solid #ddd;
			border-radius: 2px;
			background-color: #f7f7f7;
			padding: 1px 15px 1px 15px;
			line-height: 1em;
		}

			.individual_course_details .recommendation .title i {
				position: absolute;
				left: -8px;
				top: -10px;
				font-size: 19px;
				color: #ffbe09;
			}

			.individual_course_details .recommendation .title .triangleholder {
				position: absolute;
				background-color: white;
				width: 10px;
				height: 8px;
				right: 0px;
				bottom: 0px;
				overflow: hidden;
				border-top-left-radius: 3px;
			}

			.individual_course_details .recommendation .title .triangle {
				width: 0;
				height: 0;
				border-width: 8px 10px 0 0;
				border-color: #0caa93 transparent transparent transparent;
				border-style: solid;
			}


		.individual_course_details .recommendation .recommendedcombo {
			color: #0caa93;
			text-align: center;
			font-weight: 700;
			padding: 0px 10px 5px 0px;
			margin-top: 5px;
			margin-bottom: 5px;
			font-size: 1.05em;
		}

		.individual_course_details .recommendation .recommendedtext {
			font-size: 0.93em;
		}

	.individual_course_details .remarkinfo {
		background-color: #f7f7f7;
		font-size: 0.85em;
		padding: 10px;
		border-radius: 5px;
		margin-bottom: 15px;
	}

.btn_back {
	font-size: 0.9em;
}



/*
.coursesearchcontent  h2,
.coursedetailcontent  h1,.coursedetailcontent  h2,.coursedetailcontent  h3,.coursedetailcontent  h4,.coursedetailcontent  h5
{
		padding-left:10px;
}
*/
.coursedetailcontent ul {
	list-style: none;
}

	.coursedetailcontent ul li {
		list-style: none;
	}

.coursedetailcontent table {
	margin: 2px;
}


/***** Course Details Basic Info***/

.courseheadcontainer {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 15px;
}

.coursebasicinfo {
	display: flex;
	flex-direction: column;
	align-items: center;
}

	.coursebasicinfo .coursetype {
		font-size: 0.7em;
		color: #0caa93;
		margin-bottom: 2px;
	}

	.coursebasicinfo .institute {
		font-size: 0.8em;
	}

	.coursebasicinfo .coursename {
		font-weight: 700;
		font-size: 20px;
	}

	.coursebasicinfo .addbutton {
		font-size: 0.9em;
		font-weight: bold;
		margin-top: 6px;
	}


/*** Course Indicator ***/
.courseindicatorcontainer {
	padding-bottom: 20px;
	padding-left: 10px;
	padding-right: 10px;
}

.indicator_wrapper {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.indicator {
	border-radius: 10px;
	width: 31%;
	border: 1.5px solid #2e9ce9;
	background-color: white;
	color: black;
	line-height: 1em;
	min-height: 170px;
	display: flex;
	align-items: center;
	flex-direction: column;
	font-size: 0.85em;
	padding: 10px 5px 10px 5px;
}

	.indicator div:first-child {
		font-size: 40px;
		font-weight: 700;
		line-height: 42px;
		margin-bottom: 2px;
	}

	.indicator div:nth-child(2) {
		color: #0caa93;
		font-weight: 700;
		margin-bottom: 10px;
	}

	.indicator div:nth-child(3) {
		line-height: 1.3em;
	}

	.indicator.onehalf {
		width: 48%;
	}

/****Course Info ***/
.individual_course_details {
}







/*** Location Select **/
.locations_container, .cc_container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 15px;
}

.locations_container a.location_item , .cc_container a.cc_item{
	color:black;
}

	.locations_container .location_item, .cc_container .cc_item {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-bottom: 10px;
		padding: 6px;
	}

	.locations_container .location_item {
		border: solid 1px #666;
		border-radius: 15px;
		width: 47%;
		color: black;
		line-height: 1em;
	}

		.locations_container .location_item.active, .cc_container .cc_item.active {
			border-color: #2e9ce9;
			border: solid 1.5px #2e9ce9;
		}


		.locations_container .location_item div:first-child {
			font-size: 9px;
		}

		.locations_container .location_item div:nth-child(2) {
			font-size: 13px;
			color: #0caa93;
			font-weight: 700;
		}

		.locations_container .location_item div:nth-child(3) {
			line-height:1em;
			font-size: 20px;
			font-weight: 700;
			margin-top: 4px;
			margin-bottom: 6px;
			text-align:center;
		}

		.locations_container .location_item div:nth-child(4) {
			font-size: 12px;
			color: #0caa93;
			font-weight: 700;
		}

		.locations_container .location_item div:nth-child(5) {
			font-size: 11px;
		}

	/** COMBO */



.locationinfo h3.sectiontitle, .ccinfo h3.sectiontitle {
	color: #DEDEDE;
}

.locationinfo.active h3.sectiontitle, .ccinfo.active h3.sectiontitle {
	color: black;
}

.locationinfo .sectionfeature, .ccinfo .sectionfeature {
	margin-top: 5px;
	color: #DEDEDE;
}

.locationinfo.active .sectionfeature, .ccinfo.active .sectionfeature {
	color: #455cdb;
}


	.cc_container .cc_item {
		border: solid 1px #666;
		border-radius: 15px;
		width: 100%;
		color: black;
		line-height: 1em;
	}

.ccinfo {
	min-height: 100px;
	margin-top:20px;
}

	.ccinfo .a_ccremark {
		display: none;
	}

.div_help {
	font-size: 0.8em;
}

.ccinfo.active .a_ccremark {
	display: block;
}

.ccinfo.active + .decoration {
	display: block;
}

.cc_container .cc_item {
	padding-top: 21px;
	padding-bottom: 12px;
}

	.cc_container .cc_item .ribbon {
		position: absolute;
		top: -4px;
		left: 15px;
		width: 40px;
	}

	.cc_container .cc_item div:first-child {
		font-size: 1.1em;
		font-weight: 700;
		margin-bottom: 5px;
	}

.bottombuttonholder {
	
}

.sticky {
	background-color: #fff;
	position: sticky;
	position: -webkit-sticky;
	position: sticky;
	bottom: 0
}

	.cc_container .cc_item div:nth-child(2) {
		font-size: 12px;
		color: transparent;
		text-align: center;
		min-height: 5px;
		height: 5px;
		overflow: hidden;
		opacity: 0;
		max-height: 5px;
		transition: opacity 0.8s ease-in-out, max-height 1s ease-in-out, min-height 1s ease-in-out;
	}

	.cc_container .cc_item.active div:nth-child(2) {
		height: auto;
		opacity: 1;
		color: #555;
		max-height: 200px;
	}




	/*** End Course Details ***/




.news_content_pop ul, .cart_content_pop ul
{   list-style: none;
	display: block;
	font-size:0.8em;
	color:#3b3b3d;
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif"; 
}

.enrollform_step1 ul{
	list-style:none;
}


.enrollform_step1{
	min-height:400px;
}

.course_add {
	margin-top:20px;
}
.buttoncontainer{
	margin-left:15px;
}
/*
.course_add {
	font-size:0.8em;
	font-family: Arial,  "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif";
	padding-left:15px;
	margin:0; 
	text-align:left;
}

.course_add ul {
	margin:3px;
	padding:0;

}

.course_add li {
	padding:3px;
	width:220px;
	display:block;
	float:left;
}
	*/
.course_list li {
	padding: 3px;
	/*	width:220px;*/
	display: block;
	/*	float:left;*/
}

.courselist {
	text-align:left;
	display:block;
	white-space:nowrap;
	width:100%;
}

.sqwarn {
	display:block;
	padding-top:20px;
	width:440px;
	text-align:left;
	padding-bottom:10px;
	}

.sqrightflow {
	position: relative;
	float:right;}



.studentmenu,.studentmenu_logged{
	margin-top:10px;
	width:200px;
	font-size:0.8em;
	font-family: Arial,"微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif";
	color:#000;
	padding:1px;
}


div.downloadpanel 
{
    /*width: 195px;*/
	width:100%;
    display:none;
}

div.downloadbou
{
	width:100%;
	/*height:195px;*/
	border:#DEDEDE 1px solid;
	/*border-radius:8px 8px 8px 8px;*/
	overflow:hidden;
}

.studentmenu a.coursecountlink
{
	font-weight:900;
	text-decoration:none;
	font-size:1.1em;
}
.studentmenu a.coursecountlink span.star
{
	color:#ef1;
}
.studentmenu a
{
	color:#fff;
}

 .studentmenu_logged a
{
	color:#202;
}



.studentmenu ul,.studentmenu_logged ul {
	list-style:none;
	text-decoration:none;
	padding:0;
	margin:0;
	}



.studentmenu li.last-child{
	padding-top:15px;
	padding-bottom:15px;


	background:url("../publicimages/student_grey_bg_05.png");
 
	border-radius:0px 0px 8px 8px;
	/*border-bottom:#01A03A 1px solid; 2014 color*/
	/*border-bottom:#e4631d 1px solid; 2015 color*/
	border-bottom:#472F91 1px solid;
}

.studentmenu li{
	width:194px;
	padding-bottom:10px;
	
	/*border-left: #01A03A 1px solid; 2014 color*/
	/*border-right:#01A03A 1px solid; 2014 color*/
	
	background:url("../publicimages/studentmenu_2018_02.jpg") repeat-y;
	text-align:center;

	/*border-left: #e4631d 1px solid; 2015 color*/
	/*border-right:#e4631d 1px solid; 2015 color*/
	border-left: #472F91 1px solid;
	border-right:#472F91 1px solid;
}


.studentmenu li:first-child{
	padding-top:0;
	padding-bottom:0;
	border-radius:8px 8px 0px 0px;
	/*border-top:#01A03A 1px solid; 2014 color*/
	/*border-top:#e4631d 1px solid; 2015 color*/
	border-top:#472F91 1px solid;
	color:#fff;
	font-size:1.3em;
	font-weight:bold;
	overflow:hidden;		
	}


	 .studentmenu li:first-child div
	{
	    padding-bottom:10px;
		padding-top:12px;
		background:url("../publicimages/studentmenu_2018_03.jpg") ;
		
		/*background:url("../publicimages/student_green_bg_03.png") ; 2014 color*/
	}

input.sqapply {
	width:150px;
	padding:10px;
	font-size:1.2em;
	font-family: "微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體", Arial, "MS Serif";
	background-color:#ff7266;
	/*background-color:#01A03A;*/
	/*background-color:#f37db1;*/
	border:1px solid #CCC;
	border-radius:5px 5px 5px 5px;
	margin:0;
	text-decoration:none;
	/*color:#26221E;*/
	color:white;
	height:auto;
}	
	
input.sqapply:hover {
	background-color:#FA6900;
	/*background-color:#c71489 ;*/
	color:#fefefe;
	position:relative;
	top:1px;
	
}

.mypage_index{
	min-width:600px;
	margin:0;
	padding:0;	
}
.mypage_index ul{

	list-style:none;
	display:inline;
	padding:0px;
	margin-left:15px;
}
.mypage_index li{
	width:100%;
	padding:5px;
	margin:15px;
	color:#333;
	text-align:left;
/*	float:left;*/
}

.mypage_index li.infoheader{
	width:100%;
	padding:5px;
	margin:15px;
	border-left: #6CF 1px solid;
	border-bottom: #6CF 1px solid;
	background:#fff url(publicimages/img01.png) repeat;
	color:#333;
	text-align:left;
/*	float:left; */
}



.mypage_content ul{
		padding:0;
	margin:0;
	width:100%
/*	float:left;*/
}

.mypage_content li{
	margin:0;
	font-size:1em;
	padding-left:10px;
	padding-top:5px;
	padding-bottom:5px;
	border:none;
	background:none;
	color:#333;
	width:100%;
}

.notice_content{
	margin-left:25px;
	font-size:1em;
	font-weight:normal;
	padding-top:5px;
	padding-bottom:5px;
	border:none;
}
.notice_title{
	max-width:550px;
	width:auto;
	float:left;}
.notice_date{

	width:150px;
	float:right;}
.notice_from{
	
	width:120px;
	margin-left:5px;
	margin-right:10px;
	float:right;}
	
/**ff7266 ffada2 8ed048 badf75 66b4e2 acddfb ffd165 ffd678 fefefe**/




.studentmenu_logged li{
	padding-top:12px;
	width:194px;
	padding-bottom:10px;
	border-left:#029DC4 1px solid;
	border-right:#029DC4 1px solid;
	text-align:center;
}

.studentmenu_logged li:first-child{

	border-radius:8px 8px 0px 0px;
	border-top:#029DC4 1px solid;
	color:#333;
	font-size:1.2em;
	font-weight:bold;
	/*background-color:#acddfb;*/
	background-image:url("../publicimages/studentmenu_blue_03.png");
}

.studentmenu_logged li.last-child{
	padding-bottom:12px;
	border-radius:0px 0px 8px 8px;
	border-bottom:#029DC4 1px solid;
}

.studentmenu_comparelist {
	padding-top:12px;
	width:194px;
	padding-bottom:10px;
	border-left:#029DC4 1px solid;
	border-right:#029DC4 1px solid;
	text-align:center;
}




.sqcourselist_search{
	list-style:none;
	padding:0;

}


.sqcourselist_search li {
	padding:3px;
	 display:block;
	min-width:110px;

}

.sqcourselist_search input {
	margin-left:0;

}




.formtable_confirm td, .formtable_confirm th {
	font-size: 0.9em;
	padding-top: 3px;
	padding-bottom: 3px;

	text-align: left;
	font-family: "Adobe 黑体 Std R", "微軟正黑體", "新細明體", "細明體", Arial, "MS Serif";
	line-height: 1em;
	border: none;
	margin: 0;
	font-weight: normal;
}

.formtable_confirm td {
	color: black;
}

.formtable_confirm th{
	color:#036;
	
	}


.sq_go_back {
	padding-left:15px;
}

.locationsel_wrapper
{
	margin-top:10px;
}
/* Location Selector Wrapper*/
.locationsel_wrapper .loc_code {
	font-size: 10px;
}


.locationsel_wrapper .loc_add {
	font-size: 20px;
}


.locationsel_wrapper .btn {
	transition:0.25s ease-in-out; -webkit-transition: 0.25s ease-in-out all; -moz-transition: 0.25s ease-in-out all; -o-transition: 0.25s ease-in-out all;
}

.locationsel_wrapper .btn::before {
	transition:0.25s ease-in-out; -webkit-transition: 0.25s ease-in-out all; -moz-transition: 0.25s ease-in-out all; -o-transition: 0.25s ease-in-out all;
}

.locationsel_wrapper .btn::after {
	transition:0.25s ease-in-out; -webkit-transition: 0.25s ease-in-out all; -moz-transition: 0.25s ease-in-out all; -o-transition: 0.25s ease-in-out all;
}

.locationsel_wrapper .btn-loc:hover {
	background-color: rgb(0,153,204);
	font: #ffffff;
}






.locationsel_wrapper  a:hover  .btn-loc{
	color: #ffffff;
	text-decoration: none;
}




.locationsel_wrapper .btn-loc {
	background-color: rgb(255, 255,255);
	border-style:dashed;	
	border-width:1px;
	border-color:rgb(104, 181, 230);
	padding: 12px 12px;		
	border-radius: 0px; 
	 
	font-size: 14px; font-weight: 700; -webkit-border-radius: 0; -moz-border-radius: 0;
	font-weight: 700;
	margin:0;
	
}
.locationsel_wrapper .btn-loc.active {
	background-color: rgb(255,51,102);
	color: #ffffff;
}
.locationsel_wrapper .size {
	height:auto;
	width:auto;
	min-width:45px;
	margin:0;

}



/* Second Filter Wrapper */
.secondfilter_wrapper
{
	border-top:solid;border-bottom:solid;border-color:lightgray;border-width:1px; 
	margin:15px 15px 15px 15px;
}

.topmost
{
	background-color:red;
	z-index:9999;
}

.secondfilter_wrapper > div
{
	float:left;
}
.secondfilter_wrapper > div:first-child
{
	margin-right:7px;
}

.secondfilter_wrapper > div
{
	
	border:none;
}

.secondfilter_wrapper > div.textmiddle
{

	line-height:50px;
}

.secondfilter_wrapper > div input
{
	background:none;
	border:0;
	margin-left:0px;
}


.secondfilter_wrapper > div.collegeicon:hover
{	
	-webkit-box-shadow: inset 0px 0px 0px 1px grey;
	-moz-box-shadow: inset 0px 0px 0px 1px grey;
	box-shadow: inset 0px 0px 0px 1px grey;		
}


.secondfilter_wrapper > div.collegeicon.active
{		
		-webkit-box-shadow: inset 0px 0px 0px 1px green;
		-moz-box-shadow: inset 0px 0px 0px 1px green;
		box-shadow: inset 0px 0px 0px 1px green;		
}


.secondfilter_wrapper > div:last-child
{
	float:none;
	clear:both;

}

/* Second Filter End */

.course_arrange{
	vertical-align:bottom;
}

#register10 .course_arrange li {
	display: inline;
	font-size: 0.9em;
	padding-left:15px;
}

#register10 .sqcourse_rank{
	color:#036;
	margin-left:-15px;

	font-size:0.9em;
}


/** Course Cart List **/
/*** Course Cart ***/

.menucartlist .cartitemcontainer{
	font-size:1.2em;
}
.cartitemcontainer {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-left: 15px;
	padding-right: 15px;
}

	.cartitemcontainer .courseitem {
		position:relative;
		background-color:white;
		width: 100%;
		border: solid 1px #444;
		border-radius: 15px;
		margin-bottom: 10px;
		display: flex;
		flex-direction: row;
	}

		.cartitemcontainer .courseitem > div:first-child {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 20px;
			padding-left: 5px;
			flex-shrink:0;
		}

.course_container.cartitemcontainer .courseitem > div:first-child {
	width: 10px;
}

.cartitemcontainer .courseitem > div:nth-child(2) {
	display: flex;
	flex-direction: column;
	padding: 6px;
	flex-grow: 1;
	justify-content: flex-start;
}

.cartitemcontainer .courseitem .coursecode {
	font-size: 0.7em;
}

.cartitemcontainer .courseitem .coursetitle {
	font-size: 1em;
	color: #2e7de9;
	font-weight: 700;
}

.cartitemcontainer .courseitem .courseschool {
	font-size: 0.7em;
}

.cartitemcontainer .courseitem .coursecc {
	font-size: 0.8em;
	color: #0caa93; /*light yellow*/
	font-weight: 500;
}


.cartitemcontainer .courseitem > div:last-child {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 35px;
	padding-right: 15px;
	flex-shrink:0;
}


.course_container.cartitemcontainer .courseitem {
	padding-top: 5px;
	padding-bottom: 5px;
}

	.course_container.cartitemcontainer .courseitem .ribbon {
		position: absolute;
		top: -4px;
		right: 30px;
		width: 40px;
	}

.cartitemcontainer .courseitem > div:last-child a {
	color: black;
}

.courseitemthumbnail {
	overflow: hidden;
	border-radius: 5px;
	flex-shrink: 0;
	position: relative;
}


div.courseitemthumbnail {
	margin-right: 10px;
	background-color: #aaa;
	width: 65px;
	height: 65px;
}

	div.courseitemthumbnail img {
		width: 100%;
	}

	div.courseitemthumbnail div.thumblogo {
		position: absolute;
		bottom: 0px;
		left: 0px;
		border: none;
		border-width: 1px;
		height: 30px;
		background-color: white;
		opacity: 0.85;
		width: 100%;
	}

		div.courseitemthumbnail div.thumblogo img {
			height: 30px;
			width: auto;
		}




.msgholder {
	width:100%;
	display: flex;
	flex-direction: column;
	align-items:center;
	color:#339e00;
}
	.msgholder > i {
		font-size:60px;
	}
	.msgholder.warning {
		color:#fe6207;
	}
	.msgholder.info {
		color:#0070be;
	}
	.msgholder.hints {
		color:#016BB5;
	}
		/*** End Course List */
		/*** Arranger Special */
		.course_arrange_container.cartitemcontainer {
	
	margin-top: 10px;
}

	.course_arrange_container.cartitemcontainer .courseitem.active {
		border-color: #fe5900 !important;
	}

		.course_arrange_container.cartitemcontainer .courseitem.active .coursecode {
			color: #fe5900;
		}

		.course_arrange_container.cartitemcontainer .courseitem.active .coursetitle {
			color: #fe5900;
		}

		.course_arrange_container.cartitemcontainer .courseitem.active .coursecc {
			color: #fe5900;
		}

		.course_arrange_container.cartitemcontainer .courseitem.active .sqcourse_rank {
			color: #fe5900;
		}




	.course_arrange_container.cartitemcontainer .courseitem.arrange_item_1 {
		border: solid 1.5px black;
	}

		.course_arrange_container.cartitemcontainer .courseitem.arrange_item_1 .sqcourse_rank {
			font-weight: 700;
		}

	.course_arrange_container.cartitemcontainer .courseitem > div:first-child {
		width: 40px;
		font-size: 0.8em;
		flex-shrink:0;
	}

	.course_arrange_container.cartitemcontainer .courseitem > div:last-child {
		padding-right: 0px;
		flex-direction: column;
	}

		.course_arrange_container.cartitemcontainer .courseitem > div:last-child div {
			display: flex;
			justify-content: center;
			align-items: center;
		}

	.course_arrange_container.cartitemcontainer .courseitem .coursecc {
		color: #666;
	}

	.course_arrange_container.cartitemcontainer .courseitem .coursetitle {
		font-size: 0.9em;
		color: black;
	}



	/*
	.course_arrange_item:hover {
	height: 1.6em;
	background-color: #AAD2EE;
}

.course_arrange_item ul{
	list-style:none;
	vertical-align:bottom;
	padding:0;
	margin-left:15px;
	
}

.course_arrange_item li.sqcourse_rank{
	width:70px;
	float:left;
	color:#F60;
	font-weight:bold;
	font-size:0.9em;

}

.course_arrange_item li{
	width:70%;
	float:left;
	color:#444;
	font-size:0.9em;
	padding: 4px;
}


.course_arrange_item.arrange_item_1 li.sqcourse_rank, .course_arrange_item.arrange_item_1 li
{
	font-size:1em;
	font-weight:bold;
}

.course_arrange_item.arrange_item_1 li.sqcourse_rank
{
	color:#F60;	
}

.course_arrange_item.arrange_item_1 li
{
	color: #000;
}



.course_arrange_item li.squp_downbtn, .course_arrange_item li.squp_upbtn{
	width:25px;
	float:left;
}

.course_arrange_item li.squp_downbtn a:hover,.course_arrange_item li.squp_upbtn a:hover{
	position:relative;
	top:1px;
}
*/

.primarytext {
	color: #0caa93;
}

#register5 div.enrollform_step1 table.formtable td input, #register10 div.enrollform_step1 table.formtable td input{
	margin-left: 0px;
	}

table.formtable_confirm.sqformtable
{
	width:100%;
}
#register5, #register6, #register7, #register10, #register11, #register12,#register3,#register4 {
	padding-top: 30px;
	margin-bottom: 20px;
}

#register10 h3{
	margin-bottom:5px;
}


.wapperbackgroundouter {
	margin: 0px;
	padding: 0px;
	background: #22222D url(publicimages/img01.png) repeat;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	color: #545454;
}

.headerh2{
	overflow: hidden;
	background:#F6F6F6 url(publicimages/stripes2.png) repeat;
	padding: 0px 15px 0px 0px;
	margin-bottom: 15px;
	margin-left: 15px;
	width:100%;
	min-width:600px;
}

.wapperbackgroundouter_shadow	{
	overflow: hidden;
	width:100%;
	/*margin: 50px auto;*/
	background-color:#5BB542;
	padding:0px 15px 0px 0px;
	box-shadow: 0px 0px 25px 5px rgba(0,0,0,.1);
}
	
.wrapper {
	overflow:hidden;
	width:100%;
	margin-top: 50px auto;
	background: yellow;
	box-shadow: 0px 0px 20px 5px rgba(0,0,0,.2);
}

.headerline{

	width:100%;
	border-bottom: thin #999 solid; 
	padding:0;
	margin: 10px 0;
}

.headerh3{
	font-size:2.5em;
	font-family:  "Trebuchet MS", Arial, Helvetica, sans-serif,"微軟正黑體", "新細明體";
	color: #000;
	letter-spacing: -1px;
	font-weight: 300;
	padding:0;
	margin:0;
}

.headerh4{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif, "微軟正黑體", "新細明體";
	font-weight:200;
	color: #818183;
	padding:0;
	margin:0;
	line-height: 80px;
	letter-spacing: -2px;
	text-align: center;
	text-transform: lowercase;
	font-size: 2.5em;
}
.headerh5{
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif, "微軟正黑體", "新細明體";
	color: #818183;
	padding:0;
	margin:0;
	font-size: 2.5em;
}
.headerh6{
	font-family: Tahoma, Geneva, sans-serif, "微軟正黑體", "新細明體";
	font-weight:200;
	color: #000;
	padding:0;
	margin:0;
	font-size: 1em;
}

 .headerh2#header_topupbar {

/*	background:#1197C4 url(publicimages/img01.png) repeat;*/
	background:#16A796 url(publicimages/img01.png) repeat;
	border-top: #333 1px solid;
	margin-left:15px;
	margin-right:15px;
	margin-bottom: 0px;
	padding: 0px 15px 0px 0px;
	
}


.wapperbackgroundouter_shadow	{
	background-color:#16A796;
	box-shadow: 0px 0px 10px 5px rgba(0,0,0,.2);
}


.menubutton a
{
	display: block;
	padding: 7px 20px 7px 20px;
	letter-spacing: 1px;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
	font-size: 16px;
	font-weight: 300;
	color: #757575;
}

.current_page_item a
{
	background:#25A6E1;
	background:-moz-linear-gradient(top, #25A6E1 0%, #188BC0 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #25A6E1), color-stop(100%, #188BC0));
	background:-webkit-linear-gradient(top, #25A6E1 0%, #188BC0 100%);
	background:-o-linear-gradient(top, #25A6E1 0%, #188BC0 100%);
	background:-ms-linear-gradient(top, #25A6E1 0%, #188BC0 100%);
	background:linear-gradient(top, #25A6E1 0%, #188BC0 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#25A6E1', endColorstr='#188BC0', GradientType=0);
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius:4px;
	border:1px solid #1A87B9;
	color:#fff;
}

.sqouter_contentwarpup{
	width:100%;
	height:auto;
	position:relative;

		padding:0;
		margin:0;
}


.warpcourseup{
	border:none;
	height:auto;
	width:920px;
	float:left;
	/**background-color:#e6e6e6;**/

}


.insitute_intro_border{
	background-color:#D2D2D2;
	
	padding:1px;
	position:relative;
	width:400px;
	height:auto;
	-moz-border-radius:10px 10px 0 0;
	-webkit-border-radius:10px 10px 0 0;
	border-radius: 10px 10px 0 0;
}


.insitute_intro{
	width:400px;
	overflow:hidden;

	margin-top:0px;
 padding:30px;
	float:left;

}

.insitute_intro ul{
	list-style:none;
	padding:0;
	margin:0;
}

.insitute_intro li:first-child{
	
	color:#ffffff;
	font-size:1.5em;
	font-family:"微軟正黑體", "Adobe 黑体 Std R", "新細明體", "細明體", Arial, "MS Serif";
	height:180px;
	/*padding-top:20px;*/
	-moz-border-radius:10px 10px 0 0 ;
	-webkit-border-radius:10px 10px 0 0 ;
	border-radius: 10px 10px 0 0 ;

}

.insitute_intro li{
	background-color:#d2d2d2;
	color:#6d6d6d;
	font-size:0.8em;
	margin:0;
	/*padding:0px 20px;*/
	height:2px;
	overflow:hidden;
}

.insitute_intro li.last-child{
	background-color:#ffffff;
	color:#333;
	font-size:0.8em;
	font-family:"微軟正黑體", "Adobe 黑体 Std R", "新細明體", "細明體", Arial, "MS Serif";
	padding: 0px 20px;
	height:260px;
	
}


.insitute_intro li li{
	padding:0;
	margin:0;
	float:left;
	font-family:"微軟正黑體", "Adobe 黑体 Std R", "新細明體", "細明體", Arial, "MS Serif";
	font-size:0.8em;

}

.insitute_intro li.last-child li.last-child{
	padding:0px 0px 0px 0px;
	height:auto;
}



.insitute_intro li ul{
	padding:0px 0px 0px 0px;
	margin:0;
}

.insitute_intro li div{
	position:relative;
	padding:0;
	bottom:-200px;

}

.insitute_intro li li.sqmorebutton div
	{
		position:relative;
		top:0px;
		bottom:0px;
		margin:0;
		padding-left:16px;
		padding-right:0px;
		padding-top:9px;
		padding-bottom:9px;
		height:36px;
		background-color:#e63e3e;
	}

.insitute_intro li li.sqmorebutton{
	background-color:#e63e3e;
	background-image:none;
	color:#ffffff;
	font-size:1em;
	height:36px;
	width:auto;
	margin:0;
	padding:0;
	-moz-border-radius:5px 0 0 5px ;
	-webkit-border-radius:5px 0 0 5px ;
	border-radius: 5px 0 0 5px ;
	overflow:hidden;

}

.yjbannerwarp{
	border:1px solid #CCC;
float:right;	
width:auto;
height:auto;
padding:0;
margin-top:30px;
}


.yjbannerwarp_horizontal{
	background-color:#fff;
    /*border:1px solid #fff;*/
    border-left:3px solid #fff;
    /*border-bottom:3px solid #472f91;	*/  
    float:left;	
    padding:1px;
    margin:0;
    padding-top:4px;
    box-sizing:border-box;
}


/**
dark purple #723d6a light purple #b194ad  blue #5a75cf
light blue #5da7ee    green #5f9a26 darkgrey #666666  light grey #dfdfdf **/
/* ~~ miscellaneous float/clear classes ~~ */
.fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}


#eventbannerdiv
{
	/*float:left;display:block;position:absolute;*/
	display:block;
	margin: 0 auto;
	width: 1150px;
}


/*

#eventbannerdiv:before
{
	content:'hello';
	position:absolute ;left:-100px;height:100px;width:100px; background-color:red;display:block;
}

#eventbannerdiv:after
{
	content:'hey';
	position:absolute ;top:0px;right:-100px;height:100px;width:100px;background-color:yellow;display:block;
}
*/


/** Application Media Source Table ***/



.mediatable{
	width:100%;
	border:none;
}
	.mediatable td {
		padding: 5px;
		width: 33%;
		border-right: 1px solid #0caa93;
		border-left: none;
		border-bottom: 1px solid #0caa93;
		border: none;
	}

		.mediatable td:first-child {
			padding: 5px;
			width: 33%;
			border-left: 1px solid #0caa93;
			border: none;
		}

.mediatable {
	border-top: 1px solid #0caa93;
	border: none;
}

	.mediatable input, .formtable.sqformtable.education input[type=checkbox], .formtable.sqformtable.education input[type=radio] {
		/*accent-color: #0caa93;*/
	}



	


	.mediasrclist li
	{
		font-size:0.9em;
		float:left;
		width:50%;
	}

	
/** End Media Source Table **/



/*** Search Bar ***/
.buttonInside {
	position: relative;
	/*margin-bottom:10px;*/
	width: 290px;
	display: inline-block;
}



.searchbutton {
	display: inline-block;
	margin-left: 5px;
}


	.searchbutton a {
		font-size: 22px;
		color: #9140e2
	}

.buttonInside input {
	/*height: 40px;*/
	width: 265px;
	padding: 5px;
	margin-left: 10px;
	border: solid 1px #bbb;
	outline: none;
	font-size: 17px;
}

.buttonInside a {
	position: absolute;
	right: 10px;
	top: 9px;
	border: none;
	/*height: 38px;*/
	height: 20px;
	width: 20px;
	/*border-radius: 100%;*/
	color: #666;
	outline: none;
	text-align: center;
	font-weight: bold;
	padding: 2px;
	/*font-size: 22px;*/
	/*line-height: 38px;*/
	line-height: 20px;
	cursor: pointer;
}

/*
button.InsideIconBtn:hover {
	cursor: pointer;
}*/






div.stick {
    margin-top: 0 !important;
    position: fixed;
    top: 30px;
    z-index: 10000;
    border-radius: 0 0 0.5em 0.5em;
}

img.animatednews {
    width:40px;
}

.aligncenter {
    text-align:center;
}

   a.shareicon{
            color:#666; 
            font-size:18px;
            padding-left:10px;
            line-height:25px;
        }

          
                            .sharecontentholder{
                                 position:relative;width:250px; 
                                background-color:white; 
                                padding-left:0px; padding-right:10px; 
                                padding-top:20px; padding-bottom:10px; 
                                border-radius:4px;
                                 border:solid 1px #EEE;box-shadow: 5px 10px 8px #888888;
                            }

          .sharecontentholder a{
                 color:#333;
                text-decoration:none;
          }

          .sharecontentholder a:hover{
                 color:#005850;                                
          }


.sqbutton3 {
	cursor:pointer;
	line-height: 1em;
	font-size: 13px;
	font-weight: 700;
	padding: 5px 14px 4px 14px;
	border: solid 1.5px;
	width: auto;
	margin-left:0px;
}


.button.sqbutton3.tall {
	padding: 15px 20px 15px 20px;
}

	.button.sqbutton3.smtall {
		padding: 10px 20px 10px 20px;
	}
	.sqbutton3.full{
		width:100%;
	}


.sqbutton3.full.orange {
	color: #fff;
	border-color: #ff5900;
	background-color: #ff5900;
	font-weight: 500;
}

		.sqbutton3.full.bgreen {
			color: #fff;
			border-color: #0caa93;
			background-color: #0caa93;
			font-weight: 500;
		}
.sqbutton3.green {
	color: white;
	border-color: rgb(120,210,48);
	background-color: rgb(120,210,48);
	font-weight: 500;	
}

.sqbutton3.grey {
	color: #888;
	border-color: #888;	
	background: none;
	text-shadow: none;
}


.sqbutton3:hover{
	transform:translateY(1px);
	opacity:0.95;
}

.sqbutton3.wide {
	font-size: 15px;
	padding: 8px 120px 7px 120px;
}

.sqbutton3.bgreen {
	color: #0caa93;
	border-color: #0caa93;
	background-color: #fff;
	background: none;
	text-shadow: none;
}

.sqbutton3.bgreen:hover {
	color: #0caa93;
	border-color: #0caa93;
	background-color: #fff;
	background: none;
	text-shadow: none;
}



.sqbutton3.orange {
	color: #ff5900;
	border-color: #ff5900;
	background-color: #fff;
	background: none;
	text-shadow: none;
}


.sqbutton4 {
	width: 100%;
	line-height: 1em;
	font-size: 15px;
	font-weight: 700;
	padding: 12px 14px 12px 14px;
	border: solid 1.5px;
	margin-left:0px;
	cursor:pointer;
}

.sqbutton4:disabled{
	opacity:0.3;
	cursor:default;
}

a.sqbutton3, a.sqbutton4  {
	display:inline-block;
	text-align:center;
	text-decoration: none;
}

	.sqbutton4.sqgreen {
		color: #fff;
		border-color: #0caa93;
		background-color: #0caa93;
		font-weight: 500;
	}


	.sqbutton4.outline.grey {
		color: #666;
		border-color: #666;
		background-color: none;
		background: none !important;
		text-shadow: none;
	}

.sqbutton4.outline.sqblue {
	color: #00acbe;
	border-color: #00acbe;
	background-color: none;
	background: none !important;
	text-shadow: none;
}


.responsive-image {
	width:100%;
}

#mainslider {
	overflow: hidden;
	z-index: 5;
}

.mainbanner-pagination {
	position: absolute;
	bottom: 15px;
	left: 20px;
	margin-bottom: 0px;
	width: 100%;
}

.institutesliderholder{
	visibility:hidden;
}

.institutebanner-pagination {
	position: absolute;
	bottom: 10px;
	left: 50px;
	margin-bottom: 0px;
	width: 100%;
}


	.mainbanner-pagination .swiper-pagination, .institutebanner-pagination .swiper-pagination {
		text-align: left;
	}



	/*** Banner Button Inside */
.bannerbuttonInside {
	position: relative;
	width: 300px;
	display: inline-block;
}


	.bannerbuttonInside input {
		height: 30px;
		border-radius: 15px;
		padding-left: 35px;
		padding-right: 20px;
		width: 100%;
		border: solid 1px #bbb;
		outline: none;
		font-size: 18px;
		margin-left:0px;
	}


		.bannerbuttonInside input::-webkit-input-placeholder {
			font-size: 13px;
		}

		.bannerbuttonInside input::placeholder {
			font-size: 13px;
		}

		.bannerbuttonInside input::-moz-placeholder {
			font-size: 13px;
		}



	.bannerbuttonInside a {
		position: absolute;
		top: 4px;
		border: none;
		height: 28px;
		width: 23px;
		border-radius: 100%;
		color: #666;
		outline: none;
		text-align: center;
		font-weight: bold;
		font-size: 18px;
		line-height: 31px;
	}

		.bannerbuttonInside a.search {
			left: 10px;
		}

		.bannerbuttonInside a.voice {
			right: 15px;
			display:none;
		}


/***** Course Cat Tab ****/
	.tab-container {
		display: flex;
		flex-direction: row;
		margin-right:5%;
		border-bottom: 1.5px solid #ddd;
		padding-top: 10px;
		margin-bottom:15px;
	}

	.tab-container .tabhalf {
		text-align: center;
		width: 50%;
	}

	.tab-container a {
		display: inline-block;
		font-size: 1.3em;
		text-decoration:none;
		line-height: 1em;
		font-weight: 700;
		padding-bottom: 5px;
		padding-left: 13px;
		padding-right: 13px;
		color: black;
	}

		.tab-container a:hover{
			color:#0066ff;
		}

		.tab-container div.active a {
			border-bottom: 1.5px solid #2e9ce9;
		}



.sqfeaturecontent {
	width: 1150px;
	margin: 0 auto;
	height: 60px;
	align-items: center;
	justify-content:center;
	position: relative;
	display: flex;
}

.applicationlogoholder {
	display:none;
	/*display: flex;*/
	padding: 15px;
	justify-content: center;
	align-items: center;
	border-bottom: solid 1px #dedede;
}
/** Progress Bar **/
.account_progressholder {
	background-color: #f7f7f7;
	/*width: 100%;*/
	height: 60px;
	border-bottom: solid 1px #999;
}

.progressbar {
	font-size: 16px;
	line-height: 1em;
	display: flex;
	margin-top: 15px;
	padding-left: 60px;
	position: relative;

}

	.progressbar .step {
		width: 10px;
		height: 10px;
		border-radius: 50%;
		border: solid 1px #ff5900;
		display: flex;
		margin-top:5px;
		flex-direction: column;
		align-items: center;
	}

		.progressbar .step.active {
			background-color: #ff5900;
		}

		.progressbar .step .steptitle {
			font-size: 16px;
			color: #ff5900;
			position: absolute;
			top: -14px;
			width: 80px;
			text-align: center;
			font-weight: 500;
		}


	.progressbar .line {
		width: 80px;
		height: 10px;
		border-top: none;
		border-left: none;
		border-right: none;
		border-bottom: solid 1.5px #ff5900;
		margin-top: 1px;
	}

		.progressbar .line.larger {
			width: 100px;
		}

		.progressbar .line.triple {
			width: 160px;
		}

		.progressbar .line.double {
			width: 120px;
		}



/**** end Progress Bar */

.button.sqbutton3 {
	line-height: 1em;
	font-size: 13px;
	font-weight: 700;
	padding: 5px 14px 4px 14px;
	border: solid 1.5px;
}


	.button.sqbutton3.tall {
		padding: 15px 20px 15px 20px;
	}

.button.biground {
	border-radius: 20px;
	margin-bottom:30px;
}
.button.sqbutton3.full.biground{
	font-size:16px;
	width:80%;
}

.button.sqbutton3.full.orange {
	color: #fff;
	border-color: #ff5900;
	background-color: #ff5900;
	font-weight: 500;
}


.button.sqbutton3.orange {
	color: #ff5900;
	border-color: #ff5900;
	background-color: #fff;
	background: none;
	text-shadow: none;
}

.decoration {
	margin-bottom: 20px;
	height: 0.8px;
	display: block;
	background-color: rgba(0,0,0,0.4);
}

.decoration.smallmargin {
	margin-left: 8px;
	margin-right: 8px;
}

.decoration.tbmargin {
	margin-top: 30px;
	margin-bottom: 30px;
}

.decoration.tbsmargin {
	margin-top: 15px;
	margin-bottom: 15px;
}

.courseitem_wrapper b {
	font-size: 1em !important;
	color: #0caa93;
	font-weight: bold;
}



@media (max-width:1150px){
	.sqfeaturecontent {
		width: 70px;
	}
}
html {
  /*  background-color: #fff;*/
    margin: 0;
    padding: 0;
}

/*
body {
    background-color: #fff;
    border-top: solid 10px #000;
    color: #F1F1F1;
    font-size: 82.5%;
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
}

a {
    color: #333;
    outline: none;
    padding-left: 3px;
    padding-right: 3px;
    text-decoration: underline;
}

    a:link, a:visited,
    a:active, a:hover {
        color: #333;
    }

    a:hover {
        background-color: #c7d1d6;
    }

*/


header, footer, hgroup,
nav, section, topmenu {
    display: block;
	
}

mark {
    background-color: #a6dbed;
    padding-left: 5px;
    padding-right: 5px;
}


.float-left {
    float: left;
}

.float-right {
    float: right;
}

.clear-fix:after {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}
/*
h1, h2, h3,
h4, h5, h6 {
    color: #000;
    margin-bottom: 0;
    padding-bottom: 0;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.75em;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

    h5 a:link, h5 a:visited, h5 a:active {
        padding: 0;
        text-decoration: none;
    }
	*/
/* main layout
----------------------------------------------------------*/



.content-wrapper {	
	background-color:#fff;
    margin: 0 auto;
    max-width: 1150px;
	height:auto;
}

div.body .content-wrapper
{
	-webkit-box-sizing: border-box; /* Safari 3.0 - 5.0, Chrome 1 - 9, Android 2.1 - 3.x */
	-moz-box-sizing: border-box;    /* Firefox 1 - 28 */
	box-sizing: border-box;         /* Safari 5.1+, Chrome 10+, Firefox 29+, Opera 7+, IE 8+, Android 4.0+, iOS any */	
	/*padding:10px;*/
    
    padding:0px;

}


div.body {			
   background-color:none;
    clear: both;		
    padding-bottom: 20px;	
	position:relative;
	/*top:20px;*/
}



/* header */
header {
    height:38px;
}

	header .base-wrapper {
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100%;
		min-width: 900px;
		height: 38px;
		z-index: 1010;
		background-color:#2e9ce9;
		/*background-color: #ff5900; orange*/
		/*background-color:#77358C;*/
		/*#00adba; 2019 color*/
		/*#3366cc; 2018 color*/
		/*background-color:#6700B6; 2017 color*/
		/*background-color:#472f91; 2016 color*/
		/*background-color: #ffb453; 2015 color*/
		/*background-color:#006666; 2014 color*/
		/*background-color:#006F6D;*/
	}

header.orange{
	background-color:#FF5600;
}


	header .content-wrapper {
		position: relative;
		left: auto;
		min-width: 900px;
		background-color: #2e9ce9;
		/*background-color:#6700B6;2017 color*/
		/*background-color: #ffb453;2015 color */
		/*background-color:#006666; 2014 color*/
		height: 38px;
		top: 0px;
	}



  
    header .float-left,
    header .float-right {
        height:38px;
		line-height:38px;
    }


header .logoplaceholder
{
	width:130px;
	height:38px;
}

/* search button *
	---------------- */


.searchbox:focus
{
	border:none;
	border-style:none;
}

.searchbox {
/*important*/
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	background-color:transparent; /*important*/
	position:absolute; /*important*/
	top:-3px;
	left:5px;
	width:282px;
	height:22px;
	display:inline;
}
 
.searchbox_submit {
border:0px; /*important*/
background-color:transparent; /*important*/
position:absolute; /*important*/
top:-3px;
left:285px;
width:40px;
height:30px;
}


/* site title
----------------------------------------------------------*/

.site-title {
    color: #fff;
	line-height:38px;
    font-size: 1em; 
	margin:0;
	width:auto;
}

.site-title a, .site-title a:hover, .site-title a:active {
    background: none;
    color: #fff;
    outline: none;
    text-decoration: none;
}


/* nav */
nav
{
	
	position:relative;
	/*top:20px;*/
	/*min-width:1150px;*/
	/*max-width:1150px;*/
	width:100%;
	min-height:90px;
	height:90px;
	z-index:200;
	background-color:none;
/*	background-color:#fff;*/
}

nav .content-wrapper
{
	/*min-width:1150px;*/
	max-width:1150px;
	position:relative;
	left:auto;
	min-height:92px;
	height:92px;
	z-index:200;
	top:0px;

}

topmenu {
    position:relative;
    width:100%;
	min-height:40px;
	height:40px;
	z-index:1;
}

topmenu .content-wrapper
{
    background-color:transparent;
	/*min-width:1150px;*/
	max-width:1150px;
	margin: 0 auto;
	min-height:40px;
	height:40px;
	z-index:200;
	top:0px;
}

  
	#logo
	{	
		float:left;
		background-color:transparent;
		z-index:200;
		position:relative;
	}

	nav .logoholder{
		float:left;
		height:100%;
	}

	nav .logoholder img {
		height: 100%;
	}

	nav .menubarholder {
		height: 100%;
		float:left;
	}

	nav .top-level-menubar
	{
		z-index:200;
		position:absolute;
		/*left:100px;*/
		/*width:1000px;*/
		/*width:100%;*/
		bottom:0;
		list-style-type:none;
		margin-bottom:0px;
		/*margin-left:40px;*/
	}

	nav .top-level-link
	{
		text-decoration:none;
	}
	nav .top-level-link:hover
	{
		color:white;
		background-color:inherit;
	}

	nav .top-level-menuitem
	{
		padding-top:10px;
		padding-left:10px;
		padding-right:10px;
		margin-left:20px;
		display:inline-block;
		font-size:1.2em;
		padding-bottom:10px;
		z-index:1000;
	}

		nav .top-level-menuitem:hover {
			color: white;
			/*background-color: #88baff;*/
			/*background-color:#00CFCD;*/
			background-color: #2e7de9; /*#ff9900;*/
			/*background-color:#472f91;*/
			/*background-color:#6700B6;*/
			/* background-color:#3366cc;*/
		}


	nav .highlightlink,nav .highlightlink:hover
	{
		color:white;
	}

nav .highlightmenu, nav .highlightmenu:hover {
	/*background-color: #3399ff;*/
	/*background-color:#00AFAD;*/
	background-color: #2e7de9; /*#ff7d26;*/
	/*background-color:#6700B6;*/
	/* background-color:#3366cc;*/
	opacity: 0.95;
}



	nav .top-level-menuitem
	{
		*display: inline;
	}




/*** drop down menu panel*/
nav .drop-down-menu {
	position: absolute;
	top: 36px;
	left: 0px;
	/*background-color:#3399ff;*/
	/*background-color:#00AFAD;*/
	/*background-color:#ff7d26;*/
	/*background-color:#6700B6;*/
	background-color: #2e7de9;
	width: 670px;
	height: 200px;
	display: none;
	z-index: 1000;
}

	nav .menuitemlist
	{
	
		width:280px;
		margin-top:15px;
		margin-left:40px;
		float:left;
		list-style-type:none;
		
	}
		nav .menuitemlist.full {
			width: 600px;
			display:flex;
			flex-direction:row;
			flex-wrap:wrap;
		}

		nav .menuitemheader {
			/*	color:#005681;*/
			/*color:#472000;*/
			text-shadow: 4px 2px #2e7de9;
			color: #efefef;
			font-weight: bold;
			font-size: 1.1em;
		}


	nav .menuitemlist li
	{
		padding-top:10px;
	}
	
	nav .menuitemlist li a
	{
		color:#f1f1f1;
		text-decoration:none;
		font-size:0.9em;
	}

	nav .menuitemlist li a:hover
	{
		background-color:inherit;
		text-decoration:underline;
	}

	nav .menuitemlist.full div {
		box-sizing:border-box;
		padding-top: 10px;
		padding-right:10px;
		width:50%;		
	}

	nav .menuitemlist.full div a {

		color: #f1f1f1;
		text-decoration: none;
		font-size: 0.9em;
	}

		nav .menuitemlist.full div a:hover {
			background-color: inherit;
			text-decoration: underline;
		}



	

/* footer */



footer {
		
	display:block;	
    clear: both;
	background-color:none;
   /* background-color: #fff;*/
   /* font-size: .8em;*/
    height: auto;
}

footer .content-wrapper
{
	-webkit-box-sizing: border-box; /* Safari 3.0 - 5.0, Chrome 1 - 9, Android 2.1 - 3.x */
	-moz-box-sizing: border-box;    /* Firefox 1 - 28 */
	box-sizing: border-box;         /* Safari 5.1+, Chrome 10+, Firefox 29+, Opera 7+, IE 8+, Android 4.0+, iOS any */	
	padding:10px;
}


.stop-scrolling {

  width:100%;
  height:100%;
  overflow: hidden;

}

/* login
----------------------------------------------------------*/
#login
{
	display: block;
	font-size: .85em;
	margin: 0 0 10px;
	text-align: right;
}


    #login a {
        background-color: inherit;
		color: #fff;
        margin-left: 0px;
        margin-right: 0px;
        padding: 0px 0px;
        text-decoration: none;
    }

    #login a.username {
        background: none;
        margin-left: 0px;
        text-decoration: underline;
    }

    #login ul {
        margin: 0; float:left; display:inline; padding:0;  margin-right:3px;
    }

    #login li {
		margin-left:1px;
		margin-right:1px;
        display: inline;
        list-style: none;
		
    }


	/** login header */
   #login li.divider-vertical-second-menu
{
	
   height: 40px;
   width: 1px;
   margin-left:1px;
   margin-right:5px;
   overflow: hidden;
   background-color: #DDD;
   border-right: 1px solid #fff;
}

	 .LargestFont 
	{
		font-size:1.1em;
	}
	
	.MiddleFont 
	{
		font-size:0.9em;
	}

	
	.SmallFont 
	{
		font-size:0.7em;
	}


/* page elements
----------------------------------------------------------*/
/* featured */
div.featured {
   /* background-color: #fff;*/
  
	overflow:hidden;
	display:block;
	position:relative;
	margin:0;
	padding:0;
/*	clear:both;*/
	/*top:20px;*/
	

}


	div.featured section div.content-wrapper_default { /*container*/
		/*	background:url("../publicimages/Yi_Jin_Diploma_MainBanner_1.jpg") left no-repeat;*/
		/*margin: 0 auto;*/
		/*min-width:1150px;
	width: 1150px;
	*/
		/*max-width:1150px;*/
		width: 100%;
		height: 440px;
		/*background-color:#fff;*/
		padding-bottom: 0px;
		background: url('../Publicimages/Header/desktop-1.jpg') no-repeat center #83dbf1;
		background-size: cover;
	}

		div.featured section div.content-wrapper_default.slidesharestory {
			background: url('../Publicimages/Header/Web_Banner_SHAREB.jpg') no-repeat center #83dbf1;
			background-size: cover;
		}

		div.featured section div.content-wrapper_default.slidefeature {
			background: url('../Publicimages/Header/Web_Banner_3840x900_00.jpg') no-repeat center #83dbf1;
			background-size: cover;
		}

		div.featured section div.content-wrapper_default.slide2 {
			background: url('../Publicimages/Header/desktop-2.jpg') no-repeat center #83dbf1;
			background-size: cover;
		}
		div.featured section div.content-wrapper_default.slide3 {
			background: url('../Publicimages/Header/desktop-3.jpg') no-repeat center #83dbf1;
			background-size: cover;
		}

	div.featured section div.content-wrapper_default1 { /*container*/
		width: 100%;
		height: 440px;
		padding-bottom: 0px;
		background: url('../Publicimages/Header/Yi_Jin_Diploma_MainBanner_1b_2020_small.png') no-repeat center #43b7f1;
		background-size: cover;
	}

 div.featured section div.content-wrapper-boxed{
    margin: 0 auto;
	padding:0;

    max-width:1150px;
 }
 
.slick-slider-wrapper_banner {
     visibility: hidden;
}
.slick-slider-wrapper_banner.slick-initialized { visibility: visible; }


@media all and (min-width:1920px) {

	div.featured section div.content-wrapper {
		/*background: url("../Publicimages/Header/Web_Banner_3840x900_01.jpg") no-repeat center #6D1D7C;*/
		background-size: contain;
	}
	div.featured section div.content-wrapper_default {
		/*background: url('../Publicimages/Header/Web_Banner_3840x900_01.jpg') no-repeat center #6D1D7C;*/
		background-size: contain;
	}/*
		div.featured section div.content-wrapper_default.slide2 {
			background: url('../Publicimages/Header/Web_Banner_3840x900_01.jpg') no-repeat center #6D1D7C;
			background-size: contain;
		}
		 */
	 /*
		div.featured section div.content-wrapper_default.slide3 {
			background: url('../Publicimages/Header/Web_Banner_3840x900_01.jpg') no-repeat center #6D1D7C;
			background-size: contain;
		}
		 */


    div.featured section div.content-wrapper_default1 {
        background:url('../Publicimages/Header/Yi_Jin_Diploma_MainBanner_1b_2020.png') no-repeat center #43b7f1;
        background-size:contain;
    }
		
}

.banner_path_wrapper { /*Banner*/
       margin: 0 auto;
       width:1150px;
       height:100%;
       position:relative;
}

.shortcut_wrapper {
    position:relative;
    width:100%;
    /*height:236px;*/
    background-color:transparent;
    margin-top:-50px;
}

.banner_bottom_overlay {
	background: url(../publicimages/Header/mid_banner_gray.png) no-repeat transparent;
	background-position: center;
	background-size: cover;
	height: 252px;
	width: 1320px;
	margin: 0 auto;
	/*padding-right:13px;*/
}

.banner_bottom_overlay .column_wrapper {
    /*background-color:black;*/
    /*background:url(../publicimages/Header/slider.png) no-repeat;*/
    background-position:center;
    background-size:cover ;
    float:right;
    padding-right:20px;
    /*height:240px;*/
    width:945px;
    margin-top:40px;
    
}

.mydotclass {
    text-align:right !important;
}

.mydotclass1 {   
	z-index:10;
    left:5px;
    bottom:5px !important;
    text-align:left !important;
}

.slick-dots.mydotclass1 li {
    margin:0px;
}

.slick-dots.mydotclass1  li.slick-active button:before {
    color:white; 
}

.slick-dots.mydotclass1 .slick-dots li button:before {
   color:white; 
}

.slick-slider-wrapper_dl.downloadpanel.slick-slider.slick-dotted {
    margin-bottom: 0px !important;
}

.banner_bottom_overlay .button_wrapper {
    float:left;
    width:315px;
    height:195px;
    /*background:url(../publicimages/Header/shortcut.png) no-repeat;
    background-position:center;
    background-size:cover ;*/
    margin-left:10px;
    margin-top:12px;
    /*margin-top:35px;*/
}

.banner_bottom_overlay .column {
     /*   float:left;
        background-color:transparent;
        width:393px;
        height:161px;    */
        background-color:white;
        margin-right:0px;
        /*height:115px;*/
		margin-top:18px;
       /* border:solid 1px #AAA;*/
        text-shadow: 1px 1px 1px #DDD;
        font-weight:700;
		/* remove overlay */
        /*background:url(../publicimages/Header/front_bg3.png) no-repeat;
        background-position:center;
        background-size:cover ;*/
}

/*
.banner_bottom_overlay .column:nth-child(odd){
    margin-right:7px;
}
.banner_bottom_overlay .column:nth-child(even){
    margin-left:7px;
}
	*/

topmenu {
	background-color: #f7f7f7;
	/*background-image:
        linear-gradient(-24.6deg, #ffb757 0% ,#f39200 50%, #ffb757 100%);*/
}

topmenu .column_wrapper {
    float:right;
    height:40px;
}

topmenu .column_wrapper .column {
        float:left;
        padding-left:20px;
        padding-top:7px;
        vertical-align:middle;
        background-color:transparent;
        border:solid 0px;
        text-align:center;
        margin:0 auto;
}

    topmenu .column_wrapper .column img {
        margin-top:-5px;
        height:35px;
    }

   .content-banner_default 
{
		margin: 0 auto;
		/*
		min-width:1150px;
		width: 1150px;
		*/
		/*background-color:#029DC4;*/
        /*max-width:1150px;*/
		width:100%;
        margin-bottom:15px;
		
}

.fb-wrapper {
   /* padding-top:15px;*/
}

h2 {
  color:#77358C;
}

.td_news_date {
    width:140px;
    vertical-align:top;
}
.td_news_date .date {
    background-color:#77358C;
    width:120px;
    height:20px;
    padding: 12px 0px 12px 0px;
    color:#fff;
    text-align:center;
    font-size:1em;
}

.td_news_content .tbl_news_header a{
    font-size:1em;
}
.td_news_content .tbl_news_content {
    font-size:0.9em;
}

.insitute_intro li li.sqmorebutton a
{
	
	text-decoration:none;
	color:#fff;
}


        
/* page titles */
hgroup.title {
    margin-bottom: 10px;
}

hgroup.title h1, hgroup.title h2 {
    display: inline;
}

hgroup.title h2 {
    font-weight: normal;
    margin-left: 3px;
}


/* ordered list */
ol.round {
    list-style-type: none;
    padding-left: 0;
}

    ol.round li {
        margin: 25px 0;
        padding-left: 45px;
    }

        ol.round li.zero {
            background: url("../publicimages/orderedList0.png") no-repeat;
        }

        ol.round li.one {
            background: url("../publicimages/orderedList1.png") no-repeat;
        }

        ol.round li.two {
            background: url("../publicimages/orderedList2.png") no-repeat;
        }

        ol.round li.three {
            background: url("../publicimages/orderedList3.png") no-repeat;
        }

        ol.round li.four {
            background: url("../publicimages/orderedList4.png") no-repeat;
        }

        ol.round li.five {
            background: url("../publicimages/orderedList5.png") no-repeat;
        }

        ol.round li.six {
            background: url("../publicimages/orderedList6.png") no-repeat;
        }

        ol.round li.seven {
            background: url("../publicimages/orderedList7.png") no-repeat;
        }

        ol.round li.eight {
            background: url("../publicimages/orderedList8.png") no-repeat;
        }

        ol.round li.nine {
            background: url("../publicimages/orderedList9.png") no-repeat;
        }

/* content */
article {
    float: left;
    width: 70%;
}

aside {
    float: right;
    width: 25%;
}

    aside ul {
        list-style: none;
        padding: 0;
    }

        aside ul li {
            background: url("../publicimages/bullet.png") no-repeat 0 50%;
            padding: 2px 0 2px 20px;
        }

.label {
    font-weight: 700;
}

/* login page
#loginForm {
    border-left: solid 2px #c8c8c8;
    float: left;
    width: 55%;
}
	

    #loginForm .validation-error {
        display: block;
        margin-left: 15px;
    }

#safetyinfo {
    margin-left: 40px;
    float: left;
    width: 40%;
}

    #safetyinfo h2 {
        margin-bottom:  5px;
    }
	*/

fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

/* forms */
/*
fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

    fieldset legend {
        display: none;
    }
    
    fieldset ol {
        padding: 0;
        list-style: none;
    }

        fieldset ol li {
            padding-bottom: 5px;
        }

    label {
        display: block;
        font-size: 1.2em;
        font-weight: 600;
    }

    label.checkbox {
        display: inline;
    }

    input, textarea {
        border: 1px solid #e2e2e2;
        background: #fff;
        color: #333;
        font-size: 1.2em;
        margin: 5px 0 6px 0;
        padding: 5px;
        width: 300px;
    }

    textarea {
        font-family: inherit;
        width: 500px;
    }
    
        input:focus, textarea:focus {
            border: 1px solid #7ac0da;
        }

        input[type="checkbox"] {
            background: transparent;
            border: inherit;
            width: auto;
        }
        
    input[type="submit"],
    input[type="button"],
    button {
        background-color: #d3dce0;
        border: 1px solid #787878;
        cursor: pointer;
        font-size: 1.2em;
        font-weight: 600;
        padding: 7px;
        margin-right: 8px;
        width: auto;
    }

    td input[type="submit"],
    td input[type="button"],
    td button {
        font-size: 1em;
        padding: 4px;
        margin-right: 4px;
    }
	*/
/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.message-success {
    color: #7ac0da;
    font-size: 1.3em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.valid {
	color: #4bb204
}
.error {
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
    color: #e80c4d;
}

.field-validation-error1 {
    color: #e80c4d;
	padding:0;
	margin:0;
	padding-top:0;
	margin-top:0;
}


.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}

input.readonlyinput{
	color: #808080;
}


/* what news*/
/*.fb-page,
.fb-page span,
.fb-page span iframe[style] {
    max-width: 95% !important;
}*/
/*
.news_title a
{
	padding-left:15px;
}
	*/
/* tables
----------------------------------------------------------
table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;
    border: 0 none;
}

th {
	font-size: 1.2em;
    text-align: left;
    border: none 0px;
    padding-left: 0;
}

    th a {
        display: block;
        position: relative;
        
    }

	th a:link, th a:visited, th a:active, th a:hover {
		color: #333;
		font-weight: 600;
		text-decoration: none;
        padding: 0;
	}

	th a:hover {
		color: #000;
	}

    th.asc a, th.desc a {
        margin-right: .75em;
    }
    
    th.asc a:after, th.desc a:after {
		display: block;
        position: absolute;
        right: 0em;
        top: 0;
        font-size: 0.75em;
	}

	th.asc a:after {
		content: '▲';
	}

	th.desc a:after {
		content: '▼';
	}

td {
    padding: 0.25em 2em 0.25em 0em;
    border: 0 none;
}

tr.pager td {
    padding: 0 0.25em 0 0;
}
	*/



	div.collegesearchwrapper
	{
		max-width:850px;
	}

	ul.sqcourselist#collegesearch li a
	{
		/*
			width:330px;
		height:60px;
		padding:20px 20px 20px 20px;
		*/
		width:370px;
		height:100px;
		padding:3px 3px 3px 3px;
	}
	ul.sqcourselist#collegesearch 
	{
		/*height:86px;*/
		padding:0px 0px 0px 0px;

	}


	ul.sqcourselist#collegesearch li.last-child a
	{
		width:330px;
		height:60px;
		padding:23px 23px 23px 23px;

	}
	
ul.sqcourselist#collegesearch li div#lastblockimg {
	
	margin-top:14px;
	height: 8px;
	background-color:#ff9c8c;

}



	ul.sqsearch_result li b
	{
		color:#69B0E1;
		font-weight:bold;

}


.detail_content_cart {
	height: 300px;
	overflow: auto;
}

.detail_content_cart li{
	padding-left:15px;
	font-size:1.5em;
}

.content {
	min-height:440px;
	
}

#register1_confirm{
	float:left;
	width:auto;
	}

div.detail_content div.pcontent
{
	width:90%;
	padding-left:15px;
	font-size:1em;
}


.animate_cpoint {
	z-index:1010;
 
    position: absolute;
}


.animate_pop
{
	border: 1px #666 solid;
	padding: 10px;
	display: block;
	height: 100px;
	position: absolute;
	z-index:1030;
	background-color: transparent;
	width: 300px;
}

.message_content_pop
{
	border: 1px #666 solid;
	padding: 10px;
	display: block;
	position: relative;
	z-index:1030;
	background-color: #FFF;		
	left: -165px;
	width: 330px;
	height:160px;
	top:-160px;
    
}


.message_content_pop h1
{
	padding-bottom:10px;
}



.comparemenu{
	margin-top:10px;
	width:200px;
	font-size:0.8em;
	font-family: Arial,"微軟正黑體","Adobe 黑体 Std R", "新細明體", "細明體",  "MS Serif";
	color:#000;
	padding:1px;

}

.comparemenu ul {
	list-style:none;
	text-decoration:none;
	padding:0;
	margin:0;
	}


.comparemenu li{
	padding-top:4px;
	width:194px;
	padding-bottom:1px;
	border-left:#029DC4 1px solid;
	border-right:#029DC4 1px solid;
	text-align:center;
}

.comparemenu li:first-child{
	
	padding-top:12px;
	padding-bottom:10px;
	border-radius:8px 8px 0px 0px;
	border-top:#029DC4 1px solid;
	color:#333;
	font-size:1.2em;
	font-weight:bold;
/*	background-color:#acddfb;*/
	background-image:url("../publicimages/studentmenu_2018_03.png");
}

.comparemenu li.last-child{
	padding-bottom:12px;
	border-radius:0px 0px 8px 8px;
	border-bottom:#029DC4 1px solid;
}

li.SQChoiceType1
{
	color:#6FBA2C;
}

li.SQChoiceType0,li.SQChoiceType
{
	color:#336699;
}


.newsheadertext, a.newsheadertext
{
    font-weight:700;
	text-decoration:none;
	color:#005681;
}

a.newsdetails, a.newsdetails:visited  {
    color:#005681;
}

a.newsdetails {
    font-size:0.9em;    	
}

.div_oepayerror {
    width:100%;
    background-color:#e80c4d;
    color:#fff;
}


@media all and (min-width:1920px)
{
	
	
}


/* RESPONSIVE DISABLE SOCIAL BAR */

@media all and (max-width:1024px)
{
	
	#fblikebutton
	{
		display:none;
	}

	#fbbutton
	{
		display:none;
	}
  }

/* RESPONSIVE DISABLE BANNER  */



@media all and (max-width:1175px) {
    
    .shortcut_wrapper {
        display:none;
    }
    .fb-wrapper {
        display:none;
    }
    .news-wrapper {
        width:98%;
    }
	
	



	topmenu .content-wrapper {
		padding-left: 5px;
		padding-right: 5px;
	}

}
@media all and (max-width:950px)
{
	div.logoside
	{
		float: left;
	}
	.coursesearch.coursecatcontainer .coursecatcard {
		width: 45%;
	}
	
	nav
	{
		min-width:600px;
		width:600px;
        /*top:40px;*/
	}


	nav .content-wrapper
	{
		min-width:600px;
		width:600px;
	}
   
    
	
      
	nav .top-level-menubar
	{
		width:600px;		
	}

	div.featured
	{
		width:0px;
		display:none;
	}

	div.featured div
 	{
		width:0px;
		display:none;
	}




	
header .base-wrapper {
	min-width:600px;
}


header .content-wrapper
{
	min-width:600px;
}
#searchwrapper
{
		display:none;

}

.content
{
		min-width:460px;
}

	

}


/* DISPLAY LOGIN BAR HEADING */
@media all and (max-width:640px)
{
	
}

@media all and (max-width:740px)
{
	.coursesearch.coursecatcontainer .coursecatcard {
		width: 100%;
	}
	#lettersize
	{
		display:none !important;
	}
	#login li.hr
	{
		display: none;
	}
	

}


/* POP UP RESPONSIVE */


@media (min-device-height: 1000px)
{

	.news_content_pop.bigh .compare_course {
		height: 700px;
	}
	.news_content_pop.bigh .compare_course table {
		min-height:700px;
	}
	.news_content_pop.bigh
	{		
		height: 770px;
		top: -390px;
		 
	}
}

/* POP UP RESPONSIVE */

@media (min-device-width: 1440px)
{
	.centerpoint.wresponsive
	{
		z-index:1010;
		left: 15%;
		width:70%;
		position: fixed;
	}
	
	.news_content_pop.wresponsive
	{
		z-index:1010;
		width: 100%;	
		left: 0px;
		overflow:auto;
	}

	.centerpoint.responsive
	{
		z-index:1010;
		top: 15%;
		left: 15%;
		width:70%;
		height:70%;
		position: fixed;
	}
	
	.news_content_pop.responsive
	{
		height: 100%;	
		z-index:1010;
		width: 100%;	
		left: 0px;
		top: 0px;
		 *top: 0px;
		*height:100%;		
		overflow:auto;
	}
	.individual_course_detail.responsive {
		height: 100%;
		width:100%;
		overflow: auto;
	}
}